選擇器優先順序
css常用樣式
選擇符注意:
1.當乙個屬性有多個屬性值時,屬性值與屬性值不分先後順序
2.空格換行等不影響屬性顯示
選擇符表示要定義樣式的物件,可以是元素本身,也可以是一類元素或者制定名稱的元素
主要分為:
1.元素選擇符
2.id選擇符
3.類選擇符
4.萬用字元選擇符
5.群組選擇器
6.包含選擇器
7.偽類選擇器
元素選擇符也就是已經存在的標籤的元素名稱;(比如已存在
標籤)語法:
div
當結構要體現單一樣式時,就使用id選擇符;在整個html檔案當中id選擇符是唯一的,主要是為了後續使用js時不報錯;
語法:
#id名
在整個html檔案當中如果某一類標籤想要使用同乙個樣式時則使用類選擇符;
語法:
.class名
在整個html檔案當中如果想要選中所有元素,則用通配選擇符;但通常使用去掉所有邊距,比如:*
語法:
*
在整個html檔案當中,如果多組樣式,但有部分相同的樣式,則可以提取出來寫在乙個樣式中,並且選擇符與選擇符之間用逗號隔開,就是群組選擇器;
語法:
選擇符1,選擇符2,
在整個html檔案當中,當我們為某便簽下的子標籤新增樣式時,就可以使用包含選擇器,注意父選擇符與子選擇符之間用空格隔開;
語法:
父選擇符 子選擇符
在整個html檔案當中,當我們向某些選擇器新增特殊的效果,就可以使用偽類選擇器;
語法(通常與a標籤一起使用):
a:link /*未訪問的鏈結*/
a:visited /*已訪問的鏈結*/
a:hover /*滑鼠移動到鏈結上*/
a:active /*選定的鏈結*/
css常用的樣式:
常用文字樣式
列表相關屬性
背景圖屬性
浮動屬性
font-size文字大小預設16px
font-family字型font-style是否傾斜italic-傾斜normal-正常(通常用於去傾斜)
font-weight是否加粗bold-加粗normal-正常
line-height行高第二行底部到第一行底部的高度
text-decoration文字修飾underline-下劃線overline-上劃線line-throug**本穿過的線none-預設無線
text-indent首行縮排每個字型大小*縮排個數(僅對第一行有作用,可以取負值)color文字顏色
1.顏色名表示-例如:red
2.rgb表示-例如:rgb(255,0,0)->255255255表示紅色(注:不常用)
3.rgba表示-相對於rgb來說加了透明度rbga(255,0,0,0.6)
4.16進製制數值表-比如:#ff0000表示紅色
list-style-type:disc-實心圓square-正方形circle-空心圓none-無
list-style-image:url(相對路徑)
list-style-position:outside(外邊),inside(裡邊)
list-style:none(最常用)
background-color:顏色值;
background-image:url(相對路徑);
注意:當容器尺寸=尺寸->剛好
當容器尺寸》尺寸->平鋪
當容器尺寸《尺寸->僅顯示容器以內的背景圖
background-repeat:no-repeat不平鋪;repeat平鋪;repeat-x橫向平鋪;repeat-y縱向平鋪;
background-position:水平(left/center/right)垂直(top/center/bottom);上面四個屬性縮寫為乙個(常用):
background:背景色url(背景圖相對路徑)no-repeatcentertop;
浮動主要為了脫離文件流(垂直排列)
語法:選擇符
特點:1.div塊元素失去「塊狀」換行顯示特徵,變為行內元素
2.緊貼上乙個浮動元素(同方向)或父級元素的邊框,如寬度不夠將換行顯示
3.佔據行內元素(文字段落)的空間,導致行內元素圍繞顯示
CSS選擇器 我要找到你
什麼是選擇器,在web開發中如果你要想將css樣式應用於特定的html元素,首先需要找到該目標元素。在css中,執行這一任務的樣式規則部分被稱為選擇器 選擇符 css選擇器主要有 id選擇符 類選擇器 標籤選擇器 下面我們一一介紹這幾種選擇器,問我用的是vs2107,在這樣的開發環境下操作演示,建立...
WEB前端 CSS常用選擇器
1.1 標籤選擇器 就是用標籤名來當做選擇器。1 所有標籤都能夠當做選擇器,比如body h1 dl ul span等等 2 不管這個標籤藏的多深,都能夠被選擇上。3 選擇的是所有的,而不是某乙個。所以是共性,而不是特性。1 a 表示選擇id 1 lj1 2 同乙個頁面內id不能重複,即使不一樣的標...
前端 css 選擇器
css 為了修飾頁面作用,讓頁面好看 css的引入方式 1,行內樣式 body裡面 2,內接樣式 在html裡面的 style 裡面 3,外接樣式 兩種 鏈結式 匯入式 優先順序 行內優先順序 最高 內接的優先順序 外接優先順序 引入 id 的優先順序 比 class 的優先順序要高 標籤選擇器 d...