1.CSS 層疊樣式表(Cascading Style Sheets)
2.引入方式:? ? ? ? ??
1.行內(nèi)樣式;2.內(nèi)嵌樣式;3.鏈接樣式,文件擴展名為.css <link type="text/css" rel="stylesheet" href=" .css"/>
?4.導入樣式 @import url(" ") 放在<style>最上面,后面樣式會覆蓋上面樣式。導入式的結果和直接書寫是同樣的效果。
5.引入方式的優(yōu)先級:!important(最重要,優(yōu)先級最高)(10000) ?*通配符(優(yōu)先級最低)(0.5)
內(nèi)嵌式(1000)>id(100)>class(10)>標簽(1)
優(yōu)先級加法運算(包含選擇器權重相加)
3.選擇器
1.通配符選擇器 ? ?語法:*{規(guī)則} ? ? 如*{margin:0;padding:0;}(格式化文檔)
2.ID選擇器? ? 語法:#id{規(guī)則}
3.類選擇器? ? 語法:.className{規(guī)則} ? 瀏覽器渲染時從上到下,從左到右。加多個類時,每個類之間用空格隔開
4.包含選擇器 ? ?通過標簽的嵌套選擇標簽 ? 語法:選擇符a ?選擇符b{規(guī)則}?
只要某個元素下的直接子元素:父元素>子元素
?找到某個元素下所有的子元素(包含直接子元素(兒子)和間接子元素(孫子)):父元素 子元素{ }
5.類型(標記)選擇器 ?即使用標簽的名字作為選擇符 ?語法:標簽{規(guī)則} ?如td{color:#f00;}
4.RGB在CSS中的表達方式
1.直接使用顏色的英文單詞
2.使用三色的數(shù)值,如rgb(255,255,0)
3.使用三色的十六進制,如#0000ff
4.rgba 背景透明度(0~1)
5.font樣式
1.font-family 可以為文字指定多種字體,不同字體間用“,”隔開,自提名字中間有空格的,要用雙引號引起來
2.font-size 字體大小
3.font-style 字體傾斜效果 normal不傾斜 italic和oblique傾斜
4.font-weight 字體粗細 ?normal正常粗細 ?bold粗體 ?bolder加粗體 ?lighter比正常粗體細
6.text樣式
1.text-transform 英文字母大小寫轉換 ? ?capitalize單詞首字母大寫 ? uppercase全部大寫 ?lowercase全部小寫
2.text-decoration 文本的裝飾效果 ?underline文字加下劃線 ?line-through文字加刪除線 ?overline文字加上劃線 none去除下劃線
3.text-indent 段落內(nèi)容首行縮進(單位用em)
4.字詞間距 ?英文文本 letter-spacing(字母和字母間距) word-spacing(單詞和單詞間距)
中文文本 ?letter-spacing(字和字之間的間距)
overflow:visible(默認)超出部分可見 ? auto(瀏覽器自動處理)
hidden(超出部分隱藏) ?scroll(出現(xiàn)滾動條) ?
5.text-overflow(文本溢出處理):clip(不顯示省略標記,簡單裁切) ? ellipsis(文本溢出顯示省略標記)
6.white-space(元素空白的處理):nowrap(不換行) pre(保留空白) ?<nobr>強制不換行
7.垂直居中:line-height等于height值
文本居中對齊用"text-align:center"
text-align:文本的水平位置 ?left:左對齊(默認值) right:右對齊 ?center:居中對齊 ?justify:兩端對齊(justify主要用于英文,只能對多行中的非最后一行兩端對齊)
vertical-align:baseline/top/text-top/middle/bottom