- CSS介紹
CSS 指層疊樣式表 (Cascading Style Sheets)，樣式定義如何顯示 HTML 元素，美化網頁。
CSS1.0
CSS2.0 DIV(塊) + CSS，HTML 與 CSS 結構分離，網頁變得簡單
CSS2.1 浮動，定位
CSS.3.0 圓角，陰影，動畫，等…
- CSS簡單入門
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--CSS標籤儘量在head標籤內寫,
在style標籤內寫CSS代碼
語法：
選擇器{
聲明;
...
}
-->
<style>
/*h1是標籤選擇器，選中h1標籤中的內容
改爲紅色
*/
h1{
color: red;
}
</style>
</head>
<body>
<h1>我是標題</h1>
</body>
</html>
還有一種方式是將css單獨寫在一個頁面，不寫在html頁面中，然後在html頁面使用標籤引用，這種方式建議使用。
CSS的優勢：
- 內容與表現分離
- 網頁結構統一，可實現複用
- 樣式十分的豐富
- CSS的導入方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--內部樣式-->
<style>
h1{
color: yellow;
}
</style>
<!--外部樣式-->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!--行內樣式，在標籤元素中寫上style屬性，編寫樣式-->
<h1 style="color: red">CSS導入方式</h1>
</body>
</html>
導入方式的優先級：就近原則，哪種樣式距離要修飾的內容近，哪種方式優先級就高
拓展：外部樣式兩種寫法
-
鏈接式(推薦)： link是html標籤，只能放在html代碼中使用
<!--外部樣式--> <link rel="stylesheet" href="css/style.css"> -
導入式： CSS樣式，@import在html使用時候需要