css選擇符類型有哪些

這篇文章主要介紹“css選擇符類型有哪些”,在日常操作中,相信很多人在css選擇符類型有哪些問題上存在疑惑,小編查閱了各式資料,整理出簡(jiǎn)單好用的操作方法,希望對(duì)大家解答”css選擇符類型有哪些”的疑惑有所幫助!接下來,請(qǐng)跟著小編一起來學(xué)習(xí)吧!

專注于為中小企業(yè)提供成都網(wǎng)站制作、成都網(wǎng)站建設(shè)、外貿(mào)營(yíng)銷網(wǎng)站建設(shè)服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)舞陽免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動(dòng)了成百上千企業(yè)的穩(wěn)健成長(zhǎng),幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。

一、標(biāo)簽選擇符:針對(duì)某一類標(biāo)簽,可以以標(biāo)簽作為選擇符

代碼如下:


<style type="text/css">
p{color:#F00; font-size:36px;}
</style>
</head>
<body>
<p>0.5秒三分絕殺!波特蘭上演波什時(shí)刻 第N次拯救熱火</p>
<h2>玩命暴扣扳平+助攻絕殺三分 熱火太幸運(yùn)有這顆隊(duì)魂</h2>
<p>熱火今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p>詹波為小弟惡犯叫屈 當(dāng)事人他都起飛了!肯定假摔</p>
<p>斯帥稱客戰(zhàn)開拓者奧登不打 波什:他很快就可復(fù)出</p>
</body>

二、類選擇符:通過類選擇符定義一個(gè)樣式,需要改樣式的元素就在該元素內(nèi)通過class屬性將該樣式添加到該元素中定義類名的時(shí)候數(shù)字不要開頭,起名的時(shí)候最好要有意義,可以同時(shí)給某個(gè)元素應(yīng)用多個(gè)類格式:class="類1 類2"(類與類之間用空格隔開)

代碼如下:


<style type="text/css">
.red{color:#C00;}
.family{font-family:"漢儀清韻體簡(jiǎn)";}
</style>
</head>
<body>
<p class="red">0.5秒三分絕殺!波特蘭上演波什時(shí)刻 第N次拯救熱火</p>
<h2>玩命暴扣扳平+助攻絕殺三分 熱火太幸運(yùn)有這顆隊(duì)魂</h2>
<p>熱火今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p>詹波為小弟惡犯叫屈 當(dāng)事人他都起飛了!肯定假摔</p>
<p class="red family">斯帥稱客戰(zhàn)開拓者奧登不打 波什:他很快就可復(fù)出</p>
</body>

三、ID選擇符:只想針對(duì)某一個(gè)元素進(jìn)行控制,與類基本相似,只是以英文"#"開頭,因?yàn)镮D具有唯一性,所以在網(wǎng)頁(yè)中只能出現(xiàn)一次定義id的時(shí)候數(shù)字不要開頭,起名最好要有意義

代碼如下:


<style type="text/css">
#two{color:#600; font-family:'漢儀行楷簡(jiǎn)';}
#one{font-family:Arial, Helvetica, sans-serif; font-family:'漢儀行楷簡(jiǎn)'; font-size:36px;}
</style>
</head>
<body>
<h2>李克強(qiáng)主持召開<span>國(guó)務(wù)院</span>常務(wù)會(huì)議</h2>
<h3 id="two"> 聽取最低生活保障政策落實(shí)督查情況匯報(bào)</h3>
部署進(jìn)一步加強(qiáng)和改進(jìn)低保工作
<div id="one">決定將《社會(huì)救助暫行辦法(草案)》向社會(huì)公開征求意faksdjfkasfkasdfj</div>
</body>

四、包含(派生)選擇符:(選擇符的嵌套使用,針對(duì)某個(gè)元素中的子元素進(jìn)行控制,就可以使用該方法,這樣就可以不用id或者類選擇符,代碼可以簡(jiǎn)潔
語法:e1 e2{屬性:屬性值}(e1是父元素,e2是子元素)

代碼如下:


<style type="text/css">
p strong{color:#F00;}
</style>
</head>
<body>
<p>0.5秒三分絕殺!波特蘭上演波什時(shí)刻 第N次拯救熱火</p>
<h2>玩命暴扣扳平+助攻絕殺三分 熱火太幸運(yùn)有這顆隊(duì)魂</h2>
<p><strong>熱火</strong>今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p>詹波為小弟惡犯叫屈 當(dāng)事人他都起飛了!肯定假摔</p>
<div>斯帥稱客戰(zhàn)開拓者奧登不打 波什:他很快就可復(fù)出</div></p> <p><ul>
  <li> 安東尼推特怒罵無禮粉絲:我沒要求你這貨支持我</li>
<li>大范:籃網(wǎng)就像低級(jí)聯(lián)賽球隊(duì) 他們的處境聯(lián)盟最差</li>
<li>基德求教真神獲五字真經(jīng) 波帥:他夠強(qiáng)硬能做到這點(diǎn)</li>
</ul>
<div>滅<strong>雷霆</strong>擒步行者!隱形殺手冒頭 東部又一新控神誕生</div>
<h2>加內(nèi)特直言還沒找到節(jié)奏:經(jīng)歷過比這更艱難的時(shí)期</h2>
</body>

五、通配選擇符:*{屬性:屬性值} 可以控制所有的html元素作用范圍很廣,但是效率較低(工作中慎用)

代碼如下:


<style type="text/css">
*{color:#0C0; font-size:18px;}
</style>
</head>
<body>
<p>0.5秒三分絕殺!波特蘭上演波什時(shí)刻 第N次拯救熱火</p>
<h2>玩命暴扣扳平+助攻絕殺三分 熱火太幸運(yùn)有這顆隊(duì)魂</h2>
<p>熱火今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p>詹波為小弟惡犯叫屈 當(dāng)事人他都起飛了!肯定假摔</p>
<div>斯帥稱客戰(zhàn)開拓者奧登不打 波什:他很快就可復(fù)出</div></p> <p><ul>
<li> 安東尼推特怒罵無禮粉絲:我沒要求你這貨支持我</li>
<li>大范:籃網(wǎng)就像低級(jí)聯(lián)賽球隊(duì) 他們的處境聯(lián)盟最差</li>
<li>基德求教真神獲五字真經(jīng) 波帥:他夠強(qiáng)硬能做到這點(diǎn)</li>
</ul>
<div>滅雷霆擒步行者!隱形殺手冒頭 東部又一新控神誕生</div>
<h2>加內(nèi)特直言還沒找到節(jié)奏:經(jīng)歷過比這更艱難的時(shí)期</h2>
</body>

六、選擇符分組(集體控制):將同樣的樣式用于多個(gè)選擇符,選擇符之間用逗號(hào)隔開
語法:選擇符1,選擇符2,選擇符3{屬性:屬性值}

代碼如下:


<style type="text/css">
p,h2,div{
color:#F00;
font-size:36px;
}
</style>
</head>
<body>
<p>0.5秒三分絕殺!波特蘭上演波什時(shí)刻 第N次拯救熱火</p>
<h2>玩命暴扣扳平+助攻絕殺三分 熱火太幸運(yùn)有這顆隊(duì)魂</h2>
<p><strong>熱火</strong>今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p>詹波為小弟惡犯叫屈 當(dāng)事人他都起飛了!肯定假摔</p>
<div>斯帥稱客戰(zhàn)開拓者奧登不打 波什:他很快就可復(fù)出</div></p> <p><ul>
<li> 安東尼推特怒罵無禮粉絲:我沒要求你這貨支持我</li>
<li>大范:籃網(wǎng)就像低級(jí)聯(lián)賽球隊(duì) 他們的處境聯(lián)盟最差</li>
<li>基德求教真神獲五字真經(jīng) 波帥:他夠強(qiáng)硬能做到這點(diǎn)</li>
</ul>
<div>滅<strong>雷霆</strong>擒步行者!隱形殺手冒頭 東部又一新控神誕生</div>
<h3>加內(nèi)特直言還沒找到節(jié)奏:經(jīng)歷過比這更艱難的時(shí)期</h3>
</body>

七、標(biāo)簽指定式選擇符:想用id或class的同時(shí)還想用標(biāo)簽選擇符
語法:p#one(注意這里不用空格和任何分隔符)表示針對(duì)id為one的p標(biāo)簽
h2.p1表示針對(duì)class為p1的h2標(biāo)簽

代碼如下:


<style type="text/css">
p#one{
color:#F00;
font-size:36px;
}
p.cla{
background-color:#00F;
font-size:24px;
}
</style>
</head>
<body>
<p id="one">0.5秒三分絕殺!波特蘭上演波什時(shí)刻 第N次拯救熱火</p>
<h2>玩命暴扣扳平+助攻絕殺三分 熱火太幸運(yùn)有這顆隊(duì)魂</h2>
<p><strong>熱火</strong>今夜還一功臣必須贊 11分不多但卻分分是金!</p>
<p class="cla">詹波為小弟惡犯叫屈 當(dāng)事人他都起飛了!肯定假摔</p>
</body>

八、組合選擇符:將所有選擇符類型組合使用

到此,關(guān)于“css選擇符類型有哪些”的學(xué)習(xí)就結(jié)束了,希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí),快去試試吧!若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí),請(qǐng)繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站,小編會(huì)繼續(xù)努力為大家?guī)砀鄬?shí)用的文章!

網(wǎng)站欄目:css選擇符類型有哪些
文章路徑:http://bm7419.com/article44/gejoee.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供全網(wǎng)營(yíng)銷推廣、定制開發(fā)、標(biāo)簽優(yōu)化、Google、網(wǎng)站營(yíng)銷、網(wǎng)站設(shè)計(jì)公司

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

手機(jī)網(wǎng)站建設(shè)