1、
紅色藍色
紅色藍色
p1 顏色是綠色，優先使用靠的最後出現的
p1 顏色是紅色，優先使用style屬性
p1 顏色是綠色，優先使用!important樣式
2、正常文字1
正常文字2
絕對定位的文字3
正常文字4
正常文字5
正常文字a
正常文字b
正常文字c
正常文字d
正常文字e
正常文字f
正常文字g
這是乙個定位了的div
絕對定位的文字
正常文字a
正常文字b
正常文字c
正常文字d
正常文字e
正常文字f
正常文字g
這個div沒有定位
絕對定位的文字
正常文字a
正常文字b
正常文字c
正常文字d
正常文字e
正常文字f
正常文字g
3、正常文字1
正常文字2
相對定位的文字3
正常文字4
正常文字5
4、正常文字1
正常文字2
浮動的文字
正常文字4
正常文字5
正常文字1
正常文字2
浮動的文字
正常文字4
正常文字5
當不浮動時，文字就會換行出現在下面
當不浮動時，文字就會換行出現在下面
當不浮動時，文字就會換行出現在下面
當不浮動時，文字就會換行出現在下面
當不浮動時，文字就會換行出現在下面
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字圍繞著
當浮動時，文字卻不想圍繞
當浮動時，文字卻不想圍繞
當浮動時，文字卻不想圍繞
預設的div排列是會換行的
選單1選單2
選單3如果使用float就可以達到水平排列的效果，通常會用在選單，導航欄等地方
如果超出了父容器，還會有自動換行的效果
選單1
選單2
選單3
選單4
選單5
選單6
5、可見的div1
隱藏的div2,使用display:none隱藏
可見的div3
普通的div塊
這是普通span
這是普通span
這是普通span
這是span,被改造成了塊級元素這是普通span
這是普通span
這是普通span
這是div，被改造成了內聯元素
像這樣 ，每個都能設定寬度 ，同時還能在同一行。
蓋倫蒙多醫生
奈德麗蒸汽機械人通過設定屬性align="center" 居中的內容
通過樣式style="text-align:center" 居中的內容
預設情況下div會占用100%的寬度,所以無法觀察元素是否居中
設定本div的寬度，然後再使用樣式 margin: 0 auto來使得元素居中
span 是內聯元素，無法設定寬度，所以不能通過margin:0 auto居中
span的居中可以通過放置在div中，然後讓div text-align實現居中
左邊固定寬度
右邊自動填滿
line-height 適合單獨一行垂直居中
多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容 多行內容
6、左邊固定寬度
左邊固定寬度
中間自適應
無論藍色div高度如何變化，綠色div都會貼在下面
連續的span
連續的span
連續的span
連續的span
有換行的span
有換行的span
有換行的span
有換行的span
有換行的span
有換行的span
後續的內容
7、
看程式學css 2
1 正常大小 30px大小的文字 50 比例的文字 0.5em 等同於 50 比例的文字 標準字型 標準字型 斜體標準字型 標準字型 粗一點預設字型檔 font family default 設定字型檔 font family times new roman 設定字型檔 font family ar...
css3新動 CSS3 動畫
注意 1 animation play state 也是 animation 的簡寫屬性，但在 webkit 中不適用 animation myfirst 5s infinite linear paused 即 animation name myfirst animation duration 5s...
CSS3 總結（二十） 彈性盒子（CSS3）
2.在彈性容器中可以設定min width max width屬性來限制彈性子元素的最小及最大縮放寬度。用在彈性容器 3.flex direction 屬性 用在彈性容器 指定了彈性子元素在父容器中的位置。值說明 row橫向從左到右排列 左對齊 預設的排列方式。row reverse 反轉橫向排列 ...