11_CSS後代選取器_字代選取器-所謂的後代就是被包在HTML標籤裡面的HTML標籤\02
11_CSS後代選取器_字代選取器-所謂的後代就是被包在HTML標籤裡面的HTML標籤\02
css file
/*
子代選取器-若��我們只打算替某些元素 (element) 的子代 (child) 制定規則 (rule) ，這時可用子代選取器 (child selector) 。
<div>
<p>
<span>A prison for your mind.</span>
</p>
<p>
<span>Free your mind.</span>
</p>
</div>
此例的 <div> 有兩個 <p> ，因此兩個 <p> 都�� <div> 的子代，也��後代 (descendant) ， 兩個 <p> 中各自有一個 <span> ，因此 <span> �� <p> 子代，同時兩個 <span> 也都�� <div> 的後代。
*/
div {
color: yellow;
background-color: black;
}
p {
color: red;
}
p > span {
color: lime;
}
div > span {
color: white;
}
|
html file
<html>
<head>
<title>網頁標題</title>
<linkrel="stylesheet"type="text/css"href="02.css">
</head>
<body>
Choice. The problem is choice.
<p>Believe the unbelievable.</p>
<p>
<span>Free your mind.</span>
</p>
<span>Everything that has a beginning has an end.</span>
<div>Because I choose to.</div>
<div>
<span>There is no spoon.</span>
</div>
</body>
</html>
|