02CSS3基本語法05
day05
02CSS
HTML,CSS和javascript之間的關系
HTML是網頁內容的載體
CSS樣式是表現（外觀控制）
JavaScript是行為，用來實現網頁特效效果
CSS層疊樣式表（Cascading Style Sheets）
用於定義HTML內容再瀏覽器內的顯示樣式
為什麽學習CSS
CSS簡化HTML相關標簽代碼，網頁體積小，下載快
解決內容與表現分離的問題
更好地維護網頁，提高工作效率
CSS基礎語法
CSS使用方法
CSS選擇器
CSS繼承和層疊
CSS優先級
CSS命名規範
CSS樣式規則
CSS規則由兩部分構成：選擇器，聲明
CSS引用
寫在<head></head>標簽內：
<style type="text/css">
CSS樣式
</style>
CSS註釋 /*註釋內容*/
引用CSS樣式
行內樣式(內聯樣式)
<p style="color:red;">內容</p>
內部樣式表(嵌入樣式)
<style type="text/css">
樣式
</style>
外部樣式表,把CSS樣式代碼寫在獨立的一個文件中 擴展名：CSS文件名.css
引入外部文件：<link href="XX.css" rel="stylesheet" type="text/css" />
導入式
@import "css.css" 或url(css.css)
CSS使用方法優先級
行內優先級最高
行內樣式>內部樣式>外部樣式
說明：
1.鏈入外部樣式表語內部樣式表之間的優先級取決於所處位置的先後
2.最後定義的優先級最高(就近原則)
css_use1.html:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css使用方法優先級</title> <link rel="stylesheet" type="text/css"href="css2.css"><!--color:gray--> <style type="text/css"> @import url(css1.css); p{ /*color: blue;*/ } </style> <link rel="stylesheet" type="text/css" href="css3.css"><!--color:orange--> </head> <body> <pstyle="color: red;"><b>css使用方法</b></p> </body> </html>
圖示：
02CSS3基本語法05