<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>繼承和層疊</title>
<style>
div {
color: chartreuse;
font-size: 20px;
border: 1px solid lightcyan;
height: 25px;
}
p {
background-color: fuchsia;
}
/*標籤選擇器的權重是1; . class選擇器的權重是10;
* # id的權重是100;style的權重是1000;若權重相同，則誰最後寫隨就是顏色*/
#p1 {
border: 1px solid lightcoral;
width: 65px;
background-color: blanchedalmond;
}
.myp {
background-color: green;
}
/*!important無關權重,直接是最後的樣式*/
div #p1 {
background-color: gold!important; }
p #p1 {
background-color: firebrick;
}
</style>
</head>
<body>
<div>
網頁設計與製作
<p id="p1" class="myp" style="background-color: lightcyan;">喜歡好啊好啊</p>
</div>
</body>
</html>繼承和層疊
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.