标签宽度CSS属性

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-sizepolyfill(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>s,但仅适用于可包含其他元素的元素.如果浏览器确实支持tab-size它,那么将使用它.

Answer 1

tab-size 目前只有Firefox和Opera使用您指定的供应商前缀实现.

对于WebKit,有一个错误报告要求实现该属性.我相信工作已经开始,正如该报告的评论中所见.

对于IE,我在IE9或IE10中找不到任何关于-ms-tab-size或tab-size实现的内容.我认为IE团队并不是明智之举.