【B/S】牛腩新聞釋出系統——CSS

what？

答：層疊樣式表，是一種用來表現HTML或XML等檔案樣式的計算機語言。CSS不僅課可以靜態的裝飾網頁，還可以配合各種指令碼語言動態地對網頁各元素進行格式化。在新聞釋出系統就是使用CSS對頁面進行美化的。

知識介紹

選擇器

1、ID選擇器
對於ID大家其實並不陌生，一個元素的ID是唯一的，而且這個選擇是在CSS中經常使用，而且具有較高的級別，一般在CSS中編寫使用“#”代表。
例如：

#search {
    height: 27px;
}

<div id="searchres" >
</div>

2、類別選擇器
說起類（class）他可是很出名的，而這裡的類別選擇器也是常用的選擇器之一，用class表示，在CSS中，使用“.”進行表示。
例如：

.search {
    height: 27px;
}

<div class="searchres" >
</div>

3、標籤選擇器
首先要知道什麼是標籤？
答：標籤限定了文件的開始和結束點，在他們之間是文件的頭部與主體。例如：p標籤，a標籤等等
例如：

li{
    text-align:center;
    margin:20px;
}

<li><a href="#">首&nbsp;&nbsp;&nbsp;&nbsp; 頁</a></li>
<li><a href="#">體育新聞</a></li>
 <li><a href="#">財經新聞</a></li>
<li><a href="#">社會新聞</a></li>

4、後代選擇器
後代選擇器也稱為包含選擇器，用來選擇特定元素或元素組的後代，將對父元素的選擇放在前面，對子元素的選擇放在後面，中間加一個空格分開。後代選擇器中的元素不僅僅有兩個，也可以是多個，這個和口頭上說的後代有相同的含義。
例如：

#newscontent .con{
    text-indent:2em;/*讓段落首行縮排2個字元*/
    line-height:20px;/*行間距*/
}
<div id="newscontent" class="commonfrm">
	<p>
            <asp:Label ID="lblContent" runat="server" Text=""></asp:Label>
        </p>
    </div>

有這麼多的選擇器，在使用的時候又是如何區分他們的等級的呢？
優先順序：ID選擇器 > 類選擇器 > 標籤
後代選擇器一般要根據它是由那幾個選擇器一起使用的。
PS：當樣式出現矛盾的時候，與css樣式的排列順序有關係，以後面的順序為主

連結

在B/S中a標籤經常使用，那麼對於a標籤你有那些瞭解呢？

• a:link - 正常，未訪問過的連結
• a:visited - 已訪問過的連結
• a:hover - 滑鼠放在連結上時
• a:active - 連結被點選的那一刻

PS:
hover必須在:link和 a:visited之後定義才有效。
active必須在hover之後定義是有效的。

盒子模型

• margin(外邊距) - 清除邊框外的區域，外邊距是透明的。
• border(邊框) - 圍繞在內邊距和內容外的邊框。
• padding(內邊距) - 清除內容周圍的區域，內邊距是透明的。
• content(內容) - 盒子的內容，顯示文字和影象。 (圖中藍色區域)

在使用的瀏覽器中一般都會有盒子模型，只需要按一下F12，就可以找到盒子模型啦。
例如：