div邏輯區(qū)
-
在頁(yè)面中使用<div>可以將頁(yè)面分解為邏輯區(qū)荡碾，保證了結(jié)構(gòu)清晰并便于指定樣式但狭。
div的使用代碼示例如下：
<div id="fav"> //屬性說(shuō)明邏輯區(qū)
<div id="color"> //顏色邏輯區(qū)
<h3>my favorite color:</h3>
<ol>
<li>red</li>
<li>blue</li>
<li>orange</li>
</ol>
</div>
<div id="city"> //訪問(wèn)城市邏輯區(qū)
<h3>the cities i have visited:</h3>
<ul>
<li>tianjin</li>
<li>beijing</li>
<li>qingdao</li>
</ul>
</div>
</div>
-
子孫的選擇
選擇邏輯區(qū)的某些元素的子孫元素钠绍，使用示例如下：
#fav h3{
color:black;
}
說(shuō)明：（該規(guī)則選擇了id為fav的<div>所有子孫h3元素）
fav:父元素
h3:子孫元素
span邏輯分組
-
利用<span>可以創(chuàng)建內(nèi)聯(lián)字符和元素的邏輯分組
span使用代碼示例如下：
<ul>
<li><span class="position">wudadao</span>,<span class="city">tianjin</span></li>
<li><span class="position">changcheng</span>,<span class="city">beijin</span></li>
<li><span class="position">badaguan</span>,<span class="city">qingdao</span></li>
</ul>
指定span樣式：
.position{
font-style:italic;
}
-
span與em媒熊，strong的區(qū)別
em結(jié)構(gòu)用來(lái)強(qiáng)調(diào)某些文字宏胯，strong結(jié)構(gòu)用來(lái)強(qiáng)調(diào)一個(gè)重點(diǎn)溯祸。而span只是用來(lái)改變某些文字的樣式
偽類
-
偽類的運(yùn)用
例如對(duì)于a元素來(lái)說(shuō)會(huì)有3個(gè)狀態(tài)：未訪問(wèn)肢专，已訪問(wèn)，懸停在鏈接上方焦辅。則可以對(duì)不同的狀態(tài)設(shè)置不同的屬性博杖。示例代碼如下：
a:link{ //未訪問(wèn)
color: green;
}
a:visited{ //已訪問(wèn)
color: red;
}
a:hover{ //懸停于鏈接上方
color:yellow;
}
