css3第一篇
阿新 • • 發佈：2018-12-11
CSS的基本概念
Cascading Style Sheets，層疊樣式表，當前版本是 CSS3，作用：頁面的樣式層：外觀、位置。
使用基本原則：凡是可以用CSS實現的html屬性,都要用CSS做實現效果。優點：實現程式碼結構樣式的分離,提高程式碼的可重複使用性(減少重複程式碼),以及可維護性(修改方便)。
CSS的語法
* 內聯/行內樣式
使用在程式碼的除錯階段，在標籤中新增style屬性,屬性值是CSS屬性以及屬性值，完全沒有實現結構與樣式分離,不利於程式碼的重複使用以及可維護。
<a href="#" style="color:red;">百度</a>* 內部樣式
使用在程式碼的演示過程，寫在head標籤中,新增style標籤,通過選擇器對標籤新增指定樣式效果,初步實現了程式碼的結構與樣式分離,對於程式碼的重複使用性以及可維護性有一定的提高,通過選擇器,可以讓樣式程式碼在同一個html頁面中被重複使用.
<head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> #a1 { color: red; } </style> </head> <body> <a href="#" id="a1">百度</a> </body>
* 外部樣式
使用在程式碼的專案階段,在外部CSS檔案中,設定選擇器,再通過head標籤中,新增link標籤,載入外部CSS檔案,使選擇器對指定的標籤新增樣式效果,徹底實現程式碼的結構與樣式分離,大大提高程式碼的可重複使用性,以及可維護性
html
<head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="03_style.css"> </head> <body> <a href="" id="a1">百度</a> </body>
css
#a1 {
color: red;
}