CSS（Cascading Style Sheets,層疊樣式表）
引入方式
- 通過<link>標(biāo)簽引入（外部樣式）
為了成功加載一個(gè)外部樣式表（外部樣式表只能包含css注釋和css規(guī)則，不能有其他文檔標(biāo)記，否則會(huì)造成一部分或者全部被忽略），link標(biāo)簽需要放置在head標(biāo)簽內(nèi)部。
候選樣式表，即將rel屬性的值設(shè)置為alternate stylesheet,大多數(shù)基于Gecko的瀏覽器都可以支持候選樣式表，不過通過js,IE也可支持。 - 通過在<style>標(biāo)簽中（內(nèi)部樣式）寫入樣式，一定要設(shè)定type屬性
- 通過在<style>標(biāo)簽中的@import
@import一定要寫在style標(biāo)簽內(nèi)，并且要在所有CSS規(guī)則之前
- 通過在標(biāo)簽中加入style屬性(內(nèi)聯(lián))
相對(duì)路徑和絕對(duì)路徑
相對(duì)路徑
相對(duì)于目前路徑名的文件寫法，只要開頭不是（/）就不是絕對(duì)路徑絕對(duì)路徑
由根目錄（/）開始寫起的文件名或目錄名稱-
. 表示當(dāng)前目錄； .. 表示上一層目錄
以下這幾種文件路徑分別用在什么地方，代表什么意思?css/a.css （網(wǎng)站路徑，css路徑下的a.css文件）
./css/a.css （相對(duì)路徑，當(dāng)前路徑下css下的a.css文件）
b.css （相對(duì)路徑，當(dāng)前路徑下的b.css文件）
../imgs/a.png （相對(duì)路徑，當(dāng)前路徑的上一級(jí)下的a.png圖片）
/Users/hunger/project/css/a.css （絕對(duì)路徑，根目錄下的User文件夾下的hunger文件夾下的project文件夾下的css文件夾下的 a.css文件）
/static/css/a.css （網(wǎng)站路徑，代表網(wǎng)站服務(wù)器根目錄static文件夾中的css文件夾中的a.css文件）
http://cdn.jirengu.com/kejian1/8-1.png （8-1.png的網(wǎng)站路徑）
**ps:如果我想在js.jirengu.com上展示一個(gè)圖片，需要怎么操作? **
方法1：可以直接將圖片上傳到服務(wù)器，在頁(yè)面使用這張圖片；
方法2：如果這個(gè)圖片本來就存在網(wǎng)絡(luò)上其他的服務(wù)器上，可以直接使用圖片的網(wǎng)絡(luò)絕對(duì)路徑鏈接的方式在頁(yè)面上添加url引用這張圖片
html和css的一些書寫規(guī)范
- 語(yǔ)法不分大小寫，推薦統(tǒng)一使用小寫
- 內(nèi)容與樣式分離
- id和class使用有意義的單詞，分隔符建議使用-
- 有可能盡量用縮寫
5.屬性值是0的省略單位 - 塊內(nèi)容縮進(jìn)
- 屬性名冒號(hào)后添加一個(gè)空格
chrome 開發(fā)者工具
- 使用Elements面板檢查和實(shí)時(shí)編輯頁(yè)面的HTML和CSS
- 在 Elements 面板中檢查和實(shí)時(shí)編輯 DOM 樹中的任何元素。
- 在 Styles 窗格中查看和更改應(yīng)用到任何選定元素的 CSS 規(guī)則。
- 在 Computed 窗格中查看和修改選定元素的框模型。
- 在 Sources 面板中查看在本地對(duì)頁(yè)面所做的更改。
- 使用 Computed 窗格檢查和編輯當(dāng)前元素的框模型參數(shù)。 框模型中的所有值均可修改，只需點(diǎn)擊它們即可。
[參考]
