指定标签宽度?

是否有可能定义的标签宽度当显示空白(比如在一个<pre>标签或东西)? 我无法find任何与CSS做到这一点,但这似乎是一个很常见的事情要做。

在我的情况下,选项卡的宽度是如此之广,导致我的一些页面上的代码片段太宽。 如果我能以某种方式缩短标签宽度,使其不需要滚动条,它会使事情变得更容易。 (我想我可以用空格replace标签,但理想情况下,我希望find一种方法来做到这一点,而不是这样做)

我相信这个博客应该帮助你:

这是一个解决scheme,它不是整洁,因为它必须为每个选项卡的实例完成,但它使得选项卡占用较less的空间,并保留从浏览器复制的格式(显然用“A SINGLE TAB HERE”replace为真正的标签,这个博客软件会自动从条目中删除标签):

<span style="display:none">A SINGLE TAB HERE</span><span style="margin-left:YOUR NEW TAB WIDTH"></span> 

基本上,用代码片段replace代码中的每个选项卡实例(select合适的宽度后,可以很容易地在样式表中实现)。 代码人工插入边距,同时保持代码中的原始选项卡准备好复制/粘贴。

顺便说一句,它看起来像tab stops在CSS规范 。

还有另一个关于这个问题的堆栈溢出问题。

使用tab-size属性 。 您目前需要供应商前缀。 例:

 pre { -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; } 

另请参阅developer.mozilla.org上的文章: tab-size 。

 .tabstop { -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; } 
 Unstyled tabs (browser default) <pre> one tab two tabs three tabs </pre> Styled tabs (4em) <pre class="tabstop"> one tab two tabs three tabs </pre> 

正如乔治·史托克(George Stocker)指出,制表站应该会在未来的CSS(FF4应该有),但在同一时间…

链接的博客文章的问题是,从浏览器复制/粘贴时,不会复制这些选项卡。 作为替代尝试以下方法:

 <style> .tabspan{ display:inline:block; width:4ex; } </style> <pre> int main() { <span class=tabspan>\t</span>return 0; } </pre> 

上面的“\ t”是实际的制表符。 现在应该复制并正确粘贴。 不如在<pre>标签上贴上css属性,但这是生活。

(PS回复了这个旧post,因为它的'css标签宽度'谷歌的高,我来到这里后不久,这个解决scheme。