1
CSS 語(yǔ)法由三部分構(gòu)成：選擇器、屬性和值。selector {property: value}選擇器 (selector) 通常是你希望定義的 HTML 元素或標(biāo)簽，屬性 (property) 是你希望改變的屬性，并且每個(gè)屬性都有一個(gè)值。屬性和值被冒號(hào)分開(kāi)，并由花括號(hào)包圍，這樣就組成了一個(gè)完整的樣式聲明（declaration）：body {color: blue}上面這行代碼的作用是將 body 元素內(nèi)的文字顏色定義為藍(lán)色。在上述例子中，body 是選擇器，而包括在花括號(hào)內(nèi)的的部分是聲明。聲明依次由兩部分構(gòu)成：屬性和值，color 為屬性，blue 為值。
2
CSS的選擇器其實(shí)大類(lèi)的話(huà)可以分為三類(lèi)，即id選擇器、class選擇器、標(biāo)簽選擇器。
用法如下：
#id名 { 屬性名:屬性值; }
.class名 { 屬性名:屬性值; }
標(biāo)簽名 { 屬性名:屬性值; }
其中，他們之間又可以以不同的方式進(jìn)行組合，如下：
后代選擇器: 父代名 后代名 { 屬性名:屬性值; }
子代選擇器: 父代名>子代名 { 屬性名:屬性值; }
群組選擇器: #name1, .name2, #name div { 屬性名:屬性值; }
偽類(lèi)選擇器: name:偽類(lèi)
通用(通配符)選擇器: * { 屬性名: 屬性值; }……
常見(jiàn)的有：
- <header>頭部</header>
- <nav>導(dǎo)航</nav>
- < footer>底部</footer>
- <article></article>
- <aside></aside>
其中關(guān)于優(yōu)先級(jí)：行間樣式>id>class>類(lèi)型選擇>t通配符
3
body
{
background: #00FF00 url(bgimage.gif) no-repeat fixed top;
}
4
1
文本屬性有：
text-indent 檢索或設(shè)置對(duì)象中的文本的縮進(jìn)
letter-spacing 檢索或設(shè)置對(duì)象中的文字之間的間隔
word-spacing 檢索或設(shè)置對(duì)象中的單詞之間插入的空格數(shù)。
vertical-align 設(shè)置或檢索對(duì)象內(nèi)容的垂直對(duì)其方式
white-space 設(shè)置或檢索對(duì)象內(nèi)空格的處理方式
direction 檢索或設(shè)置文本流的方向
unicode-bidi 用于同一個(gè)頁(yè)面里存在從不同方向讀進(jìn)的文本顯示。與direction屬性一起使用
2
font的復(fù)合寫(xiě)法：font: 34px/48px;color:red;"宋體";width:100px;height:100px;
5
text-indent 屬性規(guī)定文本塊中首行文本的縮進(jìn)。
注釋?zhuān)涸试S使用負(fù)值。如果使用負(fù)值，那么首行會(huì)被縮進(jìn)到左邊。
6
<A href ="http//www.baidu.com">百度</A>跳轉(zhuǎn)頁(yè)面(大寫(xiě)a是為了能看到文本）
<A href="#**">id</A> 跳轉(zhuǎn)id
7
a標(biāo)簽?zāi)J(rèn)樣式是：帶下劃線，顯示顏色為藍(lán)色，被訪問(wèn)過(guò)的超鏈接變成紫色
8
1
網(wǎng)頁(yè)設(shè)計(jì)中常聽(tīng)的屬性名：內(nèi)容(content)、填充(padding)、邊框(border)、邊界(margin)， CSS盒子模式都具備這些屬性。
這些屬性我們可以用日常生活中的常見(jiàn)事物——盒子作一個(gè)比喻來(lái)理解，所以叫它盒子模式。
CSS盒子模型就是在網(wǎng)頁(yè)設(shè)計(jì)中經(jīng)常用到的CSS技術(shù)所使用的一種思維模型。
2
盒模型包括：內(nèi)容，填充，邊框，邊界。
3
個(gè)人理解就是內(nèi)容被填充包圍，邊框包圍填充，邊界包圍邊框的一個(gè)閉合結(jié)構(gòu)。
9
在CSS中margin是指從自身邊框到另一個(gè)容器邊框之間的距離，就是容器外距離--我理解為邊界。
在CSS中padding是指自身邊框到自身內(nèi)部另一個(gè)容器邊框之間的距離，就是容器內(nèi)距離--我理解為填充。
10
margin疊加：就是兩個(gè)邊界重合在一起
margin傳遞：子元素的margin設(shè)置在父元素上也起作用了
11
< title></title>：簡(jiǎn)短、描述性、唯一（提升搜索引擎排名）
<hn></hn>：h1~h6分級(jí)標(biāo)題，用于創(chuàng)建頁(yè)面信息的層級(jí)關(guān)系。
<header></header>：頁(yè)眉通常包括網(wǎng)站標(biāo)志、主導(dǎo)航、全站鏈接以及搜索框。
<nav></nav>：標(biāo)記導(dǎo)航，僅對(duì)文檔中重要的鏈接群使用。
<main></main>：頁(yè)面主要內(nèi)容，一個(gè)頁(yè)面只能使用一次。如果是web應(yīng)用，則包圍其主要功能。
<article></article>：包含像報(bào)紙一樣的內(nèi)容= =||是這么理解的，表示文檔、頁(yè)面、應(yīng)用或一個(gè)獨(dú)立的容器。
<section></section>：具有相似主題的一組內(nèi)容，比如網(wǎng)站的主頁(yè)可以分成介紹、新聞條目、聯(lián)系信息等條塊。
<aside></aside>：指定附注欄，包括引述、側(cè)欄、指向文章的一組鏈接、廣告、友情鏈接、相關(guān)產(chǎn)品列表等。
<footer></footer>：頁(yè)腳，只有當(dāng)父級(jí)是body時(shí)，
<Small> </Small>：指定細(xì)則，輸入免責(zé)聲明、注解、署名、版權(quán)。(大寫(xiě)S使可見(jiàn)）
<strong></strong>：表示內(nèi)容重要性。
<em></em>：標(biāo)記內(nèi)容著重點(diǎn)（大量用于提升段落文本語(yǔ)義）。
<mark></mark>：突出顯示文本（yellow）。
<time></time>：標(biāo)記時(shí)間。datetime屬性遵循特定格式，如果忽略此屬性，文本內(nèi)容必須是合法的日期或者時(shí)間格式。
12
塊元素與內(nèi)聯(lián)元素的區(qū)別
在css盒子模型中，我們提到了html元素中的塊元素（block element）和內(nèi)聯(lián)元素（inline element）。那么它們究竟是什么呢？
其實(shí)，這兩種元素都是html規(guī)范中的概念。塊元素(block element)一般是其他元素的容器元素，能容納其他塊元素或內(nèi)聯(lián)元素。最常見(jiàn)的就是P和div這兩個(gè)，說(shuō)的簡(jiǎn)單點(diǎn)，塊元素就好比一個(gè)四方塊，可以放其他的四方塊，并可以呈現(xiàn)在頁(yè)面上任何地方。默認(rèn)情況下塊元素，是獨(dú)占一行的。常見(jiàn)的塊元素：div、h1-h6標(biāo)題、form（只能用來(lái)容納其他塊元素）、hr、p、table、ul、ol等。內(nèi)聯(lián)元素(inline element)也叫內(nèi)嵌元素或行內(nèi)元素，一般都是基于語(yǔ)義級(jí)(semantic)的基本元素。內(nèi)聯(lián)元素只能容納文本或者其他內(nèi)聯(lián)元素，常見(jiàn)內(nèi)聯(lián)元素有a和span。
塊元素與內(nèi)聯(lián)元素的區(qū)別？
1.塊元素，總是在新行上開(kāi)始；內(nèi)聯(lián)元素，和其他元素都在一行上。
2.塊元素，能容納其他塊元素或內(nèi)聯(lián)元素；內(nèi)聯(lián)元素，只能容納文本或者其他內(nèi)聯(lián)元素。
3.塊元素中高度，行高以及頂和底邊距都可控制；內(nèi)聯(lián)元素中高，行高及頂和底邊距不可改變。
(這上面的區(qū)別，指的是默認(rèn)情況下的，不包括CSS的刻意控制。也就是說(shuō)當(dāng)使用css控制時(shí)，塊元素和內(nèi)聯(lián)元素的屬性差異會(huì)越來(lái)越小。)
