一、概念

????? 級聯樣式表（Cascading Style Sheet）簡稱“CSS”，通常又稱為“風格樣式表（Style Sheet）”，它是用來進行網頁風格設計的。實現網頁內容和樣式的分離。

二、CSS核心

????????????? 選擇器、標準流、盒子模型、浮動、定位、塊級模塊、行級模塊

???????? 1、選擇器。

?????????????????? 要使用css對HTML頁面中的元素實現一對一，一對多或者多對一的控制，這就需要用到CSS選擇器。

HTML頁面中的元素就是通過CSS選擇器進行控制的。

1）類別選擇器

表示形式：

在HTML中，元素可以定義一個class的屬性。

　　如：

　　<div class="ladygaga">

在CSS中：

前面以”.”來標志，如：

　　.ladygaga

{

????????????? color：#000;

}

2）ID選擇器

表示形式：

在HTML中：　<div id=" ladygaga">

在CSS中：

# ladygaga

{

color：#000;

}

3）HTML標簽選擇器

表示形式：

HTML中：<p>ladygaga</p>

CSS中：p{

color:#000;

}

4）其他的選擇器：后代選擇器、子選擇器、偽類選擇器、通用選擇器、群組選擇器、相鄰同胞選擇器、屬性選擇器。

?????? 前三個選擇器的優先級為：ID選擇器>類選擇器>HTML標簽選擇器。

?????? 2.盒子模型

?????? CSS中的盒子模型通過圖來解釋吧

???????

上圖就是一個標準的盒子模型。也是一個金典的模型，它把網頁中的每一個元素當作一個盒子，用這個模型來編輯這個元素在網頁所在的位置。盒子模型中可以設置元素的content內容（長、寬），外邊距margin（上、下、左、右），內邊距border（上、下、左、右），盒子框的（寬度）。

???????? 3.浮動。

???????? 浮動的框可以向左或向右移動，直到它的外邊緣碰到包含框或另一個浮動框的邊框為止。

由于浮動框不在文檔的普通流中，所以文檔的普通流中的塊框表現得就像浮動框不存在一樣。

浮動用的時候要注意因為浮動會影響到標準流的元素導致標準元素顯示異常。

???????? 4.定位

?????? 定位有相對定位和絕對定位，這個牛腩中好像沒用到。

?????? 5.塊級模塊和行級模塊。

?????? 塊級模塊用<div></div>表示

?????? 行級模塊為<span></span>表示

?????? 一般網頁都用塊級模塊，因為這個用起來比較靈活

轉載于:https://www.cnblogs.com/iplus/archive/2012/11/26/4490460.html

總結

以上是生活随笔為你收集整理的牛腩新闻发布系统——初探CSS的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。