<div>劃分頁面為邏輯區(qū)或邏輯分組。
邏輯區(qū)（logical section）：頁面上彼此相關(guān)的一組元素领虹。
- 在屬于一個邏輯區(qū)的元素前后放上
<div></div> - 可以使用id屬性為邏輯區(qū)提供標識
為什么需要邏輯區(qū)贰拿？
- 幫助理解頁面蛤袒；
- 可能真的去需要通過邏輯區(qū)構(gòu)建頁面。
tips
-
<div>中可以嵌套<div> - 切記濫用
<div>
若body與div中都有h2壮不，而我們只想改變div中h2的樣式汗盘，可以使用以下方法：
div h2{ color }
如果有多個div，可以用該div的標簽號表示询一，如：
#pets h2{ color }
該方法可以多層次嵌套：
#pets blockquote h2{ color }
同一對象的不同屬性可以寫在一行隐孽，簡化代碼，如：
border-width：thin; border-style:solid; border-color:#007e7e;
以上三行可以直接寫成：
border:thin solid #007e7e; 順序不重要健蕊。
內(nèi)外邊距也可以寫一行菱阵，按照上右下左的順序。
若山下缩功，左右等距晴及，可以只寫兩個值，先上下嫡锌，后左右虑稼。
<span>建立內(nèi)聯(lián)元素的邏輯分區(qū)琳钉。
對于<a>的修改，
link:未點擊過該鏈接的狀態(tài)
visited:已訪問過該鏈接
hover:鼠標懸停于鏈接上的狀態(tài)
注意蛛倦！“a:link”中間不能有空格歌懒。
a:link{ color:green; } a:visited{ color: red; } a:hover{ color:yellow; }
這種形式的類稱為偽類
開發(fā)者會為一個頁面制作多個樣式表，用戶也可以自己制作樣式表溯壶，瀏覽器有自己的默認樣式表及皂，9如何確定一個元素使用哪個樣式？
這就是層疊問題且改。
當瀏覽器要確定<h1>中font-size屬性的層疊時验烧，需要如下步驟：
- 收集所有樣式表（開發(fā)者，用戶又跛，瀏覽器默認）碍拆；
- 找到所有的
<h1>下，所有關(guān)于font-size的規(guī)則效扫； - 對所有匹配的樣式表排序
開發(fā)者>用戶>瀏覽器默認倔监； - 按照特定性對某個樣式表中的規(guī)則排序
| id | class or pseudoclass | elements |
|---|---|---|
| 百位 | 十位 | 個位 |
某個規(guī)則直砂，如果對應(yīng)一個id百位加1分菌仁，對應(yīng)一個類或者偽類，十位加1分静暂，有一個元素济丘，則個位加1分。得分越多越重要洽蛀。摹迷；
5.對于沖突規(guī)則，在樣式表中位置越靠后郊供，越重要峡碉。
用戶可以在他的屬性后添加!important覆蓋開發(fā)者的樣式
如：
h1{ color:red; !important }
float 屬性，使一個塊元素單獨成為一列驮审。
