1.css可以提高**的復用性，將內容和表現分離。
2.使用css的三種方式：行內式，內聯式，外聯式。
*檢查：f12-->網路 重新整理頁面時載入兩個檔案：html,css。如果有乙個檔案沒有載入則表示載入時有問題。
3.css常用選擇器
*元素選擇器 元素名
*類選擇器 .類名
*id選擇器 #id名
*並集選擇器 選擇器1 選擇器2
*兒子選擇器 選擇器1>選擇器 （下一級所有）
*偽類選擇器 link(預設狀態) hover(滑鼠懸停) active(滑鼠按下) visited(訪問之後)
4.css特性
*繼承性（如顏色，字型）
*層疊性
同乙個元素如果存在多個選擇器對其進行了css設定,對於不衝突的樣式可以疊加，衝突的樣式進行層疊覆蓋，覆蓋時參考下一特性。
*優先順序 行內》內部》外部 同一級，看權重。id>class>標記 繼承過來的權重為0
5.css宣告
*邊框 border 三要素四方向
border-style: border-width: border-color: top right bottom left
合併寫法：border: 1px solid red;(三要素)
6.盒子模型 四大元素：寬，內邊距（padding），外邊距(margin)，邊框 四大方向：上左下右
*背景 background
background-color
background-img
background-repeat
background-attachment
background-position
合併寫法：
background:色 圖 鋪 定 位/大小
ps：顏色 rgba
***快速開發指南：
1.新建頁面之後，編寫外部樣式表檔案，引入到html頁面
2.瀏覽器開啟頁面->f12->sources->開啟css檔案右邊編寫樣式,左邊檢視效果
3.樣式編寫完成將樣式檔案整體複製到自己專案的css檔案中儲存
1.居中問題（水平）
1）文字居中
text-align:center
2)**整體居中
align:center
3)已知寬度的盒子居中
margin:0 auto;
*裡面盒子的margin-left:(外width-內width)/2
2.margin-外邊距（top,right,bottom,left）
合併寫法：中間用空格
上 左右 下（三個值）
上下 左右（兩個值）
上下左右（四個值）
padding-內邊距（同margin）
不同：會撐開盒子寬高
3.元素的分割槽
塊級（div h1）
獨佔一行，可以設定寬高 從上往下
行內（span label）
可以跟其它元素共享一行，不可以設定寬高 從左往右
行內塊 可以設定寬高，並且可以跟其它元素共享一行 從左往右
可以通過display屬性修改元素分割槽形式（顯示方式）
display
block:塊級元素
inline:行內元素
inline-block行內塊
none:隱藏（釋放空間）
opacity:0;（不釋放空間）
4.定位
流布局（預設的）
定位：指定元素相對於正常位置應該出現的位置
position
relative->相對定位->不脫標 不會讓出原來的位置
相對於原本應該出現的位置移動
absolute->絕對定位->脫標 讓出原先的位置
相對於定位了的祖先節點移動
fixed固定定位 脫標
通常固定定位結合bottom一起使用
z-index堆疊 10數值變大 距離使用者越近
浮動定位->脫標
float:left float:right
可以用浮動將li顯示在同一行，結合list-style:none
浮動的元素無法撐開父盒子的高度
此時需要清除浮動帶來的影響
清除的方式3種：
1)給父盒子新增overflow:hidden
2)給父盒子新增固定高度
3)給父元素新增用來清除浮動的節點，只是該節點新增clear：both屬性
4)偽元素法：div:after
HTML CSS基礎總結
自學html和css，學習 為慕課網和w3school。html裡較為容易忘記的有以下 1，html的宣告如下 在xhtml中 宣告如下 html5中最簡便 2.html標籤 表示強調，斜體 表示更強烈的強調，粗體 短文本引用，長文字引用。輸入空格的方法 標籤引入文字 為橫線，預設灰色。一行 多行 ...
html css基礎總結
總結 常用的標籤 標題 段落粗體斜體 上標下標換行符 水平線加粗強調斜體引用 空格列表 有序列表 無序列表 定義列表 標籤 target blank 表示在新的視窗開啟預設 self 格式 jpg png gif h5中的語義標籤圖形和圖形說明 行 標題單元格 屬性 colspan跨列 rowspa...
html css筆記總結
完整的html結構 樣式的引用 一。內部編寫 哈,我是乙個帥哥 是不是哦，我暈你 我看看行不行。執行結果為 哈我是乙個帥哥 是不是哦，我暈你 我看看行不行。解釋 哈我是乙個帥哥 用的是absolute 絕對定位，它相對於第乙個div來定位，因為第乙個div是它的父級元素，將它包含在裡面。所以它出現在...