1. 程式人生 > >css筆記 選擇器

css筆記 選擇器

sed h+ 繼承 {} img 如何 邊距 超鏈接 ide

css規則

1、繼承性:父元素的樣式可以被子元素所繼承(顏色、字體). 2、層疊性:給一個元素設置不同的說明,其效果會疊加。 3、優先級:給同一個元素設置相同的的說明,效果以後者為準,也叫就近原則

由選擇器和樣式聲明組成

CSS選擇器:選擇頁面上的元素 1、元素選擇器:通過元素名選擇CSS作用的目標 比如:<p></p>、<h1></h1> 2、類選擇器:選擇class等於某個值的所有屬性 。class是程序員根據邏輯自己給元素增加的分類 CSS代碼:.class {} 3、id選擇器:id 選擇器:選擇id等於某個值的唯一元 技術分享圖片
1
/*3、id 選擇器:選擇id等於某個值的唯一元素*/ 2 #p4{ 3 color:yellowgreen; 4 }
demo 4、選擇器組:寫出一組選擇器,並選中每個選擇器所對應的目標並集 技術分享圖片
1  .girl,#p4 {
2         font-weight: bold;  /*(加粗)*/
3 
4     }
demo

5、派生選擇器: 1選擇某元素的子孫

技術分享圖片
1   /*5、1選擇某元素的子孫*/
2     #p5 b{color: crimson;
3     }
demo

2選擇某元素的兒子

技術分享圖片
1   /*
5、2選擇某元素的兒子*/ 2 #p5>b{ 3 font-size: 30px; 4 }
demo

偽類選擇器 常用偽類有: 選擇未訪問過的超鏈接 a:link{ } 選擇已訪問過的超鏈接 a:visited{ } 選擇激活態(正在點)的按鈕 #x1:active{ } 選擇有焦點的文本框、文本域、密碼框 #x2:focus{ } 選擇鼠標懸停態(觸碰)的圖片 img:hover{ }

css聲明 border屬性:設置元素的邊框 元素單位 %:百分比 in:英寸 cm:厘米 mm:毫米 pt:鎊(1Pt等於1/72英寸)
px:像素(計算機上的一個點) em:1em等於當前的字體尺寸,2em等於當前尺寸的兩倍

當內容溢出元素框如何處理

overflow:auto;/*溢出加滾動條*/

}



內邊距:padding 外邊距:margin 實際占有的寬=width+2border+2padding+2margin 實際占有的高=height+2border+2padding+2margin

css筆記 選擇器