一、css用途和使用方法
????1.主要為網(wǎng)頁(yè)添加樣式,可理解為讓網(wǎng)頁(yè)長(zhǎng)成怎么樣
? ? 2.三種使用方法:外部 CSS、內(nèi)部 CSS、行內(nèi) CSS
? ? ? ? (1)、外部 CSS
? ? ? ? ? ? --通過(guò)使用外部樣式表,您只需修改一個(gè)文件即可改變整個(gè)網(wǎng)站的外觀!
? ? ? ? ? ? --每張 HTML 頁(yè)面必須在 head 部分的 <link> 元素內(nèi)包含對(duì)外部樣式表文件的引用。
<!DOCTYPE html>
<html>
????<head>
????????<link rel="stylesheet" type="text/css" href="aa.css">
? ? </head>
<body>
????<h1>外部使用css</h1></body>
</html>
????????(2)、內(nèi)部 CSS
? ? ? ? ? ? --內(nèi)部樣式是在 head 部分的 <style> 元素中進(jìn)行定義。
<!DOCTYPE html>
<html>
? <head>
? ? <style>
? ? body {
? ? ? background-color: linen;
? ? }
? ? h1 {
? ? ? color: maroon;
? ? ? margin-left: 40px;
? ? }
? ? </style>
? </head>
<body>
? <h1>內(nèi)部樣式css</h1>
</body>
</html>
????????(3)、行內(nèi) CSS,也叫內(nèi)聯(lián)樣式? 在元素內(nèi)用style聲明
<!DOCTYPE html>
<html>
<body>
? <h1 style="color:blue;text-align:center;">這是行內(nèi)樣式</h1>
</body>
</html>
二、CSS 語(yǔ)法

? ? 步驟1、選擇器指向您需要設(shè)置樣式的 HTML 元素。這里指向的是h1元素
? ? 步驟2、聲明塊包含一條或多條用分號(hào)分隔的聲明。
? ? 步驟3、每條聲明都包含一個(gè) CSS 屬性名和值,以冒號(hào)分隔。
????步驟4、多條 CSS 聲明用分號(hào)分隔,聲明塊用花括號(hào)括起來(lái)。
三、CSS 選擇器
? ?1、 用途:用于選取要設(shè)置樣式的 HTML 元素。
四、CSS 選擇器分類
? ? 1、CSS 選擇器分為五類:
? ??????簡(jiǎn)單選擇器(根據(jù)名稱、id、類來(lái)選取元素)
????????組合器選擇器(根據(jù)它們之間的特定關(guān)系來(lái)選取元素)
????????偽類選擇器(根據(jù)特定狀態(tài)選取元素)
????????偽元素選擇器(選取元素的一部分并設(shè)置其樣式)
????????屬性選擇器(根據(jù)屬性或?qū)傩灾祦?lái)選取元素)
五、簡(jiǎn)單選擇器
? ? 1、id選擇器 ----? # 號(hào)? ? ? ? 特點(diǎn):唯一
? ??#aa { text-align:center;color:red;}? ??
? ? 2、class類選擇器? ?------? . 號(hào)
? ? ?.aa { text-align:center;color:red;}? ??
? ? 3、元素選擇器? ?------- 每一個(gè)特定元素,比對(duì)所有p元素設(shè)置字體顏色為紅色
? ? p{color:red}
? ? 4、通用選擇器? ?-------?通用選擇器(*)選擇頁(yè)面上的所有的 HTML 元素。
? ? ? ?*{text-align:center;color:red;}
? ? 5、分組選擇器? ? -----? ?用 ,隔開(kāi)
? ? p,div{color:red}? ?
? ? .aa,p{color:red}
六、顏色
1、背景顏色: background-color
2、字體顏色:color
3、CSS 顏色值:rgb(255, 99, 71) 或者 #ccc 或者 rgba(0,0,0,0.4)或者顏色名(red、blue等)
顏色取值參考網(wǎng)址:https://www.sioe.cn/yingyong/yanse-rgb-16
