HTML知識(shí)點(diǎn)

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ǔ)義化

  1. 為了在沒(méi)有CSS的情況下伸但,頁(yè)面也能呈現(xiàn)出很好地內(nèi)容結(jié)構(gòu)、代碼結(jié)構(gòu):為了裸奔時(shí)好看
  2. 用戶體驗(yàn):例如title留搔、alt用于解釋名詞或解釋圖片信息更胖、label標(biāo)簽的活用
  3. 有利于SEO:和搜索引擎建立良好溝通,有助于爬蟲(chóng)抓取更多的有效信息:爬蟲(chóng)依賴于標(biāo)簽來(lái)確定上下文和各個(gè)關(guān)鍵字的權(quán)重
  4. 方便其他設(shè)備解析(如屏幕閱讀器催式、盲人閱讀器函喉、移動(dòng)設(shè)備)以意義的方式來(lái)渲染網(wǎng)頁(yè)
  5. 便于團(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ī)避亂碼咙冗?

  1. 首先表锻,在文件保存的時(shí)候你自己要清楚是用哪種編碼方式保存的。
  2. 在你的代碼中添加meta標(biāo)簽告訴瀏覽器你使用的編碼方式解碼乞娄。

關(guān)于編碼與亂碼 詳情參見(jiàn)聊一聊編碼與亂碼


常見(jiàn)的瀏覽器及其內(nèi)核

  1. 使用Trident的是internet explorer瞬逊,國(guó)產(chǎn)的絕大部分瀏覽器。Trident是就是IE
  2. 使用Gecko的是Mozilla Firefox仪或,使用 Gecko 內(nèi)核的瀏覽器也有不少确镊,如 Netscape MozillaSuite/SeaMonkey 等
  3. 使用Presto的是opera,這是目前公認(rèn)網(wǎng)頁(yè)瀏覽速度最快的瀏覽器內(nèi)核
  4. 使用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)容
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末殿漠,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子佩捞,更是在濱河造成了極大的恐慌绞幌,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,451評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件失尖,死亡現(xiàn)場(chǎng)離奇詭異啊奄,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)掀潮,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,172評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門(mén)菇夸,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人仪吧,你說(shuō)我怎么就攤上這事庄新。” “怎么了薯鼠?”我有些...
    開(kāi)封第一講書(shū)人閱讀 164,782評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵择诈,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我出皇,道長(zhǎng)羞芍,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,709評(píng)論 1 294
  • 正文 為了忘掉前任郊艘,我火速辦了婚禮荷科,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘纱注。我一直安慰自己畏浆,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,733評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布狞贱。 她就那樣靜靜地躺著刻获,像睡著了一般。 火紅的嫁衣襯著肌膚如雪瞎嬉。 梳的紋絲不亂的頭發(fā)上蝎毡,一...
    開(kāi)封第一講書(shū)人閱讀 51,578評(píng)論 1 305
  • 那天厚柳,我揣著相機(jī)與錄音,去河邊找鬼顶掉。 笑死草娜,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的痒筒。 我是一名探鬼主播,決...
    沈念sama閱讀 40,320評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼茬贵,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼簿透!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起解藻,我...
    開(kāi)封第一講書(shū)人閱讀 39,241評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤老充,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后螟左,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體啡浊,經(jīng)...
    沈念sama閱讀 45,686評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,878評(píng)論 3 336
  • 正文 我和宋清朗相戀三年胶背,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了巷嚣。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,992評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡钳吟,死狀恐怖廷粒,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情红且,我是刑警寧澤坝茎,帶...
    沈念sama閱讀 35,715評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站暇番,受9級(jí)特大地震影響嗤放,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜壁酬,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,336評(píng)論 3 330
  • 文/蒙蒙 一次酌、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧厨喂,春花似錦和措、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,912評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至斜纪,卻和暖如春贫母,著一層夾襖步出監(jiān)牢的瞬間文兑,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,040評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工腺劣, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留绿贞,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,173評(píng)論 3 370
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親噩死。 傳聞我的和親對(duì)象是個(gè)殘疾皇子嚼吞,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,947評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • 一.HTML、XML、XHTML 有什么區(qū)別 什么是 HTML? HTML 指的是超文本標(biāo)記語(yǔ)言 (Hyper T...
    Sunset125閱讀 692評(píng)論 0 1
  • HTML、XML增显、XHTML 有什么區(qū)別 HTML:超文本標(biāo)記語(yǔ)言 (Hyper Text Markup Lang...
    喵不吱閱讀 459評(píng)論 0 1
  • 1.什么是HTML? HTML是用來(lái)描述網(wǎng)頁(yè)的一種語(yǔ)言 HTML指的是超文本標(biāo)記語(yǔ)言(Hyper Text Mar...
    billa_8f6b閱讀 298評(píng)論 0 1
  • 什么是HTML脐帝? HTML指的是超文本標(biāo)記語(yǔ)言 HTML不是一種編程語(yǔ)言同云,而是一種標(biāo)記語(yǔ)言 標(biāo)記語(yǔ)言是一套標(biāo)記標(biāo)簽...
    Echolate閱讀 444評(píng)論 0 1
  • 2016-02-29 仿佛一個(gè)沒(méi)法發(fā)生的故事,卻一早已再我記憶中開(kāi)始堵腹。 對(duì)喜歡的人千言萬(wàn)語(yǔ) 和其他的人只字不提 偶...
    blair_c閱讀 102評(píng)論 0 0