可以做微課ppt模板 網(wǎng)站有哪些網(wǎng)站制作開發(fā)
CSS語法
1. CSS語法格式
通常情況下語法格式如下:
選擇器{屬性名:屬性值;屬性名:屬性值;屬性名:屬性值;...
}
2. CSS添加方式
2.1 行內(nèi)樣式
直接將樣式寫在本行的標(biāo)簽內(nèi)。
<h1><p style="font-size: 48px; color:red;";>行內(nèi)樣式測試</p></h1><p>行內(nèi)樣式-對(duì)比行</p>
運(yùn)行效果：
可以看出，行內(nèi)樣式只對(duì)當(dāng)前行產(chǎn)生效果。
2.2 內(nèi)嵌樣式
內(nèi)嵌樣式一般放在HTML文件的 header 中。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>內(nèi)嵌樣式</title><style>/* P標(biāo)簽的內(nèi)容全部遵循style格式 */p {font-size: 24px;color: red;font-weight: bold;}</style>
</head>
<body><p>第一行</p><p>第二行</p>
</body>
</html>
運(yùn)行效果:
2.3 單獨(dú)文件
-
這種方式適用于多個(gè)頁面需要設(shè)置為統(tǒng)一的樣式。（可以代碼復(fù)用）
-
保存時(shí)文件擴(kuò)展名為.css
-
也是在head中使用
格式：
<link rel="stylesheet" href="D:\code\4html+css+JS\2024_03_19\global.css">
運(yùn)行結(jié)果：
4. CSS選擇器
4.1 標(biāo)簽選擇器
標(biāo)簽在最前面
選擇器 {屬性名:屬性值;...
}
只要帶有選擇器的標(biāo)識(shí)的，都會(huì)使用此樣式
4.2 類選擇器
使用 “.” 開頭
.類名 {屬性名:屬性值;...
}
多類選擇器：
.類名1.類名2 {屬性名:屬性值;...
}
4.3 ID選擇器
使用 “#” 開頭
#ID名 {屬性名:屬性值;...
}
4.4 復(fù)合選擇器
多個(gè)標(biāo)簽在前面
a b c {屬性名:屬性值;...
}
a標(biāo)簽下的 b標(biāo)簽下的 c標(biāo)簽設(shè)置css樣式