塊級(jí)元素、行內(nèi)元素、內(nèi)聯(lián)元素的特點(diǎn)
塊級(jí)元素：block element
① 獨(dú)占一行；支持所有樣式
② 不設(shè)置寬高時(shí)寬度為父元素寬度
③ 換行符不解析
④ margin和padding的上下左右均對(duì)其有效
典型元素有：div，ul，ol，dl，li，p，h1~h6，table，form，pre（用源代碼的效果呈現(xiàn)內(nèi)容）
行內(nèi)元素：inline element
① 設(shè)置寬高無(wú)效
② margin和padding上下無(wú)效，左右有效
③ 寬度由內(nèi)容撐開
④ 不會(huì)自動(dòng)進(jìn)行換行，會(huì)在同一行顯示
⑤ 換行符會(huì)被解析
典型元素有：span，a，strong，em，i，img，input
3、內(nèi)聯(lián)塊級(jí)元素：inline-block element
① 不自動(dòng)換行
② 能夠識(shí)別寬高；
常見的元素的特點(diǎn)屬性：href、src的區(qū)別，alt和title的區(qū)別
href是Hypertext Reference的縮寫，表示超文本引用。用來(lái)建立當(dāng)前元素和文檔之間的鏈接。常用的有：link、a。例如：
<link href="reset.css" rel=”stylesheet“/>
瀏覽器會(huì)識(shí)別該文檔為css文檔，并行下載該文檔，并且不會(huì)停止對(duì)當(dāng)前文檔的處理。
src是source的縮寫，指向外部資源的位置，指向的內(nèi)部會(huì)遷入到文檔中當(dāng)前標(biāo)簽所在的位置，是引入。src指向的內(nèi)容會(huì)嵌入到文檔中當(dāng)前標(biāo)簽所在的位置。常用的有：img、script、iframe。例如:
<script src="script.js"></script>
當(dāng)瀏覽器解析到該元素時(shí)，會(huì)暫停瀏覽器的渲染，直到該資源加載完畢。這也是將js腳本放在底部而不是頭部的原因。
alt是html標(biāo)簽的屬性，而title既是html標(biāo)簽，又是html屬性。title標(biāo)簽這個(gè)不用多說，網(wǎng)頁(yè)的標(biāo)題就是寫在<title></title>這對(duì)標(biāo)簽之內(nèi)的。title作為屬性時(shí)，用來(lái)為元素提供額外說明信息。例如，給超鏈接標(biāo)簽a添加了title屬性，把鼠標(biāo)移動(dòng)到該鏈接上面是，就會(huì)顯示title的內(nèi)容，以達(dá)到補(bǔ)充說明或者提示的效果。而alt屬性則是用來(lái)指定替換文字，只能用在img、area（帶有可點(diǎn)擊區(qū)域的圖像映射）和input元素中（包括applet元素），用于網(wǎng)頁(yè)中圖片無(wú)法正常顯示時(shí)給用戶提供文字說明使其了解圖像信息。
HTML語(yǔ)義化的優(yōu)點(diǎn)
1、當(dāng)失去樣式時(shí)，頁(yè)面結(jié)構(gòu)清晰
2、便于團(tuán)隊(duì)的開發(fā)和維護(hù)
3、有利于SEO和搜索引擎建立良好溝通，有助于爬蟲抓取更多的有效信息
4、屏幕閱讀器會(huì)完全根據(jù)你的標(biāo)記來(lái)“讀”你的網(wǎng)頁(yè)
SEO的原理
SEO（Search Engine Optimization）：漢譯為搜索引擎優(yōu)化。搜索引擎優(yōu)化是一種利用搜索引擎的搜索規(guī)則來(lái)提高目前網(wǎng)站在有關(guān)搜索引擎內(nèi)的自然排名的方式。
對(duì)于任何一家網(wǎng)站來(lái)說，要想在網(wǎng)站推廣中取得成功，搜索引擎優(yōu)化是最為關(guān)鍵的一項(xiàng)任務(wù)。同時(shí)，隨著搜索引擎不斷變換它們的排名算法規(guī)則，每次算法上的改變都可能會(huì)大幅度改變網(wǎng)站的排名，而排名不理想的后果就是失去了網(wǎng)站固有的訪問量。
我們可以說，搜索引擎優(yōu)化也成了一個(gè)愈來(lái)愈復(fù)雜的任務(wù)。
SEO 包括六個(gè)環(huán)節(jié):
1、關(guān)鍵詞分析（也叫關(guān)鍵詞定位）
這是進(jìn)行SEO 最重要的一環(huán)，關(guān)鍵詞分析包括：關(guān)鍵詞關(guān)注量分析、競(jìng)爭(zhēng)對(duì)手分析、關(guān)鍵詞與網(wǎng)站相關(guān)性分析、關(guān)鍵詞布置、關(guān)鍵詞排名預(yù)測(cè)。
2、網(wǎng)站架構(gòu)分析
網(wǎng)站結(jié)構(gòu)符合搜索引擎的爬蟲喜好則有利于SEO。網(wǎng)站架構(gòu)分析包括：剔除網(wǎng)站架構(gòu)不良設(shè)計(jì)、實(shí)現(xiàn)樹狀目錄結(jié)構(gòu)、網(wǎng)站導(dǎo)航與鏈接優(yōu)化。
3、網(wǎng)站目錄和頁(yè)面優(yōu)化
SEO不止是讓網(wǎng)站首頁(yè)在搜索引擎有好的排名，更重要的是讓網(wǎng)站的每個(gè)頁(yè)面都帶來(lái)流量。
4、內(nèi)容發(fā)布和鏈接布置
搜索引擎喜歡有規(guī)律的網(wǎng)站內(nèi)容更新，所以合理安排網(wǎng)站內(nèi)容發(fā)布日程是SEO 的重要技巧之一。鏈接布置則把整個(gè)網(wǎng)站有機(jī)地串聯(lián)起來(lái)，讓搜索引擎明白每個(gè)網(wǎng)頁(yè)的重要性和關(guān)鍵詞，實(shí)施的參考是第一點(diǎn)的關(guān)鍵詞布置。友情鏈接戰(zhàn)役也是這個(gè)時(shí)候展開。
5、與搜索引擎對(duì)話
在搜索引擎看SEO 的效果，通過site:你的域名，知道站點(diǎn)的收錄和更新情況。更好的實(shí)現(xiàn)與搜索引擎對(duì)話，建議采用Google 網(wǎng)站管理員工具。
6、網(wǎng)站流量分析
網(wǎng)站流量分析從SEO 結(jié)果上指導(dǎo)下一步的SEO 策略，同時(shí)對(duì)網(wǎng)站的用戶體驗(yàn)優(yōu)化也有指導(dǎo)意義。流量分析工具，建議采用Google 流量分析。
SEO是這六個(gè)環(huán)節(jié)循環(huán)進(jìn)行的過程，只有不斷的進(jìn)行以上六個(gè)環(huán)節(jié)才能保證讓你的站點(diǎn)在搜索引擎有良好的表現(xiàn)。
什么是爬蟲、怎么去寫一個(gè)爬蟲
爬蟲就是一種完成發(fā)送網(wǎng)絡(luò)請(qǐng)求，接受返回?cái)?shù)據(jù)然后分析文本，收集需要的數(shù)據(jù)的工具，從上面的作用就能知道寫一個(gè)爬蟲就需要發(fā)送網(wǎng)絡(luò)的操作，接受返回?cái)?shù)據(jù)的操作，分析文本的操作。
!Doctype的作用、嚴(yán)格模式和混雜模式的區(qū)別、以及如何觸發(fā)兩種模式
首先Doctype是document type的簡(jiǎn)寫，意思為文檔類型，用來(lái)聲明你用的XHTML或者HTML是什么版本。確定了正確的Doctype，xhtml里面的標(biāo)識(shí)和css才能正常生效(也就是說它會(huì)告訴瀏覽器怎么解釋你的這個(gè)標(biāo)簽和你寫的css)，一般放置在html網(wǎng)頁(yè)代碼最頂部，處于 <html> 標(biāo)簽之前。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//CN" "http://www.w3. org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
如果是html5版本的，就寫成這樣
<!DOCTYPE html>
xhtml 1.0中有3種dtd聲明可以選擇，過渡性的(Transitional)、嚴(yán)格的(Strict)、框架的(Frameset)。
1、過渡的：一種要求不很嚴(yán)格的，允許在html中使用html 4.01的標(biāo)識(shí)(符合xhtml語(yǔ)法標(biāo)準(zhǔn))，過渡的dtd寫法如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2、嚴(yán)格的：一種要求嚴(yán)格的dtd，不允許使用任何表現(xiàn)層的標(biāo)識(shí)和屬性，嚴(yán)格的dtd寫法如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3、框架的：一種專門針對(duì)框架頁(yè)面所使用的dtd，當(dāng)頁(yè)面中含有框架元素時(shí)，就要采用這種dtd，寫法如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
嚴(yán)格模式是瀏覽器根據(jù)web標(biāo)準(zhǔn)去解析頁(yè)面，是一種要求嚴(yán)格的DTD，不允許使用任何表現(xiàn)層的語(yǔ)法，如< br/>；混雜模式是以一種向后兼容的方式去顯示，通常模擬老式瀏覽器的行為，以防止老站點(diǎn)無(wú)法工作。瀏覽器根據(jù)doctype是否存在和使用的是那種dtd來(lái)決定觸發(fā)哪種模式。
如果XHTML文檔包含形式完整的DOCTYPE，那么它一般以標(biāo)準(zhǔn)模式呈現(xiàn)。對(duì)于HTML 4.01文檔，包含嚴(yán)格DTD的DOCTYPE常常導(dǎo)致頁(yè)面以標(biāo)準(zhǔn)模式呈現(xiàn)。包含過渡DTD和URI的DOCTYPE也導(dǎo)致頁(yè)面以標(biāo)準(zhǔn)模式呈現(xiàn)，但是有過渡DTD而沒有URI會(huì)導(dǎo)致頁(yè)面以混雜模式呈現(xiàn)。DOCTYPE不存在或形式不正確會(huì)導(dǎo)致HTML和XHTML文檔以混雜模式呈現(xiàn)。
區(qū)別：
① 在嚴(yán)格模式中 ：width是內(nèi)容寬度 ，元素真正的寬度 = margin-left + border-left-width + padding-left + width + padding-right + border-right- width + margin-right；
在混雜模式中 ：width則是元素的實(shí)際寬度 ，內(nèi)容寬度 = width - ( padding-left + padding-right + border-left-width + border-right-width)
② 可以設(shè)置行內(nèi)元素的高寬，在標(biāo)準(zhǔn)模式下，給span等行內(nèi)元素設(shè)置wdith和height都不會(huì)生效，而在混雜模式下，則會(huì)生效。
③ 可設(shè)置百分比的高度：在嚴(yán)格模式下，一個(gè)元素的高度是由其包含的內(nèi)容來(lái)決定的，如果父元素沒有設(shè)置高度，子元素設(shè)置一個(gè)百分比的高度是無(wú)效的。
④ 用margin:0 auto設(shè)置水平居中在IE下會(huì)失效：使用margin:0 auto在嚴(yán)格模式下可以使元素水平居中，但在混雜模式下卻會(huì)失效，混雜模式下的解決辦法，用text-align屬性
body{
text-align:center;
}
#content{
text-align:left;
}
⑤ 混雜模式下設(shè)置圖片的padding會(huì)失效
⑥ 混雜模式下Table中的字體屬性不能繼承上層的設(shè)置
用JS判斷瀏覽器當(dāng)前的模式：
document.write(document.compatMode == "CSS1Compat" ? "當(dāng)前處于標(biāo)準(zhǔn)模式" : "當(dāng)前處于混雜模式");
