Question

WebKit和Microsoft浏览器是否支持使用-moz-tab-size和-o-tab-size属性指定标签宽度的方法，如Firefox和Opera？

例如，我希望<textarea>中的标签宽度为4个空格：

textarea {
    -moz-tab-size: 4;
    -o-tab-size: 4;
    /* How would I do this in Chrome, Safari, and IE? */
}

[更新：]

我创建了tab-size polyfill（Demo）：

<script> // tab-size polyfill
var codeElements = document.getElementsByTagName('code'), // Applies to all code elements. Adjust to your needs.
codeElementCount = codeElements.length,
e = d.createElement('i');

if(e.style.tabSize !== '' && e.style.mozTabSize !== '' && e.style.oTabSize !== '') {
    for(var i = 0; i < codeElementCount; i++) {
        codeElements[i].innerHTML = codeElements[i].innerHTML.replace(/\t/g,'<span class="tab">&#9;</span>');
    }
}
</script>

<style>
.tab {
    width: 2.5em; /* adjust to your needs */
    display: inline-block;
    overflow: hidden;
}
</style>

注意：这不适用于<textarea>，但仅适用于可包含其他元素的元素。如果浏览器支持tab-size，则会改为使用它。

Answer 1

tab-size目前仅由Firefox和Opera使用您指定的供应商前缀实现。

对于WebKit，there's a bug report请求实施该属性。我相信工作已经开始，正如该报告的评论中所见。

对于IE，我在IE9或IE10中找不到关于-ms-tab-size或tab-size实现的任何内容。我认为IE团队并不是更聪明的人。

Answer 2

似乎有一个similar question on this subject，但它并没有真正完全回答那个问题。但它确实引用了~~显然是tab stops do exist in CSS~~ ，尽管我无法想象浏览器支持对它来说非常棒。

Searching on google因为它没有提供关于~~主题的信息，所以进一步让我相信它没有很好地实现，或者使用~~。希望有所帮助。

修改

W3C链接确实提到制表位，但它只是一个工作草案 - 一个提案，并没有实施。

标签宽度CSS属性

[更新：]

2 个答案:

修改