CSS ??? ? ?? ???
??? ???
h2 ??? ??? ?? ???? ??? ??? ??? ?????. ?? ???? ?? ?? ?? ??? ?? ??? ???? ????.
h2, p {color:gray;}
h2 ? p ??? ?? ??? ???? ??? ???? ??? ?????. ??? ???(??:??;)? ? ? ???? ???? ??? ?????. ??? ??? ? ?? ?? ?? ???? ???? ??? ????? ?????. ? ??? ??? ??? ??? ??? ?????. ?? ???? ?????.
?? ?? ??? ??? ???? ???? ? ????.
?? ?? ?? ??? ???? ??? ??? ??? ?? ??? ??? ? ????:
body, h2, p, table, th, td, pre, Strong , em {color:gray;}
?: ???? ???? ?? ?? ??? ???? ?? "??"?? ?? ??? ??? ??? ?? ? ????.
?? ? ?? ?? ??? ??? ??? ??? ?? ?? ? ?? ???? ?????.
/* ??? ?? */
h1 {color :blue;} h2 {color:blue;} h3 {color:blue;} h4 {color:blue;} h5 {color:blue;} h6 {color:blue;}
/* ??? */
h1, h2, h3, h4, h5, h6 {color:blue;}
?:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>實例</title>
<style type="text/css">
h1, h2, h3, h4, h5, p{
color:purple;
font-size:15px;
}
h2.special, .special, #one{
text-decoration:underline;
}
</style>
</head>
<body>
<h1>集體聲明h1</h1>
<h2 class="special">集體聲明h2</h2>
<h3>集體聲明h3</h3>
<h4>集體聲明h4</h4>
<h5>集體聲明h5</h5>
<p>集體聲明p1</p>
<p class="special">集體聲明p2</p>
<p id="one">集體聲明p3</p>
</body>
</html> ?? ???
?? ?? ??:
1. ID ?? ??? #myid.myclass: <p id="sp" class="myclass"></p>.
2. ??? ?? ??? ?? ???? ?????. .important.warning <p class="important warning">??? ???? ??? ?????. ?? ? ???? ?? ???? ???? ??? ????.
3. id ?? ?? ??? ??. #myid .myclass <div id="myid"><p class="myclass"></p></div>
4. ?? ?? ??? ??????. p .myclass <p><span class="myclass"></span></p>
4. ?? ?? ??? ID???. p #myid<p><span id="myid"></span></p>
5. ??? ??? ?? ??. .myclass span <p class="myclass"><span>dd</span></p>
6. id ?? #myid #myid2 <div id="myid ?? id ?? " ><div id="myid2"></div></div>. id? ???? ?? ??? ???? ?????.
7. .myclass1 .myclass2? ? ???? ???? ?? ??? ???? ???? ?????. ???? ??? ?? ??? ?? ????. ??? ? .myclasses ??? ??? ??? ? ???? ?? ??? ?????
8. ?? ?? ?? ?? ?? pspan <p><span></span></p>
?:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>實例</title>
<style type="text/css">
#top {
background-color: #ccc;
padding: 1em
}
#top h1 {
color: #ff0;
}
#top p {
color: red;
font-weight: bold;
}
</style>
</head>
<body>
<div id="top">
<h1>Chocolate curry</h1>
<p>This is my recipe for making curry purely with chocolate</p>
<p>Mmm mm mmmmm</p>
</div>
</body>
</html>
