1嵌言、css的發(fā)展史:
? ? css 是用來表現(xiàn)我們html? 文件的一種語(yǔ)言
? ? ? ? 1996年? 發(fā)布第一個(gè)版本
? ? ? ? 2004年? 發(fā)布的2.01版本
? ? ? ? 2010年? 最新版本3.0版本
2序攘、基本語(yǔ)法+選擇器:
(1)基本語(yǔ)法
(2)選擇器
選擇器{
? ? ? ? 聲明1礼烈;(聲明里面包含了屬性名和屬性值)
? ? ? ? 聲明2;
? ? ? ? ? ? ? }
直接用標(biāo)簽改變樣式惧蛹,這個(gè)標(biāo)簽就稱作標(biāo)簽選擇器
(3)類選擇器?
?類選擇器? 可以給多個(gè)標(biāo)簽設(shè)置一樣的類名
? <p class="c">? 我是p標(biāo)簽</p>
? <h2 class="c">我是h2</h2>
id選擇器? 一個(gè)id名只能對(duì)一個(gè)標(biāo)簽(唯一性)
? <h3 id="d">我是h3</h3>
選擇器的優(yōu)先級(jí):
id? 最大---class---標(biāo)簽最小
3、引入方式
(1)行內(nèi)樣式
在body段落中直接引入
(2)內(nèi)部樣式
(3)外部樣式 (兩種方法引入)
1代咸、外部引用第一種 鏈接引入
<link rel="stylesheet" href"外部.css格式文本">
2译荞、外部引入第二種 導(dǎo)入本地css
? ? ? @import url(導(dǎo)入本地.css文本)?
優(yōu)先級(jí):
? ? ? css樣式遵循就近原則? 行內(nèi)樣式>內(nèi)部樣式>外部樣式
4、span標(biāo)簽
span標(biāo)簽沒有實(shí)際意義
不能直接設(shè)置寬高忿晕,不獨(dú)占一行
5装诡、字體樣式
font-size: __px; 設(shè)置P標(biāo)簽里面的字體大小
? ? ? font-family: "宋體"? ? 設(shè)置P標(biāo)簽里面的字體類型
? ? ? font-style: italic;? ? 設(shè)置P標(biāo)簽里面的字體樣式為傾斜
? ? ? 設(shè)置P 標(biāo)簽里面的字體粗細(xì)
? ? ? font-weight: bold;加粗
? ? ? font-weight: bolder;在bold基礎(chǔ)上更粗
? ? ? font-weight: lighter; 變得更細(xì)
? ? ? font-weight: 100; 取值范圍100-900,常用400? 600? 900(同樣設(shè)置字體粗細(xì))
? 亦可以簡(jiǎn)寫為: font:italic 900 50px "楷體";
? ? ? 順序: font : font-style(傾斜)? font-weight(粗細(xì))? font-size(字體大屑巍)? font-family(字體類型)
6鸦采、文本樣式:
? ? color: #000; 黑色
? ? color:#fff; 白色
? ? color: #f00; 紅色
? ? color: #0f0; 綠色
? ? color: #00f; 藍(lán)色
? ? color: rgb(255, 0, 0);
? ? color: rgba(255, 0, 0, .9);
? ? rgba(? ? );設(shè)置透明色,透明度的0.9可以寫成.9
? ? text-align: left;? ? 文本居左
? ? text-align:right? ? 文本居右
? ? text-align: center;? 將文本居中
? ? text-indent: __px;? 設(shè)置首行縮進(jìn)
? ? line-height: 100px;? 設(shè)置行高
? ? 設(shè)置行高等于高度咕幻,并且再設(shè)置text-align:center 就可以讓文本水平居中
? ? text-decoration:none;? ? ? ? ? ? 設(shè)置文本的裝飾(none為默認(rèn)值渔伯,代表無)
? ? text-decoration: underline;? ? ? 給文本添加下劃線
? ? text-decoration: overline;? ? ? 給文本上方加上一條線
? ? text-decoration:line-through? ? 給文本加上一條線,穿過這個(gè)文本
7肄程、a標(biāo)簽的偽類
? ? a:link 未訪問時(shí)候的樣式
? ? a:visited? 訪問過后的樣式
? ? a:hover? ? 鼠標(biāo)懸浮上方的樣式
? ? a:sctive? ? 鼠標(biāo)未點(diǎn)擊未松開時(shí)的樣式
? ? 順序不可錯(cuò)锣吼,記憶方式love hate