淺談CSS樣式權(quán)值
發(fā)布時間:2016-08-05 09:04:51 作者:佚名
我要評論

下面小編就為大家?guī)硪黄獪\談CSS樣式權(quán)值。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
內(nèi)聯(lián)樣式表(InLine style)>內(nèi)部樣式表(Internal style sheet)>外部樣式表(External style sheet)
例外:但如果外部樣式表放在內(nèi)部樣式表下邊引用,則外部樣式表>內(nèi)部樣式表;
1,內(nèi)聯(lián)樣式表權(quán)值為1000;
2,ID選擇器的權(quán)值為100;
3,Class類選擇器的權(quán)值為10;
4,HTML標簽選擇器的權(quán)值為1;
具體代碼如下:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>CSS樣式權(quán)值</title>
- <style>
- body{
- font-size: 20px;
- font-weight: 900;
- }
- h3{
- color: yellow;
- }
- #redP p{
- /*權(quán)值100+1=101*/
- color: #f00;
- /*紅色*/
- }
- #redP p.red em{
- /*權(quán)值100+1+10+1=112*/
- color: #00f;
- /*藍色*/
- }
- #redP .red em{
- /*權(quán)值100+10+1=111*/
- color: #0ff;
- /*亮藍色*/
- }
- #redP p span em{
- /*權(quán)值100+1+1+1=103*/
- color: #ff0;
- /*黃色*/
- }
- </style>
- <link rel="stylesheet" href="style.css">
- </head>
- <body>
- <h3>例外:外部樣式表>內(nèi)部樣式表</h3>
- <div id="redP">
- <p class="red">
- <span>
- <em>emred</em>
- </span>
- </p>
- <p>red</p>
- </div>
- </body>
- </html>
以上這篇淺談CSS樣式權(quán)值就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
- 下面小編就為大家?guī)硪黄狢SS樣式覆蓋規(guī)則全面了解。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧,祝大家游戲愉快哦2016-08-05
- 下面小編就為大家?guī)硪黄胏ss樣式的書寫格式詳解。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-08-03
Web前端開發(fā)css基礎(chǔ)樣式總結(jié)(推薦)
下面小編就為大家?guī)硪黄猈eb前端開發(fā)css基礎(chǔ)樣式總結(jié)(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-08-02- 本特效是一款使用CSS3幀動畫來制作的炫酷404頁面動畫效果的代碼。該404頁面以書架為主題,歡迎下載使用2016-07-28
- 下面小編就為大家?guī)硪黄猚ss 常用樣式(分享)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-08-11