Html 将 CSS 规则应用于 div 内的嵌套类
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9198327/
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
Apply CSS rules to a nested class inside a div
提问by Mazzy
I don't know exactly how to apply CSS to a nested element. Here is my example code, but I'm looking for a manual that explains all the rules:
我不知道如何将 CSS 应用于嵌套元素。这是我的示例代码,但我正在寻找解释所有规则的手册:
<div id="content">
<div id="main_text">
<h2 class="title"></h2>
</div>
</div>
How can I apply CSS to only the class title
, nested inside that particular div
?
如何仅将 CSS 应用于title
嵌套在该特定内部的类div
?
回答by Will P.
You use
你用
#main_text .title {
/* Properties */
}
If you just put a space between the selectors, styles will apply to all children (and children of children) of the first. So in this case, any child element of #main_text
with the class name title
. If you use >
instead of a space, it will only select the direct child of the element, and not children of children, e.g.:
如果您只是在选择器之间放置一个空格,则样式将应用于第一个的所有子项(和子项的子项)。所以在这种情况下,任何#main_text
具有类名的子元素title
。如果您使用>
而不是空格,它只会选择元素的直接子元素,而不是子元素的子元素,例如:
#main_text > .title {
/* Properties */
}
Either will work in this case, but the first is more typically used.
在这种情况下,任何一种都可以使用,但第一种更常用。
回答by Sunil Rajput
Use Css Selector for this, or learn more about Css Selector just go here
https://www.w3schools.com/cssref/css_selectors.asp
为此使用 Css 选择器,或了解有关 Css 选择器的更多信息,请访问此处
https://www.w3schools.com/cssref/css_selectors.asp
#main_text > .title {
/* Style goes here */
}
#main_text .title {
/* Style goes here */
}
回答by Ciprian
If you need to target multiple classes use:
如果您需要定位多个类,请使用:
#main_text .title, #main_text .title2 {
/* Properties */
}