CSS如何定位到HTML元素
1.id選擇器（與元素一一對應的關係）
html程式碼
<html>
<head>
<meta charset="utf8"/>
</head>
<body>
<link rel="stylesheet" type="text/css" href="test.css">
</link>
<div id="only">123</div>
</body>
</html>
css程式碼
#only{
background-color: red;
}
2.類選擇器 class 是多對多的關係
HTML程式碼
<html>
<head>
<meta charset="utf8"/>
</head>
<body>
<link rel="stylesheet" type="text/css" href="test.css">
</link>
<div class="demo">567</div>
<div class="demo">890</div>
</body>
</html>
CSS程式碼
.demo
{
background-color:yellow;
}
3.標籤選擇器
HTML程式碼
<html>
<head>
<meta charset="utf8"/>
</head>
<body>
<link rel="stylesheet" type="text/css" href="test.css">
</link>
<div >567</div>
<div >890</div>
</body>
</html>
CSS程式碼
div
{
background-color:yellow;
color:red;
}
4.萬用字元選擇器
HTML程式碼
<html>
<head>
<meta charset="utf8"/>
</head>
<body>
<link rel="stylesheet" type="text/css" href="test.css">
</link>
<div >567</div>
<div >890</div>
</body>
</html>
CSS程式碼
*
{
background-color:yellow;
color:red;
}