在HTML中以4個空格呈現Tab字符（在PRE元素中）？

可能重複：
Specifying Tab-Width?在HTML中以4個空格呈現Tab字符（在PRE元素中）？

我需要在預先標籤打印製表符。標籤的HTML字符是	，但在我試過的所有瀏覽器中，它呈現爲8個空格。

有沒有一種方法可以調整這個呈現爲4個空格的寬度或者是否有另一個HTML字符我可以使用4個空格？

2012-10-02 jhchen

雖然我與你還不如干脆把4位的第一個答案同意，那裏似乎是對CSS中的tab-size屬性一些支持（雖然IE支持缺乏）：

pre { 
    -moz-tab-size: 4; /* Firefox 4+ */ 
    -o-tab-size:  4; /* Opera 11.5 & 12.1 only */ 
    tab-size:   4; /* Chrome 21+, Safari 6.1+, Opera 15+ */ 
}

僅在使用white-space: pre或white-space: pre-wrap（或<pre>標籤）內有效。

來源

2012-10-02 23:54:22 deizel

雖然瀏覽器對'tab-size'的支持目前非常有限（根據[MDN]（https://developer.mozilla.org/en-US/docs/CSS/tab-size）） - 他們聲稱「-moz」的前綴版本已經在FF中支持了很長時間，但是Chome在21之前不支持它，Opera沒有支持到10.6，IE可能根本不支持它。它提供的演示當然不適用於IE8。 – DaveRandom

有一系列可以使用的四個字符，它總是擴展到四個空格。這是四個空格（至少在pre之內，其他元素的樣式恰當）。

由於目前還沒有普遍認同的方法來確定選項卡應該有多寬以及應該如何表現，所以最好不要在需要精確控制輸出外觀的地方使用它。 HTML和瀏覽器都不提供設置選項卡寬度的方法。

來源

2012-10-02 23:40:34 Joey

Pfft。 *每個人*知道標籤是3個空格。 – 2012-10-02 23:52:50

雖然他們想要四個空間。不能做太多的事情。 – Joey

CSS是處理此觀看目的的最佳途徑。但是，如果你希望人們能夠複製/粘貼文本並獲得一個製表符的四個空格，那麼你將最終使用Javascript來修改你的pre標籤。

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
</head> 
<body> 
    <pre class="downtab">All Tabs Changed a little.</pre> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $(".downtab").each(function() { 
       var text = $(this).html().replace(/\t/g, ' '); 
       $(this).html(text); 
      }); 
     }); 
    </script> 
</body> 
</html>

這裏真正的魔力是replace（）函數，使用全局匹配的正則表達式。

來源

2012-10-03 00:08:07 slashingweapon

按HTML規範和瀏覽器練習，製表位是每8個字符。這並不意味着一個標籤是8個空格。例如，如果您有ABC DEF，那麼該選項卡會導致5個字符的提前。

在CSS中，通過CSS3草稿，您可以set the 「tab size」，即製表位之間的距離，例如， tab-size: 4。瀏覽器支持相當不錯，當使用供應商前綴時，除IE外。

來源

2012-10-03 06:11:39

在HTML中以4個空格呈現Tab字符（在PRE元素中）？

回答

相關問題