前段筆記4：引入css的幾種方式
阿新 • • 發佈：2020-07-09
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- stylesheet匯入樣式表 -->
<link rel="stylesheet" href="css01.css">
<!--style標籤中也可以寫css樣式 -->
<style>
#i1{
width: 100px;
height: 100px;
border: 1px blue solid;
}
.c1{
width: 100px;
height: 100px;
border: 1px red solid;
}
.c2{
background-color: greenyellow;
}
div{
width: 100px;
height: 100px;
border: 1px pink solid;
}
</style>
</head>
<body>
<!-- <div style="width: 100px;height: 100px;border: 1px red solid"></div>-->
<!--id選擇器-->
<!-- <div id="i1"></div>-->
<!--class選擇器：允許複用-->
<!--<div class="c1 c2"></div>-->
<div class="c1 c3"></div>
<!--標籤選擇器-->
<!--<div></div>-->
<!--<div></div>-->
<!--<div></div>-->
</body>
</html>
<!--寫css樣式的幾種方式：
1.通過link標籤匯入css樣式 2.hea標籤中，增加style標籤，在style標籤中增加css樣式
3.在標籤中增加style屬性-->
css01.css
.c3{
width: 100px;
height: 100px;
background-color:aquamarine ;
}