摘要:標(biāo)準(zhǔn)模式的排版和運作模式都是以該瀏覽器支持的最高標(biāo)準(zhǔn)運行。搜索引擎的爬蟲也依賴于標(biāo)記來確定上下文和各個關(guān)鍵字的權(quán)重,有利于使閱讀源代碼的人更容易將網(wǎng)站分塊,便于閱讀,維護和理解。
HTML基礎(chǔ)知識 meta標(biāo)簽
doctype作用,嚴(yán)格模式和混雜模式如何區(qū)分,它們有何意義?
doctype聲明位于HTML文檔的第一行,位于html標(biāo)簽之前,用于告知瀏覽器解析器用什么文檔標(biāo)準(zhǔn)解析這個文檔,doctype不存在或者格式不正確會導(dǎo)致文檔以兼容模式呈現(xiàn)
在兼容模式中,頁面以寬松的向后兼容的方式顯示,模擬老式瀏覽器的行為以防止站點無法工作。標(biāo)準(zhǔn)模式的排版和JS運作模式都是以該瀏覽器支持的最高標(biāo)準(zhǔn)運行。
如果HTML文檔包含形式完整的doctype,那么他一般是以標(biāo)準(zhǔn)模式呈現(xiàn),對于HTML4.01文檔,包含嚴(yán)格的DTD的doctype常常導(dǎo)致頁面以標(biāo)準(zhǔn)模式呈現(xiàn),doctype不存在或者格式不對會導(dǎo)致文檔以混雜模式出現(xiàn)。
請描述一個網(wǎng)頁從開始請求到最終顯示的完整過程?1.在瀏覽器輸入網(wǎng)址
2.發(fā)送至DNS服務(wù)器并獲得域名對應(yīng)的WEB服務(wù)器IP地址
3.與WEB服務(wù)器建立TCP連接
4.瀏覽器向WEB服務(wù)器的IP地址發(fā)送相應(yīng)的HTTP請求
5.WEB服務(wù)器響應(yīng)請求并返回指定的url的數(shù)據(jù)或錯誤信息。如果重定向,則重定向到新的url地址
6.瀏覽器下載數(shù)據(jù)后解析HTML源文件,解析的過程中實現(xiàn)對頁面的排版,解析完成后在瀏覽器顯示基礎(chǔ)頁面
7.分析頁面中的超鏈接并顯示在當(dāng)前頁面,重復(fù)以上過程直至無超鏈接需要發(fā)送,完成全部數(shù)據(jù)顯示。
html5不基于SGML,因此不需要對DTD進行引用
html4.01基于SGML,因此需要對DTD進行引用
瀏覽器最重要或者說核心部分:渲染引擎,不過我們一般稱之為瀏覽器內(nèi)核。負(fù)責(zé)對網(wǎng)頁語法的解釋(標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用html,javascript)并渲染顯示的網(wǎng)頁。渲染引擎決定了瀏覽器如何顯示網(wǎng)頁內(nèi)容以及頁面的格式信息,不同的瀏覽器內(nèi)核對網(wǎng)頁編寫語法的解釋也有不同,因此同一網(wǎng)頁在不同瀏覽器內(nèi)核的瀏覽器里渲染顯示的效果也不同。
渲染引擎負(fù)責(zé)獲取網(wǎng)頁的內(nèi)容,整理訊息,以及計算網(wǎng)頁的顯示方式
Trident內(nèi)核(MSHTML):IE,360,搜狗
Gecko內(nèi)核:FireFox
Presto內(nèi)核:Opera7以上
(Opera內(nèi)核原為Presto 現(xiàn)為Blink)
webkit內(nèi)核:Safari,Chrome
(Chrome的Blink使webkit的分支)
EdgeHTML內(nèi)核:Microsoft Edge
(此內(nèi)核其實是從MSHTMLfork來的,刪除了幾乎所有IE私有特性)
1.html語義化讓頁面的內(nèi)容結(jié)構(gòu)化,結(jié)構(gòu)更清晰,便于對瀏覽器,搜索引擎解析
2.即便在沒有css樣式的情況下也能以一種文檔格式顯示,并且是容易閱讀的。
3.搜索引擎的爬蟲也依賴于HTML標(biāo)記來確定上下文和各個關(guān)鍵字的權(quán)重,有利于SEO
4.使閱讀源代碼的人更容易將網(wǎng)站分塊,便于閱讀,維護和理解。
行級元素: a, em(強調(diào)),strong(粗體強調(diào)),span,i(斜體),img,b(粗體),lable(表格標(biāo)簽), select(項目選擇),textarea(多行文本輸入框)sub(下標(biāo)) 不能設(shè)置寬高寬高是內(nèi)容的高度,可以設(shè)置padding,只能設(shè)置左右的外邊距,不能設(shè)置上下外邊距 塊元素: 不設(shè)置高,靠內(nèi)容充起來,寬度不設(shè)置的情況下是充滿父級元素的 可以設(shè)置寬高,外邊距,內(nèi)邊距 div dl定義列表 dt dd ul 非排序列表 ol,p,h1-h6,table,fieldset form, 空元素:br hr 行內(nèi)塊級元素 input和imga標(biāo)簽
href里不僅可以是一個遠(yuǎn)程地址,還可以是一個本地文件
百度一下link和@impoort的區(qū)別
1.link屬于XHTML標(biāo)簽,而@import是CSS提供的
2.頁面被加載時,link會同時被加載,而@import引用的css會等到頁面被加載完了再加載
3.import只在ie5以上才能被識別,而link是XHTML標(biāo)簽,無兼容性問題
4.link方式的樣式權(quán)重高于@import的權(quán)重
5.使用dom控制樣式時的差別,當(dāng)使用js控制dom去改變樣式的時候,只能使用link標(biāo)簽。
ol,ul,li樣式重置:list-style:none a樣式重置:text-direction :none ul,ol有上下16px的外邊距,左面40px內(nèi)邊距img標(biāo)簽
table標(biāo)簽背景圖片大于要顯示的大小的時候
11 | |
21 | 22 |
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/53755.html
摘要:現(xiàn)在回到我們這一章節(jié)的標(biāo)題,將它做下補充關(guān)于那些事四之基于構(gòu)架基礎(chǔ)樣式庫基礎(chǔ)庫構(gòu)思為什么要做基礎(chǔ)庫我上一章節(jié)的末尾拋出了幾個問題假設(shè)你要做一個游戲單頁面,網(wǎng)頁上并不存在表單內(nèi)容,那么你就要移除一些冗余的代碼,開始自定義樣式來滿足自己的需求。 前言 先來回顧一下前幾章節(jié),我們都說了哪些內(nèi)容: CSS Reset 歷史 與 Normalize.css 介紹 Normalize.css...
摘要:現(xiàn)在回到我們這一章節(jié)的標(biāo)題,將它做下補充關(guān)于那些事四之基于構(gòu)架基礎(chǔ)樣式庫基礎(chǔ)庫構(gòu)思為什么要做基礎(chǔ)庫我上一章節(jié)的末尾拋出了幾個問題假設(shè)你要做一個游戲單頁面,網(wǎng)頁上并不存在表單內(nèi)容,那么你就要移除一些冗余的代碼,開始自定義樣式來滿足自己的需求。 前言 先來回顧一下前幾章節(jié),我們都說了哪些內(nèi)容: CSS Reset 歷史 與 Normalize.css 介紹 Normalize.css...
摘要:關(guān)于背景圖片的那些小技巧背景圖片太大沒辦法居中顯示怎么辦想完整顯示圖片如何按比例縮放想要在頁面上顯示兩個空格,應(yīng)該怎么寫代碼在代碼里寫才行。 CSS簡介 想要制作出好看又高大上的網(wǎng)頁,除了編寫好HTML文件外,CSS的編寫也必不可少。CSS的英文全稱是Cascading Style Sheets,即層疊樣式表。CSS不僅可以靜態(tài)地修飾網(wǎng)頁,還可以配合各種腳本語言動態(tài)地對網(wǎng)頁各元素進行格...
摘要:用和獲取相關(guān)屬性網(wǎng)頁可見區(qū)域?qū)捑W(wǎng)頁可見區(qū)域高網(wǎng)頁可見區(qū)域?qū)挵ㄟ吙虻膶捑W(wǎng)頁可見區(qū)域高包括邊框的高網(wǎng)頁正文全文寬網(wǎng)頁正文全文高網(wǎng)頁下滑的距離網(wǎng)頁左滑的距離屏幕分辨率的高屏幕分辨率的寬屏幕可用工作區(qū)的高屏幕可用工作區(qū)的高瀏覽器可視區(qū)域的內(nèi)寬度, 用JS和JQ獲取相關(guān)屬性 JavaScript document.body.clientWidth;//網(wǎng)頁可見區(qū)域?qū)抎ocument.body....
閱讀 3437·2021-11-22 09:34
閱讀 2992·2021-10-09 09:43
閱讀 1526·2021-09-24 09:47
閱讀 2262·2019-08-30 12:53
閱讀 1065·2019-08-29 14:00
閱讀 3497·2019-08-29 13:17
閱讀 2339·2019-08-28 18:00
閱讀 1353·2019-08-26 12:00