HTML是房子,CSS是裝修,JavaScript是生活
前程往事
還沒寫完,下班中,明天上班繼續補充~
CSS作用
- 修飾、美化前臺界面
- 完善html屬性的不足
- 整合代碼,便於維護
CSS規則組成
- 選擇器
- 一條或多條聲明
h1:元素選擇器
注意
- 整體聲明以 大括號{} 包裹
- 多個聲明之間以 封號;分開
- 每個屬性有一個值
- 屬性與值之間使用 冒號( :)分開
CSS的創建與使用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>開心就好</title>
<style>
body
{
background-color:#b0c4de;
}
.first{
color:red;
font-size:20pt;
}
</style>
</head>
<body>
<p class='first'>開始的開始</p>
<p style="color:sienna;margin-left:5px">我們只是孩子</p>
</body>
</html>
內聯樣式(Inline style)
這是一種新手最初要掌握的行內樣式,通常在HTML標籤內使用樣式(style)屬性,然後在style屬性內可以包含CSS屬性
<p style="color:sienna;margin-left:20px">第一個段落</p>
內部樣式表(Internal style sheet)
外部樣式表(External style sheet)
選擇器類型
-
元素 選擇器
-
id 選擇器
-
class 選擇器