一、HTML元莫、XML氮昧、XHTML 有什么區(qū)別
HTML: 超級(jí)文本標(biāo)記語言是標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用框杜,也是一種規(guī)范浦楣,一種標(biāo)準(zhǔn)。超文本標(biāo)記語言它通過標(biāo)記符號(hào)來標(biāo)記要顯示的網(wǎng)頁中的各個(gè)部分咪辱。網(wǎng)頁文件本身是一種文本文件振劳,通過在文本文件中添加標(biāo)記符,可以告訴瀏覽器如何顯示其中的內(nèi)容(如:文字如何處理油狂,畫面如何安排历恐,圖片如何顯示等)。
XHTML:XHTML 指擴(kuò)展超文本標(biāo)簽語言
XHTML是當(dāng)前HTML版的繼承者专筷。HTML語法要求比較松散弱贼,這樣對(duì)網(wǎng)頁編寫者來說,比較方便磷蛹,但對(duì)于機(jī)器來說吮旅,語言的語法越松散,處理起來就越困難味咳,對(duì)于傳統(tǒng)的計(jì)算機(jī)來說庇勃,還有能力兼容松散語法,但對(duì)于許多其他設(shè)備槽驶,比如手機(jī)喜每,難度就比較大里初。因此產(chǎn)生了由DTD定義規(guī)則颁虐,語法要求更加嚴(yán)格的XHTML埋合。大部分常見的瀏覽器都可以正確地解析XHTML,即使老一點(diǎn)的瀏覽器全陨,XHTML作為HTML的一個(gè)子集爆班,許多也可以解析。也就是說烤镐,幾乎所有的網(wǎng)頁瀏覽器在正確解析HTML的同時(shí)蛋济,可兼容XHTML。當(dāng)然炮叶,從HTML完全轉(zhuǎn)移到XHTML碗旅,還需要一個(gè)過程。
XML:可擴(kuò)展標(biāo)記語言镜悉,標(biāo)準(zhǔn)通用標(biāo)記語言的子集祟辟,是一種用于標(biāo)記電子文件使其具有結(jié)構(gòu)性的標(biāo)記語言。在電子計(jì)算機(jī)中侣肄,標(biāo)記指計(jì)算機(jī)所能理解的信息符號(hào)旧困,通過此種標(biāo)記,計(jì)算機(jī)之間可以處理包含各種的信息比如文章等。它可以用來標(biāo)記數(shù)據(jù)吼具、定義數(shù)據(jù)類型僚纷,是一種允許用戶對(duì)自己的標(biāo)記語言進(jìn)行定義的源語言
XHTML與HTML的區(qū)別:
從HTML到XHTML過渡的變化比較小,主要是為了適應(yīng)XML拗盒。最大的變化在于文檔必須是良構(gòu)的怖竭,所有標(biāo)簽必須閉合,也就是說開始標(biāo)簽要有相應(yīng)的結(jié)束標(biāo)簽陡蝇。另外痊臭,XHTML中所有的標(biāo)簽必須小寫。而按照HTML 2.0以來的傳統(tǒng)登夫,很多人都是將標(biāo)簽大寫广匙,這點(diǎn)兩者的差異顯著。在XHTML中恼策,所有的參數(shù)值鸦致,包括數(shù)字,必須用雙引號(hào)括起來(而在SGML和HTML中涣楷,引號(hào)不是必須的蹋凝,當(dāng)內(nèi)容只是數(shù)字、字母及其它允許的特殊字符時(shí)总棵,可以不用引號(hào))。所有元素改含,包括空元素情龄,比如img、br等捍壤,也都必須閉合骤视,實(shí)現(xiàn)的方式是在開始標(biāo)簽?zāi)┪布尤胄笨浮J÷詤?shù)鹃觉,比如<option selected>专酗,也不允許,必須用<option selected="selected"/>盗扇。兩者的詳細(xì)差別祷肯,可通過W3C XHTML說明來查閱。
XML與HTML的區(qū)別:
- 它不是超文本標(biāo)記語言的替代疗隶。
- 它是對(duì)超文本標(biāo)記語言的補(bǔ)充佑笋。
- 它和超文本標(biāo)記語言為不同的目的而設(shè)計(jì):
- 它被設(shè)計(jì)用來傳輸和存儲(chǔ)數(shù)據(jù),其焦點(diǎn)是數(shù)據(jù)的內(nèi)容斑鼻。
- 超文本標(biāo)記語言被設(shè)計(jì)用來顯示數(shù)據(jù)蒋纬,其焦點(diǎn)是數(shù)據(jù)的外觀。
- 超文本標(biāo)記語言旨在顯示信息,而它旨在傳輸信息蜀备。
- 對(duì)它最好的描述是:它是獨(dú)立于軟件和硬件的信息傳輸工具关摇。
二、怎樣理解 HTML 語義化
首先是關(guān)于語義(Semantics)和默認(rèn)樣式的區(qū)別碾阁,默認(rèn)樣式是瀏覽器設(shè)定的一些常用tag的表現(xiàn)形式输虱,語義化的主要目的就是讓大家直觀的認(rèn)識(shí)標(biāo)簽(markup)和屬性(attribute)的用途和作用。
語義化的網(wǎng)頁的好處瓷蛙,最主要的就是對(duì)搜索引擎友好悼瓮,有了良好的結(jié)構(gòu)和語義你的網(wǎng)頁內(nèi)容自然容易被搜索引擎抓取,你網(wǎng)站的推廣便可以省下不少的功夫艰猬。
語義 Web 技術(shù)有助于利用基于開放標(biāo)準(zhǔn)的技術(shù)横堡,從數(shù)據(jù)、文檔內(nèi)容或應(yīng)用代碼中分離出意義冠桃。
三命贴、怎樣理解內(nèi)容與樣式分離的原則
CSS與HTML分離的優(yōu)點(diǎn)
1、使頁面載入得更快由于將大部分頁面代碼寫在了CSS當(dāng)中食听,使得頁面體積容量變得更小胸蛛。相對(duì)于表格嵌套的方式的逐層加載速度快。
2樱报、修改設(shè)計(jì)時(shí)更有效率在修改頁面的時(shí)候更加容易省時(shí)葬项。根據(jù)區(qū)域內(nèi)容標(biāo)記,到CSS里找到相應(yīng)的ID迹蛤,使得修改頁面的時(shí)候更加方便民珍,也不會(huì)破壞頁面其他部分的布局樣式。而表格布局則更不省事盗飒。3嚷量、保持視覺的一致性DIV+CSS最重要的優(yōu)勢(shì)之一:保持視覺的一致性;以往表格嵌套的制作方法逆趣,會(huì)使得頁面與頁面蝶溶,或者區(qū)域與區(qū)域之間的顯示效果會(huì)有偏差。4宣渗、更好地被搜索引擎收錄由于將大部分的HTML代碼和內(nèi)容樣式寫入了CSS文件中抖所,這就使得網(wǎng)頁中代碼更加適合搜索引擎。5落包、對(duì)瀏覽者和瀏覽器更具親和力對(duì)瀏覽者和瀏覽器更具親和力部蛇,由于CSS富含豐富的樣式,使頁面更加靈活性咐蝇,更加的美觀涯鲁,它可以根據(jù)不同的瀏覽器巷查,而達(dá)到顯示效果的統(tǒng)一和不變形。
** CSS與HTML分離的缺點(diǎn) **
1抹腿、CSS網(wǎng)站制作的設(shè)計(jì)元素通常放在1個(gè)外部文件中岛请,或幾個(gè)文件,有可能相當(dāng)復(fù)雜警绩,甚至比較龐大崇败。
2、雖然說DIV+CSS解決了大部分瀏覽器兼容問題肩祥,但是也有在部分瀏覽器中使用出現(xiàn)異常后室,比如火狐瀏覽器,在IE中顯示正常的頁面混狠,到了火狐瀏覽器中可能會(huì)面目全非岸霹。當(dāng)然這應(yīng)該是瀏覽器的問題,但是可以說在目前來看将饺,DIV+CSS還沒有實(shí)現(xiàn)所有瀏覽器的統(tǒng)一兼容贡避。
3、DIV+CSS對(duì)搜索引擎優(yōu)化與否,取決于網(wǎng)頁設(shè)計(jì)的專業(yè)水平,而不是DIV+CSS本身
四予弧、常用的meta標(biāo)簽總結(jié)
頁面關(guān)鍵詞
<meta name="keywords" content="your tags" />頁面描述
<meta name="description" content="150 words" />頁面重定向和刷新
<meta http-equiv="refresh" content="0;url=" />頁面重定向和刷新
<meta http-equiv="refresh" content="0;url=" />申明編碼
<meta charset='utf-8' />禁止瀏覽器從本地計(jì)算機(jī)的緩存中訪問頁面內(nèi)容
<meta http-equiv="Pragma" content="no-cache">隱藏狀態(tài)欄/設(shè)置狀態(tài)欄顏色
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />WebApp全屏模式
<meta name="apple-mobile-web-app-capable" content="yes" />
五刮吧、文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?
文檔聲明的作用:doctype聲明指出閱讀程序應(yīng)該用什么規(guī)則集來解釋文檔中的標(biāo)記。在Web文檔的情況下掖蛤,“閱讀程序”通常是瀏覽器或者校驗(yàn)器這樣的一個(gè)程序杀捻,“規(guī)則”則是W3C所發(fā)布的一個(gè)文檔類型定義(DTD)中包含的規(guī)則。Doctype可聲明三種DTD類型蚓庭,分別表示嚴(yán)格版本水醋、過渡版本以及基于框架的 HTML 文檔。
嚴(yán)格模式和混雜模式:
當(dāng)瀏覽器廠商開始創(chuàng)建與標(biāo)準(zhǔn)兼容的瀏覽器時(shí)彪置,他們希望確保向后兼容性。為了實(shí)現(xiàn)這一點(diǎn)蝇恶,他們創(chuàng)建了兩種呈現(xiàn)模式:標(biāo)準(zhǔn)模式和混雜模式
在標(biāo)準(zhǔn)模式中拳魁,瀏覽器以其支持的最高標(biāo)準(zhǔn)呈現(xiàn)頁面;
在混雜模式中撮弧,頁面以一種比較寬松的向后兼容的方式顯示潘懊。混雜模式通常模擬老式瀏覽器的行為以防止老站點(diǎn)無法工作贿衍。<!doctype html> 的作用:它是html5標(biāo)準(zhǔn)網(wǎng)頁聲明,全稱為Document Type HyperText Mark-up Language授舟,意思為文檔種類為超文本標(biāo)記性語言或超文本鏈接標(biāo)示語言,現(xiàn)在是這個(gè)簡潔形式贸辈,支持html5標(biāo)準(zhǔn)的主流瀏覽器都認(rèn)識(shí)這個(gè)聲明释树。表示網(wǎng)頁采用html5
附:
模式觸發(fā)
瀏覽器根據(jù)DOCTYPE是否存在以及使用的哪種DTD來選擇要使用的呈現(xiàn)方法。
如果XHTML、HTML 4.01文檔包含形式完整的DOCTYPE奢啥,那么它一般以標(biāo)準(zhǔn)模式呈現(xiàn)秸仙。
包含過渡DTD和URI的DOCTYPE也導(dǎo)致頁面以標(biāo)準(zhǔn)模式呈現(xiàn),但是有過渡DTD而沒有URI會(huì)導(dǎo)致頁面以混雜模式呈現(xiàn)桩盲。
DOCTYPE不存在或形式不正確會(huì)導(dǎo)致HTML和XHTML文檔以混雜模式呈現(xiàn)寂纪。
html5既然沒有DTD,也就沒有嚴(yán)格模式與寬松模式的區(qū)別赌结,html5有相對(duì)寬松的語法捞蛋,實(shí)現(xiàn)時(shí),已經(jīng)盡可能大的實(shí)現(xiàn)了向后兼容柬姚。
六拟杉、瀏覽器亂碼的原因是什么?如何解決伤靠?
亂碼產(chǎn)生的根本原因是你保存的編碼格式和瀏覽器解析時(shí)的解碼格式不匹配捣域,一般產(chǎn)生亂碼的都是中文
解決:即通知瀏覽器用正確的方式解碼,在文件保存的時(shí)候你自己要清楚是用哪種編碼方式保存的宴合。如果你的文件是保存為utf-8格式焕梅,那么一定要在html 的 <head>
里添加<meta charset="utf-8">
,這句話的意思是告訴瀏覽器在打開這個(gè)頁面的時(shí)候不要去猜了卦洽,直接用utf-8去解碼贞言。 同理,如果你的文件保存為gbk格式阀蒂,一定在文件里添加<meta charset="gbk">
七该窗、常見的瀏覽器有哪些,什么內(nèi)核蚤霞?
internet explorer使用Trident內(nèi)核酗失,Trident是就是ie內(nèi)核
Mozilla Firefox 和 Netscape MozillaSuite/SeaMonkey 等使用 Gecko 內(nèi)核
opera使用Presto內(nèi)核,Presto內(nèi)核是目前公認(rèn)網(wǎng)頁瀏覽速度最快的瀏覽器內(nèi)核
蘋果的safari昧绣,谷歌的chrome都使用WebKit內(nèi)核规肴,還有國產(chǎn)的大部分雙核瀏覽器其中一核就是WebKit
八、列出常見的標(biāo)簽夜畴,并簡單介紹這些標(biāo)簽用在什么場景
html 元素 代表 HTML 文檔的根(頂級(jí)元素)拖刃,其他所有元素都是此元素的后代
base 元素 指定文檔里所有相對(duì) URLs 地址的基礎(chǔ) URL 。一份文檔最多只能有一個(gè) <base> 元素贪绘。
head 元素 規(guī)定文檔相關(guān)的通用信息(元數(shù)據(jù))兑牡,包括文檔標(biāo)題、樣式或腳本的鏈接或定義税灌。
link元素指定了外部資源與當(dāng)前文檔的關(guān)系. 這個(gè)元素的使用方法包括為導(dǎo)航定義關(guān)系框架.這個(gè)元素經(jīng)常用來鏈接css文件均函。
meta 元素表示那些不能由其它HTML元素(<base>, <link>, <script>, <style> 或 <title>) 之一表示的任何元數(shù)據(jù)信息亿虽。
style元素包含了文檔的樣式化信息或者文檔的一部分。指定的樣式化星系包含的該元素內(nèi)边酒,通常是CSS的格式
** title**元素 定義文檔的標(biāo)題经柴,顯示在瀏覽器的標(biāo)題欄或標(biāo)簽頁上。它只可以包含文本墩朦,若是包含有標(biāo)簽坯认,則包含的任何標(biāo)簽都不會(huì)被解釋。
address元素可以讓作者為它最近的[article]或者<body>祖先元素提供聯(lián)系信息氓涣。在后一種情況下牛哺,它應(yīng)用于整個(gè)文檔。
article元素表示文檔劳吠、頁面引润、應(yīng)用或網(wǎng)站中的獨(dú)立結(jié)構(gòu),其意在成為可獨(dú)立分配的或可復(fù)用的結(jié)構(gòu)痒玩,如在發(fā)布中淳附,它可能是論壇帖子、雜志或新聞文章蠢古、博客奴曙、用戶提交的評(píng)論、交互式組件草讶,或者其他獨(dú)立的內(nèi)容項(xiàng)目
aside 元素表示一個(gè)和其余頁面內(nèi)容幾乎無關(guān)的部分洽糟,被認(rèn)為是獨(dú)立于該內(nèi)容的一部分并且可以被單獨(dú)的拆分出來而不會(huì)使整體受影響。其通常表現(xiàn)為側(cè)邊欄或者嵌入內(nèi)容堕战。他們通常包含在工具條坤溃,例如來自詞匯表的定義。也可能有其他類型的信息嘱丢,例如相關(guān)的廣告薪介、筆者的傳記、web 應(yīng)用程序越驻、個(gè)人資料信息昭灵,或在博客上的相關(guān)鏈接。
**footer 元素表示最近一個(gè)章節(jié)內(nèi)容元素的頁腳伐谈。一個(gè)頁腳通常包含該章節(jié)作者、版權(quán)數(shù)據(jù)或者與文檔相關(guān)的鏈接等信息试疙。
header元素表示一組引導(dǎo)性的幫助诵棵,可能包含標(biāo)題元素,也可以包含其他元素祝旷,像logo履澳、分節(jié)頭部嘶窄、搜索表單等。
div元素 (或 HTML 文檔分區(qū)元素) 是一個(gè)通用型的流內(nèi)容容器距贷,它在語義上不代表任何特定類型的內(nèi)容柄冲,它可以被用來對(duì)其它元素進(jìn)行分組,一般用于樣式化相關(guān)的需求
** dt 元素 (或 HTML 術(shù)語定義元素)用于在一個(gè)定義列表中聲明一個(gè)術(shù)語忠蝗。該元素僅能作為 dl 的子元素出現(xiàn)现横。通常在該元素后面會(huì)跟著 dd元素, 然而阁最,多個(gè)連續(xù)出現(xiàn)的 dt 元素都將由出現(xiàn)在它們后面的第一個(gè) dd 元素定義戒祠。
figure 元素代表一段獨(dú)立的內(nèi)容, 經(jīng)常與說明(caption) <figcaption> 配合使用, 并且作為一個(gè)獨(dú)立的引用單元。當(dāng)它屬于主體(main flow)時(shí)速种,它的位置獨(dú)立于主體姜盈。這個(gè)標(biāo)簽經(jīng)常是在主文中引用的圖片,插圖配阵,表格馏颂,代碼段等等,當(dāng)這部分轉(zhuǎn)移到附錄中或者其他頁面時(shí)不會(huì)影響到主體
h1–h6代表標(biāo)題的六個(gè)級(jí)別棋傍,前者是最高級(jí)別救拉,后者是最低級(jí)別
p 指段落
b用于文字的粗體
I用于文字的斜體
sup 指文字的上標(biāo)
sub 指文字的下標(biāo)
br/ 用于自動(dòng)換行
**hr/ **用于插入水平線
strong 用于加粗
**em **起強(qiáng)調(diào)作用,默認(rèn)顯示斜體
**abbr **指縮寫
cite 指引用來源
dfn指一個(gè)新術(shù)語的定義
address 包含設(shè)計(jì)者的聯(lián)系詳情
**ins **用來顯示已經(jīng)插入文檔中的內(nèi)容
del用來顯示已經(jīng)從文檔中刪除的文本
ol用于創(chuàng)建有序列表
li代表列表中的項(xiàng)目
**ul **用來創(chuàng)建無序列表
a 用于建立鏈接舍沙,有一個(gè)重要的值href近上,href特性的值設(shè)定了鏈接的目標(biāo)
table 用來 創(chuàng)建表格
**tr **代表表格每行的開始
**td **指表格每行的結(jié)束
th指表格列或行的標(biāo)題
p 指段落