css基本選擇器有哪些

這篇文章主要為大家展示了“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.?通用選擇器：？星號（*）

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

　　div布局

　　*{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;

　　}

以上是“css基本選擇器有哪些”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！