HTML相關(guān)知識(shí)

1. HTML证薇、XML度苔、XHTML 有什么區(qū)別?

  • HTML匆篓,超文本標(biāo)記語(yǔ)言,是語(yǔ)法較為松散的寇窑、不嚴(yán)格的Web語(yǔ)言鸦概;
  • XML,可擴(kuò)展標(biāo)記語(yǔ)言甩骏,主要用于存儲(chǔ)數(shù)據(jù)和結(jié)構(gòu)參考窗市;
  • XHTML,可擴(kuò)展超文本標(biāo)記語(yǔ)言饮笛,基于XML咨察,作用與HTML類似,但語(yǔ)法更嚴(yán)格參考福青。
  • 其中XHTML 與 HTML 之間的差異
    • 最主要的不同:
    1. XHTML 元素必須被正確地嵌套摄狱。
    2. XHTML 元素必須被關(guān)閉。
    3. 標(biāo)簽名必須用小寫字母无午。
    4. XHTML 文檔必須擁有根元素媒役。
  • 參考 XHTML 與 HTML 之間的差

2.怎樣理解 HTML 語(yǔ)義化?

語(yǔ)義化HTML是一種編寫HTML的方式,選擇合適的標(biāo)簽
使用合理的代碼結(jié)構(gòu),便于開發(fā)者閱讀宪迟,同時(shí)讓瀏覽器的爬蟲和機(jī)器很好地解析酣衷。

3. 怎樣理解內(nèi)容與樣式分離的原則?

寫 HTML 的時(shí)候先不管樣式, 重點(diǎn)放在HTML的結(jié)構(gòu)和語(yǔ)義化上,讓 HTML 能體現(xiàn)頁(yè)面結(jié)構(gòu)或者內(nèi)容,之后再去寫樣式次泽。
寫 JS 的時(shí)候穿仪,盡量不要用 JS 去直接操作樣式,而是通過給元素添加刪除class來控制樣式變化
HTML 內(nèi)不允許出現(xiàn)屬性樣式意荤,盡量不要出現(xiàn)行內(nèi)樣式

  • 為什么要語(yǔ)義化啊片?
  • 有利于SEO(SEO是由英文Search Engine Optimization縮寫而來, 中文意譯為“搜索引擎優(yōu)化);
  • 有助于爬蟲抓取更多的有效信息袭异,爬蟲是依賴于標(biāo)簽來確定上下文和各個(gè)關(guān)鍵字的權(quán)重;
  • 語(yǔ)義化的HTML在沒有CSS的情況下也能呈現(xiàn)較好的內(nèi)容結(jié)構(gòu)與代碼結(jié)構(gòu),方便其他設(shè)備的解析,便于團(tuán)隊(duì)開發(fā)和維護(hù)

4. 有哪些常見的meta標(biāo)簽?

<meta> 標(biāo)簽永遠(yuǎn)位于 head 元素內(nèi)部

meta常見屬性

來自http://www.runoob.com/

5. 文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?

文檔聲明作用
總是給您的 HTML 文檔添加 <!DOCTYPE> 聲明钠龙,確保瀏覽器能夠預(yù)先知道文檔類型。

嚴(yán)格模式和混雜模式指什么

  • JavaScript 嚴(yán)格模式(strict mode)即在嚴(yán)格的條件下運(yùn)行。
    使用 "use strict" 指令
    "use strict" 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增碴里。
    它不是一條語(yǔ)句沈矿,但是是一個(gè)字面量表達(dá)式,在 JavaScript 舊版本中會(huì)被忽略咬腋。
    "use strict" 的目的是指定代碼在嚴(yán)格條件下執(zhí)行羹膳。
    嚴(yán)格模式下你不能使用未聲明的變量。
    嚴(yán)格模式聲明
    嚴(yán)格模式通過在腳本或函數(shù)的頭部添加 "use strict"; 表達(dá)式來聲明根竿。
  • 為什么使用嚴(yán)格模式:
    消除Javascript語(yǔ)法的一些不合理陵像、不嚴(yán)謹(jǐn)之處,減少一些怪異行為;
    消除代碼運(yùn)行的一些不安全之處寇壳,保證代碼運(yùn)行的安全醒颖;

提高編譯器效率,增加運(yùn)行速度壳炎;
為未來新版本的Javascript做好鋪墊泞歉。
例子:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
</head>
<body>
<p>在函數(shù)內(nèi)使用 "use strict" 只在函數(shù)內(nèi)報(bào)錯(cuò)。
</p>
<p>瀏覽器按下 F12 開啟調(diào)試模式匿辩,查看報(bào)錯(cuò)信息腰耙。</p>
<script>
x = 3.14;       // 不報(bào)錯(cuò) 
myFunction();
function myFunction() {
   "use strict";
    y = 3.14;   // 報(bào)錯(cuò) (y 未定義)
}

混雜模式:在混雜模式中,頁(yè)面以一種比較寬松的向后兼容的方式顯示铲球⊥ε樱混雜模式通常模擬老式瀏覽器的行為以防止老站點(diǎn)無(wú)法工作
-->嚴(yán)格模式參考鏈接

<!doctype html> 的作用
<!DOCTYPE> 聲明位于文檔中的最前面的位置,處于 <html> 標(biāo)簽之前稼病。
<!DOCTYPE> 聲明不是一個(gè) HTML 標(biāo)簽选侨;它是用來告知 Web 瀏覽器頁(yè)面使用了哪種 HTML 版本。

6. 瀏覽器亂碼的原因是什么溯饵?如何解決?

原因:

  1. 亂碼產(chǎn)生的根本原因是你保存的編碼格式和瀏覽器解析時(shí)的解碼格式不匹配導(dǎo)致的侵俗。
  2. 亂碼一般是英文以外的字符才會(huì)出現(xiàn)。
    為啥純粹的英文不會(huì)出現(xiàn)亂碼問題丰刊,即使編碼方式和解碼方式不一致隘谣?那是因?yàn)榍懊嬷v過了 utf-8、gbk對(duì)英文都是采用1個(gè)字節(jié)的編碼方式啄巧,并且使用了相同的碼字寻歧。

解決:
1.在文件保存的時(shí)候你自己要清楚是用哪種編碼方式保存的。如果你的文件是保存為utf-8格式秩仆,那么一定要在html 的 <head>里添加<meta charset="utf-8">码泛,這句話的意思是告訴瀏覽器在打開這個(gè)頁(yè)面的時(shí)候不要去猜了,直接用utf-8去解碼澄耍。
2.同理噪珊,如果你的文件保存為gbk格式晌缘,一定在文件里添加<meta charset="gbk">
以上參考鏈接

7. 常見的瀏覽器有哪些痢站,什么內(nèi)核?

世界上主流的瀏覽器有五種磷箕,Google Chrome、Safari阵难、Firefox, IE岳枷、Opera、

內(nèi)核作用
瀏覽器最重要或者說核心的部分是“Rendering Engine”呜叫,可大概譯為“渲染引擎”空繁,不過我們一般習(xí)慣將之稱為“瀏覽器內(nèi)核”。負(fù)責(zé)對(duì)網(wǎng)頁(yè)語(yǔ)法的解釋(如標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用HTML朱庆、JavaScript)并渲染(顯示)網(wǎng)頁(yè)盛泡。 所以,通常所謂的瀏覽器內(nèi)核也就是瀏覽器所采用的渲染引擎椎工,渲染引擎決定了瀏覽器如何顯示網(wǎng)頁(yè)的內(nèi)容以及頁(yè)面的格式信息饭于。不同的瀏覽器內(nèi)核對(duì)網(wǎng)頁(yè)編寫語(yǔ)法的解釋也有不同蜀踏,因此同一網(wǎng)頁(yè)在不同的內(nèi)核的瀏覽器里的渲染(顯示)效果也可能不同维蒙,這也是網(wǎng)頁(yè)編寫者需要在不同內(nèi)核的瀏覽器中測(cè)試網(wǎng)頁(yè)顯示效果的原因。

內(nèi)核分類:
Trident:
IE內(nèi)核

>Gecko:
Gecko(Firefox內(nèi)核):Mozilla FireFox(火狐瀏覽器) 采用了該內(nèi)核果覆。

>Webkit:
Webkit(Safari內(nèi)核,Chrome內(nèi)核原型,開源):它是蘋果公司自己的內(nèi)核颅痊,也是蘋果的Safari瀏覽器使用的內(nèi)核。 Webkit引擎包含WebCore排版引擎及JavaScriptCore解析引擎局待。WebKit內(nèi)核常見的瀏覽器:傲游瀏覽器3斑响、Apple Safari (Win/Mac/iPhone/iPad)、Android 默認(rèn)瀏覽器钳榨。在腳本理解方面舰罚,Chrome使用自己研發(fā)的V8引擎。

>Blink:
Blink是一個(gè)由Google和Opera Software開發(fā)的瀏覽器排版引擎薛耻,Opera表示將會(huì)跟隨谷歌采用其Blink瀏覽器核心营罢,同時(shí)參與了Blink的開發(fā).

>JavaScript引擎
JavaScript引擎是一個(gè)專門處理JavaScript腳本的虛擬機(jī),一般會(huì)附帶在網(wǎng)頁(yè)瀏覽器之中饼齿。
>Mozilla:
SpiderMonkey饲漾,第一款JavaScript引擎。

>Google:
V8引擎缕溉,是Chrome瀏覽器的一部分考传。

>微軟:
Chakra (JScript引擎),中文譯名為查克拉证鸥,用于Internet Explorer 9的32位版本僚楞。

>Opera:
Carakan勤晚,由Opera軟件公司編寫,自O(shè)pera10.50版本開始使用泉褐。

8. 列出常見的標(biāo)簽运翼,并簡(jiǎn)單介紹這些標(biāo)簽用在什么場(chǎng)景?

HTML文本修飾標(biāo)記

<b></b>:加粗bold。如:<b>HTML文件</b>
<i></i>:斜體italic兴枯。如:<i>HTML文本</i>
<u></u>:下劃線underline血淌。如:<u>HTML文本</u>
<s></s>:刪除線strike。如:<s>刪除線</s>
<sup></sup>上標(biāo)财剖。
<sub></sub>下標(biāo)悠夯。

<font></font>字體標(biāo)記
屬性:Size:文本大小,取值1-7躺坟。1小沦补,7大。
     Color:顏色值咪橙。
     Face:字體夕膀,楷體、黑體美侦、宋體...

HTML排版標(biāo)記

1.<p></p>表示一個(gè)段落产舞。
常用屬性:align:水平對(duì)齊方式,取值:left(左)菠剩、 center(居中)易猫、 right(右)
舉例:<p align="center">水平對(duì)齊方式居中對(duì)齊</p>
2.換行標(biāo)記<br>
3.水平線標(biāo)記(單邊標(biāo)記):<hr>
size:水平線的粗細(xì),單位一般為px具壮。
color:水平線的顏色准颓。
width:水平線的寬度。
noshade:去掉水平線的陰影(在HTML中棺妓,noshade是沒有值的屬性)攘已。如:<hr noshade>
4.<pre>預(yù)排版標(biāo)記
功能:將保留所有的空白字符(空格、換行符)怜跑,換句話說:就是原封不動(dòng)輸出样勃。
語(yǔ)法:<pre>內(nèi)容</pre>
5.標(biāo)題標(biāo)記:<h1>……<h6>
功能:定義各種標(biāo)題。
屬性:align水平對(duì)齊方式妆艘,取值:left彤灶、center、right批旺。
語(yǔ)法:<h1  align = “l(fā)eft | center | right”></h1>

<div>和<span>標(biāo)記

<span>是沒有任何意義的標(biāo)記名挥,但是,又是使用最多的標(biāo)記。<span>要與CSS配合使用票编。<span>是行內(nèi)元素踪古。

>(1)塊元素
塊元素须揣,一般是單獨(dú)占一行葛虐,不管內(nèi)容多少,總是占一行译株。
塊元素有哪些瓜喇?<div>、<p>歉糜、<h1>乘寒、<h2>、<pre>等
>(2)行內(nèi)元素
行內(nèi)元素匪补,不會(huì)單獨(dú)占一行伞辛。
行內(nèi)元素的寬度,主要是根據(jù)內(nèi)容決定夯缺。
多個(gè)行內(nèi)元素蚤氏,會(huì)排在同一行。
行內(nèi)元素有哪些喳逛?<span> <font>瞧捌、<b>、<i>润文、<u>、<sub>殿怜、<sup>等
結(jié)論:在標(biāo)記嵌套時(shí)典蝌,一般是塊元素中嵌套行內(nèi)元素。

:版權(quán)歸個(gè)人所有,轉(zhuǎn)載注明出處

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末头谜,一起剝皮案震驚了整個(gè)濱河市骏掀,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌柱告,老刑警劉巖截驮,帶你破解...
    沈念sama閱讀 222,627評(píng)論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異际度,居然都是意外死亡葵袭,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,180評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門乖菱,熙熙樓的掌柜王于貴愁眉苦臉地迎上來坡锡,“玉大人蓬网,你說我怎么就攤上這事○睦眨” “怎么了帆锋?”我有些...
    開封第一講書人閱讀 169,346評(píng)論 0 362
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)禽额。 經(jīng)常有香客問我锯厢,道長(zhǎng),這世上最難降的妖魔是什么脯倒? 我笑而不...
    開封第一講書人閱讀 60,097評(píng)論 1 300
  • 正文 為了忘掉前任哲鸳,我火速辦了婚禮,結(jié)果婚禮上盔憨,老公的妹妹穿的比我還像新娘徙菠。我一直安慰自己,他們只是感情好郁岩,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,100評(píng)論 6 398
  • 文/花漫 我一把揭開白布婿奔。 她就那樣靜靜地躺著,像睡著了一般问慎。 火紅的嫁衣襯著肌膚如雪萍摊。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,696評(píng)論 1 312
  • 那天如叼,我揣著相機(jī)與錄音冰木,去河邊找鬼。 笑死笼恰,一個(gè)胖子當(dāng)著我的面吹牛踊沸,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播社证,決...
    沈念sama閱讀 41,165評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼逼龟,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了追葡?” 一聲冷哼從身側(cè)響起腺律,我...
    開封第一講書人閱讀 40,108評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎宜肉,沒想到半個(gè)月后匀钧,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,646評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡谬返,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,709評(píng)論 3 342
  • 正文 我和宋清朗相戀三年之斯,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片朱浴。...
    茶點(diǎn)故事閱讀 40,861評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡吊圾,死狀恐怖达椰,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情项乒,我是刑警寧澤啰劲,帶...
    沈念sama閱讀 36,527評(píng)論 5 351
  • 正文 年R本政府宣布,位于F島的核電站檀何,受9級(jí)特大地震影響蝇裤,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜频鉴,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,196評(píng)論 3 336
  • 文/蒙蒙 一栓辜、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧垛孔,春花似錦藕甩、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,698評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至概作,卻和暖如春腋妙,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背讯榕。 一陣腳步聲響...
    開封第一講書人閱讀 33,804評(píng)論 1 274
  • 我被黑心中介騙來泰國(guó)打工骤素, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人愚屁。 一個(gè)月前我還...
    沈念sama閱讀 49,287評(píng)論 3 379
  • 正文 我出身青樓济竹,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親集绰。 傳聞我的和親對(duì)象是個(gè)殘疾皇子规辱,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,860評(píng)論 2 361

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

  • HTML、XML栽燕、XHTML的區(qū)別 HTML是一種超文本標(biāo)記語(yǔ)言,語(yǔ)法較為松散改淑,不規(guī)范碍岔。 XML是一種可擴(kuò)展標(biāo)記語(yǔ)...
    饑人谷_Leon閱讀 355評(píng)論 0 1
  • 1. HTML, XML, XHTML 有什么區(qū)別? HTML (HyperText Markup Langua...
    饑人谷_邵征鵬閱讀 344評(píng)論 0 0
  • 1朵夏、HTML蔼啦、XML、XHTML 有什么區(qū)別 HTML(HyperText Markup Language):超文...
    tangmengyun閱讀 224評(píng)論 0 1
  • HTML仰猖、XML捏肢、XHTML 有什么區(qū)別 HTML是一種超文本標(biāo)記語(yǔ)言奈籽,語(yǔ)法松散,不嚴(yán)格的web語(yǔ)言鸵赫。 XML是可...
    機(jī)智的大口袋閱讀 256評(píng)論 0 1
  • “耿辛衣屏,這邊”绨簦”我一進(jìn)時(shí)代火鍋店狼忱,就看到劉叔笑著招呼我。我深呼吸了兩次一睁,慢慢走了過去钻弄。 劉叔選的是角落里的一張桌子...
    默陌朋閱讀 492評(píng)論 0 1