td里面的CSS填充文本不起作用

Question

我有这个简单的HTML:

<table class="code_editor">
    <tr><td>RUN</td></tr>
    <tr><td>#include &#60;stdio.h&#62;</td></tr>
    <tr><td>int main(){</td></tr>
    <tr><td class="1indent">char answer[256];</td></tr>
    <tr><td class="1indent">printf("%s","Hello World!\n");</td></tr>
    <tr><td class="1indent">printf("%s","You can read this:");</td></tr>
    <tr><td class="1indent">if( scanf("%s", &answer) == 1 )</td></tr>
    <tr><td class="2indent">goto About_Me;</td></tr>
    <tr><td class="1indent">return 0;</td></tr>
    <tr><td>}</td></tr>
</table>

还有这个简单的CSS:

.1indent{
    padding-left: 10px;
}
.2indent{
    padding-left: 20px;
}

但是,为什么我的填充不影响我<td>？这是我的小提琴 这里肯定有一个愚蠢的错误..

Answer 1

在CSS2类中,标识符不能以数字开头,[0..9] 除非你将它们转义为例如.\1indent

所以你可以使用属性选择器

[class="1indent"] {
    padding-left: 10px;
}
[class="2indent"]  {
    padding-left: 20px;
}

http://jsfiddle.net/cnoLrs1h/

或者您可以将标识值作为后缀

.indent1 {
    padding-left: 10px;
}
.indent2 {
    padding-left: 20px;
}

http://jsfiddle.net/s7exbr0r/