CSS(Cascading Style Sheet),層疊樣式表
寫法
- @開頭哟楷。例:
@charset "utf-8"
- 選擇器 {屬性: 值;}
頁面引入CSS
- 內(nèi)聯(lián)樣式
<h1 style="color:red;font-size:20px;"></h1>
- 內(nèi)部樣式
// type="text/css"最好省略
<style type="text/css">
h1 {
color: red;
font-size: 20px;
}
</style>
- 外部樣式
<head>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<style>
@import url("index.css");
@import "index.css";
</style>
-
瀏覽器默認樣式
文件路徑
- 相對路徑
- css/a.css
- ./css/a.css
- ../imgs/a.png
- 絕對路徑
- 網(wǎng)站路徑
html編碼規(guī)范
命名技巧
- 語義化
- 標簽語義化
- 命名語義化
- 命名規(guī)范
- 所有命名都使用英文小寫
- 用中橫線連接
- 命名體現(xiàn)功能否灾,不涉及表現(xiàn)樣式(顏色、字體墨技、邊框惩阶、背景等)
- 常見命名
- .wrap或.wrapper ——用于外側(cè)包裹
- .container或.ct ——包裹容器
- .header ——用于頭部
- aside扣汪、sidebar ——側(cè)邊欄
- navigation ——導(dǎo)航元素
- pagination ——分頁
- tab
- breadcrumbs ——導(dǎo)航列表断楷、面包屑
- .panel
- tooltip ——鼠標放上去的提示
- popup —— 鼠標點擊彈出框提示
- thumbnail ——頭像崭别、小圖像
- media
- artical
- dropdown ——下拉菜單
- summary ——摘要
- banner ——廣告條
CSS 編碼規(guī)范
- tab 用兩個空格表示
- css的:后面加個空格冬筒,{前加空格
- 小數(shù)不用寫前綴茅主,0.5 -> .5舞痰;0不用加單位
- 盡量縮寫
規(guī)范參考
http://codeguide.bootcss.com/