HTML
HTML是一種用于創(chuàng)建網(wǎng)頁(yè)標(biāo)記語(yǔ)言会钝,與CSS,JavaScript一起被眾多網(wǎng)站用于設(shè)計(jì)網(wǎng)頁(yè),網(wǎng)頁(yè)應(yīng)用程序以及移動(dòng)應(yīng)用程序的用戶界面工三。瀏覽器可以讀取HTML文件迁酸,并將其渲染成可視化網(wǎng)頁(yè)。
XML
XML也是一種標(biāo)記語(yǔ)音俭正, 不過(guò)XML的主要功能不在如何數(shù)據(jù)奸鬓,而是如何存儲(chǔ)數(shù)據(jù)和結(jié)構(gòu)。語(yǔ)法比較嚴(yán)謹(jǐn)
XHTML
XHTML即為可拓展超文本標(biāo)記語(yǔ)言掸读,像是HTML與XML的結(jié)合串远,作用與HTML類(lèi)似宏多,但是比HTML得語(yǔ)法更加嚴(yán)謹(jǐn)
如何理解HTML語(yǔ)義化
根據(jù)內(nèi)容的結(jié)構(gòu)化(內(nèi)容語(yǔ)義化),選擇合適的標(biāo)簽(代碼語(yǔ)義化)便于開(kāi)發(fā)者閱讀和寫(xiě)出更優(yōu)雅的代碼的同時(shí)讓瀏覽器的爬蟲(chóng)和機(jī)器很好地解析澡罚。
為什么要語(yǔ)義化
- 為了在沒(méi)有CSS的情況下伸但,頁(yè)面也能呈現(xiàn)出很好地內(nèi)容結(jié)構(gòu)、代碼結(jié)構(gòu):為了裸奔時(shí)好看
- 用戶體驗(yàn):例如title留搔、alt用于解釋名詞或解釋圖片信息更胖、label標(biāo)簽的活用
- 有利于SEO:和搜索引擎建立良好溝通,有助于爬蟲(chóng)抓取更多的有效信息:爬蟲(chóng)依賴于標(biāo)簽來(lái)確定上下文和各個(gè)關(guān)鍵字的權(quán)重
- 方便其他設(shè)備解析(如屏幕閱讀器催式、盲人閱讀器函喉、移動(dòng)設(shè)備)以意義的方式來(lái)渲染網(wǎng)頁(yè)
- 便于團(tuán)隊(duì)開(kāi)發(fā)和維護(hù),語(yǔ)義化更具可讀性荣月,是下一步吧網(wǎng)頁(yè)的重要?jiǎng)酉蚬芎牵裱璚3C標(biāo)準(zhǔn)的團(tuán)隊(duì)都遵循這個(gè)標(biāo)準(zhǔn),可以減少差異化
怎樣理解內(nèi)容與樣式分離的原則
內(nèi)容與樣式分離可以試代碼更便于閱讀哺窄,也可以使代碼更便于修改捐下,既提高了效率,也增強(qiáng)了簡(jiǎn)潔性和靈活性萌业,減少了修改代碼的成本坷襟。詳情請(qǐng)看這里.
常見(jiàn)的meta標(biāo)簽
-
<meta charset="utf-8">
規(guī)定 html文檔的字符編碼utf-8,用于使瀏覽器能夠正確編碼——識(shí)別我們HTML內(nèi)容的語(yǔ)言 -
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
IE 支持通過(guò)特定的 <meta> 標(biāo)簽來(lái)確定繪制當(dāng)前頁(yè)面所應(yīng)該采用的 IE 版本 -
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
使HTML代碼在移動(dòng)端合理地展示 -
<meta name="keywords/discription content="">
利于搜索引擎更好的搜索你的頁(yè)面
文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?
1.文檔聲明用于告訴瀏覽器用什么樣的HTML版本解析我們寫(xiě)的代碼生年,或者說(shuō)告訴瀏覽器我們使用的是什么標(biāo)記語(yǔ)言婴程。
2.嚴(yán)格模式:瀏覽器使用W3C標(biāo)準(zhǔn)解析代碼。如果文檔包含嚴(yán)格的 DOCTYPE 抱婉,那么它一般以嚴(yán)格模式呈現(xiàn)档叔。
3.混雜模式:瀏覽器使用自己的標(biāo)準(zhǔn)解析代碼。DOCTYPE 不存在或形式不正確會(huì)導(dǎo)致文檔以混雜模式呈現(xiàn)蒸绩。
4.<!DOCTYPE HTML>的含義是使用HTML5的標(biāo)準(zhǔn)解析代碼衙四。
瀏覽器亂碼的原因是什么?如何解決
首先了解我們寫(xiě)入文件到展示文件的4個(gè)流程
1.我們使用編輯器編寫(xiě) HTML 文件
2.保存編寫(xiě)的HTML文件
3.使用瀏覽器打開(kāi)HTML文件
4.HTML文件在瀏覽器展示
問(wèn)題發(fā)生在第二步和第四步患亿,當(dāng)我們保存HTML文件的時(shí)候传蹈,我們的編輯器會(huì)用某種編碼方式保存我們的文件,然后我們保存的文件被瀏覽器解析的時(shí)候步藕,瀏覽器默認(rèn)的編碼方式與我們?cè)揪庉嬈鞯木幋a方式發(fā)生沖突惦界,變引發(fā)了瀏覽器亂碼。
如何規(guī)避亂碼咙冗?
- 首先表锻,在文件保存的時(shí)候你自己要清楚是用哪種編碼方式保存的。
- 在你的代碼中添加meta標(biāo)簽告訴瀏覽器你使用的編碼方式解碼乞娄。
關(guān)于編碼與亂碼 詳情參見(jiàn)聊一聊編碼與亂碼
常見(jiàn)的瀏覽器及其內(nèi)核
- 使用Trident的是internet explorer瞬逊,國(guó)產(chǎn)的絕大部分瀏覽器。Trident是就是IE
- 使用Gecko的是Mozilla Firefox仪或,使用 Gecko 內(nèi)核的瀏覽器也有不少确镊,如 Netscape MozillaSuite/SeaMonkey 等
- 使用Presto的是opera,這是目前公認(rèn)網(wǎng)頁(yè)瀏覽速度最快的瀏覽器內(nèi)核
- 使用WebKit的又蘋(píng)果的Safari范删,谷歌的Chrome蕾域,還有國(guó)產(chǎn)的大部分雙核瀏覽器其中一核就是WebKit.
HTML常見(jiàn)的標(biāo)簽
-
<i><b><u>
分別是斜體,加粗到旦,和下劃線旨巷。其中<b>
和<strong>
效果類(lèi)似。<b>
元素現(xiàn)在描述為在普通文章中僅從文體上突出的不包含任何額外的重要性的一段文本添忘。例如:文檔概要中的關(guān)鍵字采呐,評(píng)論中的產(chǎn)品名「槠铮或者代表強(qiáng)調(diào)的排版方式斧吐。<strong>
有更強(qiáng)的語(yǔ)義 -
<!DOCTYPE HTML>
用于聲明文檔類(lèi)型 -
<html></html>
在這個(gè)標(biāo)簽里面書(shū)寫(xiě)html代碼,html有個(gè)lang屬性仲器,用來(lái)告訴瀏覽器編者使用的語(yǔ)言如<html lang=zn>
表示頁(yè)面使用的中文 -
<head></head>
網(wǎng)頁(yè)的頭標(biāo)簽煤率,用于存放一些關(guān)于頁(yè)面本身的信息,如<title></title>
標(biāo)簽和<meta>
標(biāo)簽 -
<body></body>
網(wǎng)頁(yè)的內(nèi)容乏冀,html大部分標(biāo)簽都是嵌套在這個(gè)標(biāo)簽內(nèi)部 -
<h1-6></h>
標(biāo)題標(biāo)簽蝶糯,數(shù)字1到6代表了6個(gè)等級(jí)的標(biāo)題,數(shù)字越小代表嵌套在里面的文本像素越大 -
<p></p>
段落標(biāo)簽辆沦,用來(lái)存放一段或幾段文字 -
<div></div>
塊級(jí)標(biāo)簽昼捍,通常用來(lái)標(biāo)記目標(biāo)代碼塊,方便對(duì)目標(biāo)區(qū)域代碼進(jìn)行修改众辨。 -
<span></span>
行內(nèi)級(jí)標(biāo)簽端三,用來(lái)標(biāo)記目標(biāo)代碼塊,方便對(duì)目標(biāo)區(qū)域代碼進(jìn)行修改鹃彻。 -
<ul></ul><ol></ol><li></li>
列表標(biāo)簽郊闯,ul代表無(wú)序列表,ol代表有序列表蛛株。li標(biāo)簽即為對(duì)應(yīng)列表中的項(xiàng)目 -
<strong><em>
強(qiáng)調(diào)標(biāo)簽团赁,strong表示很重要,em表示較重要 -
<a></a>
錨標(biāo)簽谨履,用來(lái)指向外部鏈接或者內(nèi)部鏈接欢摄,其中herf屬性代表所指向的url,target屬性可以控制herf中的鏈接以什么方式打開(kāi) -
<img>
圖片鏈接,src屬性用來(lái)存放圖片的鏈接笋粟,title屬性用于在圖片出錯(cuò)的情況下用文字描述該圖片 -
<iframe>
標(biāo)簽怀挠,用于嵌入頁(yè)面析蝴。src屬性表示你想要嵌入頁(yè)面的url,name屬性可以用來(lái)控制嵌入的頁(yè)面
<table><theader><tbody><tfoot><tr><th>
標(biāo)簽為表格標(biāo)簽绿淋,theader表示表頭闷畸,tfoot表示表尾,在tbody里面有多少個(gè)tr就表示有多少行吞滞,每個(gè)tr里面有多少個(gè)th標(biāo)簽就表示每一行有多少列.但一般不用thead,tbody,tfoot這些鬼東西 但是使用css操作table里面的標(biāo)簽的時(shí)候用類(lèi)似tabel>tr這樣的語(yǔ)法不管用佑菩,因?yàn)樵趆tml結(jié)構(gòu)里,tr和rd默認(rèn)都是在tbody里面的所以要用table>tbody>tr才管用.
-
<dl><dt><dd>
用于展示一系列 “標(biāo)題:內(nèi)容...”的場(chǎng)景 dt表示標(biāo)題裁赠,dd表示內(nèi)容