如何在MediaWiki表中将表格标题垂直放置？

我试图将MediaWiki表中的标题从水平变为垂直。这样，表格数据应该有更多空间。如何在MediaWiki表中将表格标题垂直放置？

，我发现这个链接到MediaWiki模板，可以在任意方向转动文字

https://en.wikipedia.org/wiki/Template:Transform-rotate

这基本上工作，但它并没有解决这个问题：在表中它接缝，在网络浏览器首先细胞layouted然后旋转文本。这样，所有表头单元格将在执行旋转后覆盖相同的空间量，这不能解决我的问题。我需要相反的方法：首先旋转文本，然后布置表格。

CSS如何实现？如何在表格标题中使文本垂直以节省水平空间？

来源

2017-10-18 Regis May

https://stackoverflow.com/questions/6997631/how-to-display-vertical-text-in-table-标题与自动高度无文字ov /重复或不？ –

@ G-Cyr当然看起来像...你想要dupehammer它还是我？ –

@Paulie_D ??你能用简单的语言来表达我的意思吗，不太清楚我明白你想说什么吗？我的英语水平一般你知道... –

感谢StackOverflow我能够知道没有简单的解决方案，甚至可能根本就没有解决方案。但它可能与CSS3。

为了垂直MediaWiki的表中显示的文字，你需要做到以下几点：

自动换行部分在span标签
使用以下CSS设置垂直显示：
- writing-mode: sideways-lr; - 这将使垂直从下到上书写风格
- white-space: nowrap; - 这将防止文字换行;这样你得到干净的垂直线
- min-width: 20px; - 这种方式，您将确保垂直线条不会得到太小

这甚至工作在语义维基媒体查询。您可能想要将此用于结果表的标题。例如：

{{#ask: [[DevReg:+]] [[DeviceType::Switch]] 
|?DeviceManufacturer={{VerticalText|Manufacturer}} 
|?DeviceModel={{VerticalText|Model}} 
|?DevicePortsGBit={{VerticalText|Ethernet ports}} 
|format=table 
}}

模板VerticalText应该这样被定义：

<includeonly><span style="writing-mode: sideways-lr; white-space: nowrap; min-width: 20px;">{{{1}}}</span></includeonly>

来源

2017-10-18 21:08:54

我相信''writing-mode：sideways-lr;'目前只支持firefox。 https://developer.mozilla.org/fr/docs/Web/CSS/writing-mode（写模式是在IE5或更低版本中引入的，用不同的语法顺便说一句，它也是触发噩梦“haslayout”的一种方式） –

感谢您提供这些信息。无论如何，我会假设这样的垂直文本解决方案应该被认为是非常新的。但随着时间的推移，CSS3的支持将会增长，所以我认为使用这种干净的方法应该是最好的方式，即使还没有每个浏览器都支持它。在所有情况下，您可能都想尝试用'vertical-lr'替换'sideways-lr'，这可能已被浏览器支持。但是，文本从上到下垂直运行，看起来有点过分。请记住，通过这种模板方法，您可以随时在任何时候改变方向。 –

也许我链接到一个错误的潜在副本..看到演示和解决方案横向-r https://codepen.io/gc-nomade/pen/EKQKBe它也包括旧的浏览器:) –

如何在MediaWiki表中将表格标题垂直放置？

回答

相关问题