日期: 2020-10-02
1. 什么是 CSS
CSS 層疊樣式表
, 一種用來為結(jié)構(gòu)化文檔添加樣式的計(jì)算機(jī)語言
結(jié)構(gòu)化文檔: ? ? ? ? 比如 html 文檔 或者 xml 應(yīng)用
樣式: ? ? ? ? ? ? ? ? ? ? 比如字體,間距, 顏色,背景等
2. CSS 基本語法
css 的語法由3部分組成: 選擇器蕾额, 屬性村斟,屬性的取值贪绘。(selector , property, value )
selector { property: value }
3. CSS 的 引用方式
- 行間樣式: 直接在標(biāo)簽內(nèi)部寫樣式
- 內(nèi)部樣式: 在head 的 style標(biāo)簽里寫樣式
- 外部樣式: 在head 中 使用 link 標(biāo)簽引入樣式文件
- 導(dǎo)入外部樣式: 在 style 中用 import 導(dǎo)入樣式文件
1. 行間樣式
<p style="color:green; font-size:16px"> test example </p>
2. 內(nèi)部樣式
<head>
<style> // 這里也可以加上 type="text/css" , 意思是允許不支持該類型的瀏覽器忽略css 表單
p {
color: "green";
}
</style>
</head>
3. 外部樣式
<head>
<link rel="stylesheet" href="style.css">
</head>
》style.css
p {
color: "green";
}
4. 導(dǎo)入外部樣式
<head>
<style>
@import "style.css"
</style>
</head>
以上四種CSS引用方式的區(qū)別:
- 作用范圍
行間樣式是只作用于當(dāng)前標(biāo)簽。
內(nèi)部樣式作用于當(dāng)前文件虑椎。
外部樣式可以被多個(gè)HTML文件引用。
> 在實(shí)際開發(fā)中最好使用外部樣式。
外部樣式分為link引入和@ import 引入阁危。
- link 是XHTML標(biāo)簽,除了加載CSS外汰瘫,還可以定義RSS等其他事務(wù)狂打,@import屬于CSS范疇,只能加載CSS.
- Link引用CSS時(shí)混弥,在頁面載入時(shí)同時(shí)加載趴乡。@Import需要頁面網(wǎng)頁完全載入以后加載。
- Link 是XHTML標(biāo)簽蝗拿,無兼容問題晾捏,@import是在CSS2.1提出的,低版本的瀏覽器不支持哀托。
- Link 支持使用JavaScript控制DOM去改變樣式惦辛,@import不支持。