CSS教程 - 從入門到使用

HTML是房子,CSS是裝修,JavaScript是生活

前程往事

HTML教程 - 從入門到使用

JavaScript教程 - 從入門到使用

jQuery教程 - 從入門到使用

還沒寫完,下班中,明天上班繼續補充~

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 選擇器

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章