css選擇器有哪些(css基本選擇器有哪些)

　　CSS基本選擇器(對指定的標簽設置樣式,要把指定的標簽選擇出來):元素選擇器、類選擇器、id選擇器、組合選擇器、通用選擇器

　　1. 元素選擇器(類型選擇器或標記選擇器):聲明哪些元素采用css樣式

　　2. 類選擇器(class):應用樣式而不考慮具體設計的元素,為了將類選擇器的樣式與元素進行關聯,必須將元素中的class屬性指定一個適當的值。

　　class 選擇器在HTML中以class屬性表示, 在 CSS 中,類選擇器以一個點"."號顯示。也可以指定特定的HTML元素使用class。

　　在HTML中,一個class屬性還可能包含多個屬性值,各個值之間用空格分隔,表示將多類應用到同一個標記中?？梢允褂枚啻?表示類別。

　　Document

　　p.special{

　　color: red;

　　}

　　3. id選擇器(id):

　　id 選擇器可以為標有特定 id 的 HTML 元素指定特定的樣式。

　　HTML元素以id屬性來設置id選擇器,CSS 中 id 選擇器以 "#" 來定義。

　　不同與類選擇器,id選擇器不能組合使用,不容許有空格分隔的多個值,僅僅使用一次。

　　#red {color:red;}

　　這個段落是紅色。

　　4.組合選擇器:

　　多個選擇器(元素選擇器、類選擇器、id選擇器等)通過逗號連接。

　　樣式一樣的可以進行組合。

　　html5語義化

　　header, section, footer, aside, nav, article, figure

　　{

　　display: block;

　　}

　　nav,header,p,article{

　　width: 1200px;

　　margin:0 auto;

　　}

　　ul{

　　height:40px;

　　background-color: #fff;

　　list-style: none;

　　display: inline-block;

　　width: 1200px;

　　padding: 0px;

　　}

　　li{

　　line-height: 40px;

　　text-align: center;

　　float: left;

　　width: 400px;

　　margin:0 auto;

　　}

　　li:hover{

　　background: pink;

　　}

　　a{

　　text-decoration: none;

　　}

　　。post{

　　border:1px dashed #000;

　　padding: 0 0 20px 20px;

　　margin-bottom: 40px;

　　padding-top: 10px;

　　background-color: #fff;

　　}

　　#content{

　　border:1px solid #ccc;

　　padding:30px 40px;

　　background-color: rgb(247,244,255);

　　margin-top: 20px;

　　}

　　頁面導航

　　查看相關內容返回首頁返回本頁

　　作者,初級碼農

　　培訓的,大概培訓了半年,js、jquery、bootstrap、angular、vue、Ajax、數據庫、php、面向對象、Web服務器、移動端

　　我覺得還行

　　作者:Amy

　　工作機會還多的,php是輕量級網站開發最好的選擇

　　不錯了

　　作者:鍵盤俠

　　學歷本科、信息專業、會這么多,不會找不到的,對自己有信心一點

　　我的帖子我做主

　　關于樓主

　　用戶組:菜鳥初級

　　閱讀量:20

　　發表時間:2020-03-18

　　my logo

　　5.?通用選擇器:?星號(*)

　　該選擇器可以與任何元素進行匹配,可以對文檔中的所有元素設定屬性和屬性值。

　　p布局

　　*{margin: 0;

　　padding: 0;

　　border: 0;

　　}

　　#header{

　　width: 100%;

　　height: 80px;

　　line-height: 80px;

　　background-color: rgb(255,165,0);

　　}

　　#main{

　　height:200px;

　　}

　　#menu{

　　float: left;

　　height:200px;

　　width: 10%;

　　background-color: yellow;

　　}

　　menu{

　　height: 200px;

　　}

　　b{

　　display: inline-block;

　　margin-top: 10px;

　　font-size: 18px;

　　margin-left: 5px;

　　}

　　ul{

　　margin-left: 46px;

　　list-style: none;

　　margin-top: 10px;

　　}

　　ul li{

　　line-height: 40px;

　　}

　　#content{

　　float: left;

　　height:200px;

　　background-color: pink;

　　width: 90%;

　　}

　　#content p{

　　text-align: center;

　　line-height: 200px;

　　}

　　#footer{

　　background-color: gray;

　　height:80px;

　　line-height: 80px;

　　text-align: center;

　　}