1.style屬性中寫CSS
樣例:
<!DOCTYPE html>
<html>
<head>
<title>CSS寫法優先級測試</title>
<meta charset="utf-8"/>
</head>
<body>
<p style="color:red;font-size:30px;">CSS寫法優先級測試</p>
</body>
</html>
2.在<style>標籤中寫CSS
樣例:
<!DOCTYPE html>
<html>
<head>
<title>CSS寫法優先級測試</title>
<meta charset="utf-8"/>
<style type="text/css">
p{
color: green;
font-size: 50px;
}
</style>
</head>
<body>
<p>CSS寫法優先級測試</p>
</body>
</html>
3.link標籤外聯樣式表
創建文件如下
test.html
<!DOCTYPE html>
<html>
<head>
<title>CSS寫法優先級測試</title>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="./test.css">
</head>
<body>
<p>CSS寫法優先級測試</p>
</body>
</html>
test.cssp{
color: blue;
font-size: 10px;
}
。
三種寫法的優先級優先級
第一種>第二種>第三種
樣例
<!DOCTYPE html>
<html>
<head>
<title>CSS寫法優先級測試</title>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="./test.css">
<style type="text/css">
p{
color: blue;
font-size: 50px;
}
</style>
</head>
<body>
<p style="color:red;font-size:30px;">CSS寫法優先級測試</p>
</body>
</html>
test.css如上
結果