Html 覆盖 text-align 属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14961695/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Override a text-align property
提问by Kevin
I would like to override a text-alignproperty in my code. I have this HTML-code:
我想text-align在我的代码中覆盖一个属性。我有这个 HTML 代码：
<style>
table { text-align: center; }
.align_left { text-align: left; }
</style>
<table>
<tr>
<td class="align_left">Align left ?</td>
<td>Align center ?</td>
</tr>
</table>
What is the best way to do this?
做这个的最好方式是什么？
回答by Hugo Giraudel
I think you don't have to override anything in the sample of code you gave us. It seems perfectly fine.
我认为您不必覆盖您提供给我们的代码示例中的任何内容。看起来完全没问题。
However if you ever need to override a CSS rule, you have multiple ways to do it:
但是，如果您需要覆盖 CSS 规则，您有多种方法可以做到：
By setting a rule with higher specificity
table td.align-left { text-align:left }
vs
td { text-align:left }By setting a rule with the same level of specificity but later in the stylesheet
table td { text-align:left }
table td { text-align:center } /* this line overrides the one above */By setting
!importanttable td { text-align:left !important }
通过设置具有更高特异性的规则
table td.align-left { text-align:left }
vs
td { text-align:left }通过在样式表中设置具有相同特异性级别的规则
table td { text-align:left }
table td { text-align:center } /* 这一行覆盖了上面的那一行 */通过设置
!important表 td { 文本对齐：左！重要}
回答by Les McCutcheon
td {text-align:center;}
td.align_left { text-align:left;}
If you are only targeting modern browsers you could also use :first-of-type to target the first td.
如果您只针对现代浏览器，您还可以使用 :first-of-type 来定位第一个 td。
回答by James Donnelly
Are you trying to override both the tableand .align_leftstyles, or is .align_leftsomething you've tried? The class should override the element:
您是要同时覆盖table和.align_left样式，还是.align_left您已经尝试过？该类应覆盖该元素：
table td { text-align:center; }
table td.align_left { text-align:right; }
