請建立一份HTML文件,檔名為my-id-selectors.html
。請用VS Code編輯。
my-id-selectors.html
內容如下。
my-id-selectors.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>
</html>
上面的HTML文件目前已套用外部樣式表(External style sheet)的CSS如下。
style.css
div {
height:20px;
border:solid 1px;
}
請幫每個<div>
自行定義id
屬性,然後在外部樣式表中另外使用ID Selectors為每個<div>
區塊新增背景顏色,由上到下依序為red
,orange
,yellow
,green
,blue
,在瀏覽器開啟如下。
沒有留言:
張貼留言