Html 内联 CSS 可以应用于嵌套在样式元素中的子元素吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10833075/
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
Can inline CSS apply to child elements nested in the styled element?
提问by Esteis
This is the problem in a nutshell:
简而言之，这是一个问题：
- I want to apply the style
vertical-align: topto every<tr>in a table, withoutmanually applying the style to every row. - I have to use inline CSS because I'm on a wiki, so I can't edit
the external style sheet, or edit the
<head>to embed a style. - When I add a style attribute to a
<table>tag, it appears this style is not passed on to its child elements. (I can see how this is nearly always a good thing.) - I can't use
<style><!--...--></style>, because that is not a permitted tag on MediaWiki pages.
- 我想将样式
vertical-align: top应用于<tr>表中的每个，而不是手动将样式应用于每一行。 - 我必须使用内联 CSS，因为我在 wiki 上，所以我无法编辑外部样式表，也无法编辑
<head>嵌入样式。 - 当我向
<table>标签添加样式属性时，该样式似乎没有传递到其子元素。（我可以看出这几乎总是一件好事。） - 我不能使用
<style><!--...--></style>，因为这不是 MediaWiki 页面上允许的标签。
Should I resign myself to adding style="vertical-align: topto every <tr>, or is still a solution I am overlooking?
我应该放弃自己添加style="vertical-align: top到 each <tr>，还是仍然是我忽略的解决方案？
EDIT: Removed a lump of background info, in order to limit the question to what the question title suggests it is about.
编辑：删除了一堆背景信息，以将问题限制在问题标题所暗示的内容上。
采纳答案by Quentin
Can inline CSS apply to child elements nested in the styled element?
内联 CSS 可以应用于嵌套在样式元素中的子元素吗？
Not directly.
不直接。
Indirectly, only if the child element has that-property: inheritset in its existing stylesheet.
间接地，仅当子元素已that-property: inherit在其现有样式表中设置时。
回答by Cameron Drake
I was interested in this question from a different context, specifically for styling html emails. Since css can't be added to the head of an email in gmail (believe it or not) the only way to consistently apply email styles is inline.
我对来自不同上下文的这个问题很感兴趣，特别是对于 html 电子邮件的样式。由于 css 无法添加到 gmail 中的电子邮件的头部（信不信由你），因此一致地应用电子邮件样式的唯一方法是内联。
The answer to this question is no, there is no acceptable way to circumvent the problem in this or any other context that I'm aware of. When approaching a problem like this it is helpful to think about whether the style that you are trying to apply should be an "exception" or a "rule", i.e. if 90% of your tds are vertically-aligned top, you should just apply the style as a rule and go through and correct the 10%. When doing this it's important that you clearly specify your exceptions, preferably with a comment block that references the "rule".
这个问题的答案是否定的，在这个或我所知道的任何其他上下文中，没有可接受的方法来规避该问题。在处理这样的问题时，考虑一下您尝试应用的样式应该是“例外”还是“规则”是有帮助的，即如果 90% 的 tds 是垂直对齐的顶部，您应该只应用风格作为一项规则，并通过并纠正 10%。执行此操作时，重要的是您明确指定您的例外，最好使用引用“规则”的注释块。
For full reference on what css is supported and where this is very helpful: http://www.campaignmonitor.com/css/
有关支持什么 css 以及这非常有用的完整参考：http: //www.campaignmonitor.com/css/
回答by Lex Eichner
Im not familiar with Wiki's but can you create a class and apply a style to all child nodes in that class?
我不熟悉 Wiki，但是您可以创建一个类并将样式应用于该类中的所有子节点吗？
So ...
所以 ...
<style type="text/CSS"><!-- SomeClass tr { vertical-align: top } --></style>
<table class="SomeClass">
</table>
Worth a try?
值得一试？
回答by Mark Adesina Omoniyi
Use following :
使用以下：
<style type="text/css">
table tr td {
vertical-align:top;
}
</style>
