1. HTML绿鸣、XML椎木、XHTML 有什么區(qū)別
網(wǎng)頁(yè)編碼發(fā)展過程：html-->xhtml-->xml
| HTML | XHTML | XML |
|---|---|---|
| 超文本編輯語(yǔ)言 | 可擴(kuò)展超文本標(biāo)記語(yǔ)言 | 可擴(kuò)展標(biāo)記語(yǔ)言 |
| 最早寫網(wǎng)頁(yè)的語(yǔ)言灭红，但是由于時(shí)間早为肮，規(guī)范不是很好叉钥，大小寫混寫且編碼不規(guī)范 | 對(duì)html進(jìn)行了規(guī)范罢缸，編碼更加嚴(yán)謹(jǐn)純潔 | 一種跨平臺(tái)語(yǔ)言，編碼更自由投队，可以自由創(chuàng)建標(biāo)簽 |
| 編碼不規(guī)范枫疆，結(jié)構(gòu)混亂臃腫，需要智能的終端才能很好的顯示;表現(xiàn)和結(jié)構(gòu)混亂蛾洛，不利于開發(fā)和維護(hù);不能使用更多的網(wǎng)絡(luò)設(shè)備养铸，比如手機(jī)雁芙、PDA等 | 元素必須要有結(jié)束標(biāo)簽；元素必須嵌套钞螟；name屬性是不贊成使用的 | 嚴(yán)格區(qū)分大小寫 |
2. 怎樣理解 HTML 語(yǔ)義化
語(yǔ)義化是標(biāo)簽內(nèi)容語(yǔ)義化兔甘，在表現(xiàn)結(jié)構(gòu)的同時(shí)告訴我們每個(gè)標(biāo)簽的的作用。例如下圖中并沒有出現(xiàn)div標(biāo)簽鳞滨，依然完成了整個(gè)布局洞焙，其中的header標(biāo)簽就告訴我們這是網(wǎng)頁(yè)的頭部。選擇合適的標(biāo)簽可以便于開發(fā)者閱讀和寫出更優(yōu)雅的代碼拯啦，HTML 語(yǔ)義化對(duì)瀏覽器更友好澡匪。
標(biāo)簽語(yǔ)義化的好處
- 方便機(jī)器理解代碼,利于SEO（搜索引擎優(yōu)化）。
使搜索引擎爬蟲更好的理解你的代碼褒链，你的網(wǎng)站排名自然有加分了唁情。 - 代碼更簡(jiǎn)潔，復(fù)用性更高甫匹。使用合適的標(biāo)簽甸鸟，可以少些很多css或者js
例如h1~h6標(biāo)簽本身具有不同的font-size，沒有特殊要求不用css來設(shè)置兵迅，而且可以重復(fù)使用抢韭。 - 訪問性更好
這個(gè)主要就是針對(duì)讀屏器或者其他一些對(duì)CSS理解不好的瀏覽器。語(yǔ)義化的HTML可以做到脫離CSS還能看恍箭，而非語(yǔ)義化的就難了
3. 怎樣理解內(nèi)容與樣式分離的原則
內(nèi)容主要由html負(fù)責(zé)刻恭，樣式主要由css負(fù)責(zé)，而js主要負(fù)責(zé)行為
4. 有哪些常見的meta標(biāo)簽
- 申明編碼
<meta charset='utf-8' />
- 優(yōu)先使用 IE 最新版本和 Chrome
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta http-equiv="X-UA-Compatible" content="IE=6" >
<meta http-equiv="X-UA-Compatible" content="IE=7" >
<meta http-equiv="X-UA-Compatible" content="IE=8" >
- 瀏覽器內(nèi)核控制
國(guó)內(nèi)瀏覽器很多都是雙內(nèi)核（webkit和Trident）,webkit內(nèi)核高速瀏覽扯夭，IE內(nèi)核兼容網(wǎng)頁(yè)和舊版網(wǎng)站鳍贾。 而添加meta標(biāo)簽的網(wǎng)站可以控制瀏覽器選擇何種內(nèi)核渲染。
搜狗高速瀏覽器勉抓、QQ瀏覽器：IE內(nèi)核（兼容模式）
360極速瀏覽器贾漏、遨游瀏覽器：Webkit內(nèi)核（極速模式）
<meta name="renderer" content="webkit|ie-comp|ie-stand">
- 禁止瀏覽器從本地計(jì)算機(jī)的緩存中訪問頁(yè)面內(nèi)容
這樣設(shè)定，訪問者將無(wú)法脫機(jī)瀏覽藕筋。
<meta http-equiv="Pragma" content="no-cache">
- 避免百度轉(zhuǎn)碼申明
用百度打開網(wǎng)頁(yè)可能會(huì)對(duì)其進(jìn)行轉(zhuǎn)碼（比如貼廣告）纵散，避免轉(zhuǎn)碼可添加如下meta
<meta http-equiv="Cache-Control" content="no-siteapp" />
- 頁(yè)面關(guān)鍵詞
每個(gè)網(wǎng)頁(yè)應(yīng)具有描述該網(wǎng)頁(yè)內(nèi)容的一組唯一的關(guān)鍵字, 不要太短也不要太長(zhǎng)
<meta name="keywords" content="your tags" />
- 頁(yè)面描述
每個(gè)網(wǎng)頁(yè)都應(yīng)該有一個(gè)不超過150個(gè)字符的頁(yè)面描述
<meta name="description" content="150 words" />
- 設(shè)置搜索引擎索引方式
<meta name="robots" content="index,follow" />
5. 文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?
<!DOCTYPE>聲明叫做文件類型定義（DTD），聲明的作用為了告訴瀏覽器該文件的類型隐圾。讓瀏覽器解析器知道應(yīng)該用哪個(gè)規(guī)范來解析文檔伍掀。<!DOCTYPE>聲明必須在 HTML 文檔的第一行，這并不是一個(gè) HTML 標(biāo)簽暇藏。
嚴(yán)格模式：又稱標(biāo)準(zhǔn)模式蜜笤，是指瀏覽器按照 W3C 標(biāo)準(zhǔn)解析代碼。
混雜模式：又稱怪異模式或兼容模式盐碱，是指瀏覽器用自己的方式解析代碼把兔。
如何區(qū)分：瀏覽器解析時(shí)到底使用嚴(yán)格模式還是混雜模式弄贿，與網(wǎng)頁(yè)中的 DTD 直接相關(guān)僵闯。
<!doctype html> 是說明代碼是按照html5的規(guī)范來寫的碳柱。
6. 瀏覽器亂碼的原因是什么禀倔？如何解決
網(wǎng)站頭部設(shè)定的編碼和網(wǎng)頁(yè)本身的編碼不一致導(dǎo)致的，html網(wǎng)頁(yè)頭部代碼：<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />是告訴瀏覽器該用什么編碼來讀取網(wǎng)頁(yè)的內(nèi)容缕贡，然后瀏覽器就會(huì)啟用相應(yīng)的解碼來程序內(nèi)容翁授，同時(shí)，網(wǎng)站本身還存在一個(gè)編碼的機(jī)制晾咪，中國(guó)人一般使用gbk收擦、gb2312、utf-8編碼谍倦，如果網(wǎng)站制作者將網(wǎng)頁(yè)文件存儲(chǔ)為了gbk格式塞赂，然后在網(wǎng)頁(yè)頭部卻設(shè)置了utf-8的格式，那么瀏覽器在讀取網(wǎng)頁(yè)的時(shí)候就會(huì)將中文或其他非英文和數(shù)字的字符解析成亂碼昼蛀。
如果是這種編碼錯(cuò)誤减途，解決辦法很簡(jiǎn)單，將解碼方式和文件存儲(chǔ)的編碼修改成一致即可曹洽，瀏覽者在遇到此類情況，可以在網(wǎng)頁(yè)空白處右鍵-編碼種選擇多種編碼方式試試辽剧，就可以看到亂碼的文字了送淆。不合理的字符串截取造成個(gè)別字符亂碼，在gbk和gb2312編碼下怕轿，中文是占用兩個(gè)字節(jié)偷崩，而在utf-8編碼模式下，中文字符占用三個(gè)字節(jié)撞羽，而英文和數(shù)字都是占用一個(gè)字節(jié)阐斜，如果用英文的一些截取方式去截取中文字符的話，就可能出現(xiàn)將一個(gè)中文截?cái)嗟默F(xiàn)象诀紊，網(wǎng)頁(yè)就會(huì)出現(xiàn)中文亂碼谒出，而gbk和utf-8的中文截取手段也不一樣。
這種情況的解決辦法就是規(guī)范截取字符串的函數(shù)邻奠，因地制宜笤喳。數(shù)據(jù)庫(kù)編碼問題導(dǎo)致，這種情況在mysql中經(jīng)常出現(xiàn)碌宴，因?yàn)閙ysql等一些數(shù)據(jù)庫(kù)支持存儲(chǔ)各種編碼的字符串杀狡，并且也有編碼的區(qū)分， 讀取數(shù)據(jù)庫(kù)的方式這個(gè)很關(guān)鍵贰镣，必須和網(wǎng)頁(yè)的頭部設(shè)定和存儲(chǔ)編碼一致呜象，如果不一致就會(huì)出現(xiàn)亂碼膳凝。
AJAX傳遞中文編碼導(dǎo)致的，AJAX在傳遞中文數(shù)據(jù)的時(shí)候只支持UTF-8編碼的中文恭陡，所以如果嘗試用其他編碼方式傳遞的話就會(huì)出現(xiàn)亂碼蹬音，解決辦法是在傳遞中文數(shù)據(jù)前就將中文數(shù)據(jù)轉(zhuǎn)碼成utf-8。
7. 常見的瀏覽器有哪些子姜，什么內(nèi)核
- Trident-IE瀏覽器內(nèi)核
- Gecko-火狐瀏覽器內(nèi)核Mozilla
- Blink(Webkit的分支)-谷歌瀏覽器內(nèi)核
- Presto祟绊，現(xiàn)為Blink-Opera瀏覽器內(nèi)核
8. 列出常見的標(biāo)簽，并簡(jiǎn)單介紹這些標(biāo)簽用在什么場(chǎng)景
| 標(biāo)簽 | 應(yīng)用場(chǎng)景 |
|---|---|
| h1~h6 | 標(biāo)題 |
| p | 段落 |
| img | 插入圖片 |
| a | 插入一個(gè)鏈接 |
| ul li | 制作導(dǎo)航欄 |
| table dt dl dd | 制作表格 |
| article | 獨(dú)立的自包含內(nèi)容 |
| audio | 插入一段音頻 |
| body | 文檔的主體 |
| button | 定義一個(gè)按鈕 |
| div | 獨(dú)立的自包含內(nèi)容哥捕，是塊級(jí)元素 |
| form | 為用戶輸入創(chuàng)建 HTML 表單 |
| header | 標(biāo)簽定義文檔的頁(yè)眉（介紹信息） |
| script | 在 HTML 頁(yè)面中插入一段 JavaScript |
| title | 元素可定義文檔的標(biāo)題 |
參考:
html和xhtml和xml的區(qū)別
關(guān)于HTML語(yǔ)義化的一些理解
meta常用屬性
網(wǎng)站制作
