(1) Parent-child selector can have multi-level, but the actual application does not recommend too much, not more than three layers.
(2) The parent-child selector has a strict hierarchical relationship.
(3) A parent-child selector can be a combination of many types of selectors, such as:
#id span Span
. CLS1 #id Span
Div #id. style1
(4) When using a parent-child selector, the following sentence is used for the header of the HTML file:
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en"
"Http://www.w3.org/TR/html4/loose.dtd" >
The following example is a three-layer,<div> for the parent,<span>,<a> for the Sun
Cases:
HTML file:
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en"
"Http://www.w3.org/TR/html4/loose.dtd" >
<title> Parent-Child selector </title>
<link rel= "stylesheet" type= "Text/css" href= "Test.css"/>
<body>
<div id= "ID1" ><span> Thank you for visiting <a href= "http://www.bianceng.cn" >www.bianceng.cn</a></span , hope to help you! </div>
</body>
Content of Test.css:
/* Parent-Child Selector * *
#id1 {
Background-color:silver;
font-size:20px;
Color:black;
}
#id1 span{
color:red;
Font-style:italic;
}
#id1 span a{
Color:green;
Text-decoration:none;
}The effect of the following figure:
More Wonderful content: http://www.bianceng.cnhttp://www.bianceng.cn/web/Css/
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
