html+css面試題

1. 你知道的網(wǎng)頁制作會用到的圖片格式有哪些？

png-8,png-24, jpeg，gif, svg ,dataimage/png;base64。

科普一下Webp: Webp格式，谷歌(google)開發(fā)的一種旨在加快圖片加載速度的圖片格式。圖片壓縮體積大約只有JPEG的2/3，并能節(jié)省大量的服務(wù)器帶寬資源和數(shù)據(jù)空間。Facebook、Ebay等知名網(wǎng)站已經(jīng)并始測試并使用Webp格式。

在質(zhì)量相同的情況下，Webp格式圖像的體積要比JPEG格式圖像小40%

dataimage/ png;base64

data: image/ png; base64, iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJ AQMAAADaX5RTAAAAA3NCSVQICAj b4U/ gAAAAB1BMVEX/ / /+ZmZmOUEqyAAAAAnRSTlMA/ 1uRIrUAAAAJcEhZcwAACusAAAr rAYKLDVoAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDkvM jAvMT IGkKG+AAAAHHRFWHRTb2Z0d2 Fy ZQBBZG9iZSBGaXJld29ya3MgQ1M26Lyyj AAAAB1JREFUCJljONjA8LiBoZyBwY6BQQZMAtlAkYMNAF1fBs/zPvcnAAAAAElFTkSuQmCC

那么這是什么呢，這是Data URI scheme。

Data URI schene是在RFC2397中定義的，目的是將一些小的數(shù)據(jù)，直接嵌入到網(wǎng)頁中，從而不再從外部文件載入。比如上面那串字符，其實是一張小圖片，將這些字符復(fù)制黏貼到火狐的地址欄中并轉(zhuǎn)到，就能眷到它了，一張1X36的白灰png圖片。
在上面的Data URI中,data表示取得數(shù)據(jù)的協(xié)定名稱,image/png是數(shù)據(jù)類型名稱, base64是數(shù)據(jù)的編碼方法,逗號后面就是這個image/png文件base64編碼后的數(shù)據(jù)。

目前, Data URI scheme支持的類型有:

data:,文本數(shù)據(jù)
data:text/plain,文本數(shù)據(jù)
data:text/html,HTML代碼
data:text/html;base64,base64編碼的HTML代碼
data:text/css,CSS代碼data:text/css;base64,base64編碼的CSS代碼data:text/javascript,Javascript代碼
data:text/javascript;base64,base64編碼的Javascript代碼
data:image/gif;base64,base64編碼的gif圖片數(shù)據(jù)
data:image/png;base64,base64編碼的png圖片數(shù)據(jù).
data:image/jpeg;base64,base64編碼的jpeg圖片數(shù)據(jù)
data:image/x-icon;base64,base64編碼的icon圖片數(shù)據(jù)

base64簡單地說,它把一些8-bit數(shù)據(jù)翻譯成標(biāo)準(zhǔn)ASCII字符,網(wǎng)上有很多免費的base64編碼和解碼的工具,在PHP中可以用函數(shù)base64_encode()進行編碼,如echo base64_ encode(ile_ .get_ contents( 'wg.png' ));

目前, IE8、 Firfox、 Chrome、 Opera瀏覽器都支持這種小文件嵌入。

img src= data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJAQMAAADaX5RTAAAAA3NCSVQICAjb4U/gAAAABIBMVEX///+ZmZmOUEqyAAAAAnRSTIMA/1uRIrUAAAAJcEhZcwAACusAAArrAYKLDVoAAAAWdEVYdENyZWF0aW9ulFRpbWUAMDkvMjAvMTIGkKG+AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAAB1JREFUCJIjONjA8LiBoZyBwY6BQQZMAtIAkYMNAF1fBs/zPvcnAAAAAElFTkSuQmCC' />

把圖像文件的內(nèi)容直接寫在了HTML文件中,這樣做的好處是,節(jié)省了一個HTTP請求。壞處是瀏覽器不會緩存這種圖像。

2. SGML（標(biāo)準(zhǔn)通用標(biāo)記語言）和HTML（超文本標(biāo)記語言)

①HTML是SGML的一個實例,它的DTD作為標(biāo)準(zhǔn)被固定下來,因此，HTML不能作為定義其它置標(biāo)語言的元語言。XML是SGML的一個子集,嚴(yán)格地講, XML也還是SGML。與HTML不同的是, XML有DTD ,因而也可以象SGML那樣,作為元語言,來定義其它文件系統(tǒng),或稱其它置標(biāo)語言。如果把置標(biāo)語言分為元置標(biāo)語言和實例置標(biāo)語言的話, SGML和XML都是元置標(biāo)語言,而HTML和由XML派生的XHTML都是實例置標(biāo)語言。

②SGML(standard general markup language )是一種在WEB發(fā)明之前就已存在的使用標(biāo)記來描述文檔資料的通用語言，它是一種定義標(biāo)記語言的元語言,HTML和XML都是由SGML發(fā)展過來的.

HTML(HyperText Markup Language)是SGML定義下的一個描述性的語言,是SGML的一個應(yīng)用，它不能用來定義新的應(yīng)用,HTML,用于一些Internet的短期的數(shù)據(jù).HTMl文檔格式非常松散,導(dǎo)致解析的復(fù)雜性增加，也導(dǎo)致了不同瀏覽器瀏覽的不同.

XML(extend MarkUp Lanuage)是SGML的一個簡化版本,是SGML的一個子集嚴(yán)格意義.上講,XML就是SGML.如果一些數(shù)據(jù)要長期使用，并且要更多的一些結(jié)構(gòu),XML將更好.XML比HTML嚴(yán)格，如果出現(xiàn)語法錯誤,瀏覽器將不發(fā)解析顯示③標(biāo)準(zhǔn)答案:

SGML (標(biāo)準(zhǔn)通用標(biāo)記語言)是一個標(biāo)準(zhǔn), 告訴我們怎么去指定文檔標(biāo)記。他是只描述文檔標(biāo)記應(yīng)該是怎么樣的元語言, HTML是被用SGML描述的標(biāo)記語言。

因此利用SGML創(chuàng)建了HTML參照和必須共同遵守的DTD ,你會經(jīng)常在HTML頁面的頭部發(fā)現(xiàn)“DOCTYPE” 屬性,用來定義用于解析目標(biāo)DTD
現(xiàn)在解析SGML是一件痛苦的事情,所以創(chuàng)建了XML使事情更好。XML使用了SGML,例如:在SGML中你必須使用起始和結(jié)束標(biāo)簽,但是在XML你可以有自動關(guān)閉的結(jié)束標(biāo)簽。XHTML創(chuàng)建于XML ,他被使用在HTML4.0中。你可以參考下面代碼片段中展示的XML DTD

總之，SGML是所有類型的父類,較舊的HTML利用SGML , HTML4.0使用派生自XML的XHTML。

3. CSS（cascading style sheets級聯(lián)樣式表）中的選擇器是什么？

選擇器在你想應(yīng)用一個樣式的時候,幫助你去選擇元素。舉例，下面是簡單的被命名為”instro” 的樣式,他適用于HTML元素顯示紅色背景

<style>
.intro{
  background-color:red;
}
</style>

應(yīng)用上面的”intro” 樣式給div ,我們可以使用”class”選擇器,如下圖所示

<div class=' intro'>
<p>My name is Shivprasad koirala</p>
<p>l write interview questions.s</p>
</div>

4. 如何使用ID值來應(yīng)用一個CSS樣式？

假設(shè),你有一個HTML段落標(biāo)簽,使用id是”mytext”,就和下面的片段中顯示的那樣<p id=" mytext ">This is HTML interview questions.</p>你可以使用”#”選擇器和”id”的名字創(chuàng)建一種樣式 ,并把CSS值應(yīng)用到段落標(biāo)簽中,因此應(yīng)用樣式到"mytext"元素，我們可以使用"#mytext",如下圖所示

<style> 
#mytext
background-color:yellow;
</style>

5. 你能解釋一下CSS的盒子模型么？

CSS和模型是圍繞在HTML元素周圍的定義Border(邊界)，

padding(內(nèi)邊距)和margin(外邊距)的矩形空間
Border(邊界) :定義了元素包含的最大區(qū)域,我們能夠使
邊界可見,不可見,定義高度和寬度等;
Padding(內(nèi)邊距) :定義了邊界和內(nèi)部元素的間距
Margin :定義了邊界和任何相鄰元素的間距

例如以下是簡單的CSS代碼定義了盒子的邊界,內(nèi)邊距和外邊距值

.box {
width: 200px;
border: 10px solid #99c;
padding: 20px; 
margin: 50px;
}

現(xiàn)在如果我們應(yīng)用了以上的CSS到一個如下顯示的DIV標(biāo)簽,你輸出將會和下面圖形中顯示的那樣。我已經(jīng)創(chuàng)建兩個測試"Some text"和"Some other text", 因此我們能看到多少margin(外邊距)的屬性功能

<div align= 'middle' class='box'>
Some text
</div>
Some other text

6. 你能解釋一些CSS3中的文本效果么？

陰影文本效果

.specialtext
text-shadow: 5px 5px 5px #FF0000;

文字包裝效果

<style>
.breakword
{word-wrap:break-word;}
</style>

7. 什么是Web Workers？為什么我們需要他們？

  • 考慮以下會執(zhí)行.上百萬次的繁重的循環(huán)代碼
function SomeHeavyFunction()
for (i= 0; i< 1000000000000; i++)
x=i+ X;

比方說上面的循環(huán)代碼在HTML按鈕點擊以后執(zhí)行,現(xiàn)在這個方法執(zhí)行是同步的,換句話說這個瀏覽器必須等到循環(huán)完成才能操作<input type= 'button' onclick= SomeHeavyFunction();'/>這個會進一步導(dǎo)致瀏覽器凍結(jié)并且沒有相應(yīng),屏幕還會顯示如下的異常信息如果你能移動這些繁重的循環(huán)到Javascript文件中, 采用異步的式運行,這意味著瀏覽器不需要等到循環(huán)接觸，我們可以有更敏感的瀏覽器,這就是web worker的作用Web worker幫助我們用異步執(zhí)行Javascript文件

8. Web Worker線程的限制是什么？

Web worker線程不能修改HTML元素,全局變量和Window.Location一類的窗口屬性。你可以自由使用Javascript數(shù)據(jù)類型,XMLHttpRequest調(diào)用等。

9. 為什么要初始化CSS樣式?

因為瀏覽器的兼容問題，不同瀏覽器對有些標(biāo)簽的默認(rèn)值是不同的, 如果沒對css初始化往往會出現(xiàn)瀏覽器之間的頁面顯示差異。當(dāng)然,初始化樣式會對SEO有一定的影響,但魚和熊掌不可兼得,但力求影響最小的情況下初始化。

最簡單的初始化方法就是: # {padding: 0; margin:0;}(不建議)

淘寶的樣式初始化:

body,h1,h2,h3，h4,h5，h6,hr,p,blockquote,dl,dt,dd,ul, ol, form, fieldset, legend,button, input,(
padding:0;
}
h1,h2,h3,h4,h5，h6{
font-size: 100%;
}
address ,cite,dfn,em，,var { 
font-style:normal;
}
code,kbd, pre,samp { 
font- family : cour iernew,
courier，
monospace;
}
small{
font-size: 12px;
}
ul,ol {
list-style:none;
}
a{ 
text-decor ation:none ;
}
a : hover
{ 
text-decoration:underline;
}
sup{ 
vertical-align: text-top;
}
sub{
ver tical-align: text-bottom;
}
legend
{ color : #000;
fieldset,img {
border :0;
}
button,input，select, textarea { 
font-size: 100%
}
table{
border-collapse:collapse;
border-spacing:0;
}

10. css定義的權(quán)重

以下是權(quán)重的規(guī)則:標(biāo)簽的權(quán)重為1,class的權(quán)重為10 , id的權(quán)重為100 ,以下例子是演示各種定義的權(quán)重值:

div{},
class1{},
#id1{},
#id1 div{},
. class1 div{},
class1 .class2 div{}

11. 列出display的值、position的值，并說明他們的作用。

1.display的值及作用

  • block:象塊類型元素一樣顯示。
  • none:缺省值。象行內(nèi)元素類型一樣顯示。
  • inline-block:象行內(nèi)元素一樣顯示,但其內(nèi)容象塊類型元素一樣顯示。
  • list-item:象塊類型元素一樣顯示，并添加樣式列表標(biāo)記。

2.position的值及作用

  • absolute:生成絕對定位的元素，相對于static 定位以外的第一個父元素進行定位。
  • fixed:(老IE不支持) 生成絕對定位的元素,相對于瀏覽器窗口進行定位。
  • relative:生成相對定位的元素,相對于其正常位置進行定位。
  • static :默認(rèn)值。沒有定位,元素出現(xiàn)在正常的流中
  • (忽略top，bottom， left， right z- index聲明)。
  • inherit:規(guī)定從父元素繼承position 屬性的值。

12. CSS3新增偽類舉例：

p:first-of-type選擇屬于其父元素的首個<p> 元素的每個<p>元素。
p:last-of-type選擇屬于其父元素的最后<p> 元素的每個<p>元素。
p:only-of-type選擇屬于其父元素唯一 的<p> 元素的每個<p>元素。
p:only-child選擇屬于其父元素的唯一子元素的每個<p>元素。
p:nth-child(2)選擇屬 于其父元素的第二個子元素的每個<p>元素。
: enabled :disabled控制表單控件的禁用狀態(tài)。
: checked 單選框或復(fù)選框被選中。

13. 如何居中div？如何居中一個浮動元素？

給div設(shè)置一個寬度,然后添加margin:0 auto屬性

div{
width: 200px;
margin:0 auto;
}

居中一個浮動元素,確定容器的寬高寬500高300的層設(shè)置層的外邊距

.div
Width:500px ;
height :300px; //高度可以不設(shè)
margin:- 150px 0 0 -250px;
position:relative;相對定位
background-color :pink;//方便看效果
left: 50%;
top:50%;
}

14. 瀏覽器的內(nèi)核分別是什么?

IE瀏覽器的內(nèi)核Trident、Mozilla的Gecko、 Chrome的Blink( WebKit的分支)、Opera內(nèi)核原為Presto，現(xiàn)為Blink ;

15. GET和POST的區(qū)別，何時使用POST？

GET :一般用于信息獲取,使用URL傳遞參數(shù)，對所發(fā)送信息的數(shù)量也有限制，一般在2000個字符;
POST :一般用于修改服務(wù)器上的資源,對所發(fā)送的信息沒有限制。
GET方式需要使用Request. QueryStrinIg來取得變量的值， 而POST方式通過Request.Form來獲取變量的值，也就是說Get是通過地址欄來傳值,而Pos t是通過提交表單來傳值然而，在以下情況中,請使用POST請求:

  • 無法使用緩存文件(更新服務(wù)器上的文件或數(shù)據(jù)庫)
  • 向服務(wù)器發(fā)送大量數(shù)據(jù)( POST沒有數(shù)據(jù)量限制)
  • 發(fā)送包含未知字符的用戶輸入時，POST比GET更穩(wěn)定也更可靠

16. 漸進增強和優(yōu)雅降級

漸進增強:針對低版本瀏覽器進行構(gòu)建頁面,保證最基本的功能,然后再針對高級瀏覽器進行效果、交互等改進和追加功能達到更好的用戶體驗。
優(yōu)雅降級:一開始就構(gòu)建完整的功能，然后再針對低版本瀏覽器進行兼容。

17. HTTP和HTTPS

HTTP協(xié)議通常承載于TCP協(xié)議之上,在HTTP和TCP之間添加一個安全協(xié)議層( ssr或rsL) , 這個時候,就成了我們常說的HTTPS。
默認(rèn)HTTP的端口號為80 , HTTPs的端口號為443。

18. 為什么HTTPS安全?

因為網(wǎng)絡(luò)請求需要中間有很多的服務(wù)器路由器的轉(zhuǎn)發(fā)。中間的節(jié)點都可能篡改信息,而如果使用HTTPS ,密鑰在你和終點站才有。https之 所以比http安全,是因為他利用ssl/t1s協(xié)議傳輸。它包含證書,卸載,流量轉(zhuǎn)發(fā),負載均衡,頁面適配,瀏覽器適配, refer傳遞等。保障了傳輸過程的安全性

19. 簡述一下你對 HTML 語義化的理解？

  • 用正確的標(biāo)簽做正確的事情。
  • html 語義化讓頁面的內(nèi)容結(jié)構(gòu)化，結(jié)構(gòu)更清晰，便于對瀏覽器、搜索引擎解析；即使在沒有樣式 CSS 情況下也以一種文檔格式顯示，并且是容易閱讀的;
  • 搜索引擎的爬蟲也依賴于HTML 標(biāo)記來確定上下文和各個關(guān)鍵字的權(quán)重，利于 SEO;
  • 使閱讀源代碼的人對網(wǎng)站更容易將網(wǎng)站分塊，便于閱讀維護理解。

20. Label 的作用是什么？是怎么用的?

label 標(biāo)簽來定義表單控制間的關(guān)系,當(dāng)用戶選擇該標(biāo)簽時，瀏覽器會自動將焦點轉(zhuǎn)到和標(biāo)簽相關(guān)的表單控件上。
Label有兩種用法:一種是id綁定,一種是嵌套

< label for='Name ' >Number: </label>
< input type="text"name='Name' id='Name'/ >
< label >Date: <input type='text' name='B'/ ></label>

21.iframe 框架有那些優(yōu)缺點？

優(yōu)點

  • iframe 能夠原封不動的把嵌入的網(wǎng)頁展現(xiàn)出來。
  • 如果有多個網(wǎng)頁引用iframe，那么你只需要修改 iframe的內(nèi)容，就可以實現(xiàn)調(diào)用的每一個頁面內(nèi)容的更改，方便快捷。
  • 網(wǎng)頁如果為了統(tǒng)一風(fēng)格，頭部和版本都是一樣的，就可以寫成一個頁面，用 iframe來嵌套，可以增加代碼的可重用。
  • 如果遇到加載緩慢的第三方內(nèi)容如圖標(biāo)和廣告，這些問題可以由 iframe來解決。

缺點

  • 框架結(jié)構(gòu)中出現(xiàn)各種滾動條
  • iframe 會阻塞主頁面的 Onload事件
  • 搜索引擎的檢索程序無法解讀這種頁面，不利于 SEO
  • iframe和主頁面 共享連接池，而瀏覽器對相同域的連接有限制，所以會影響頁面的并行加載。

22. HTML 與 XHTML 二者有什么區(qū)別

應(yīng)該使用 XHTML ，因為 XHTML是 XML重寫了HTML的規(guī)范，比HTML更加嚴(yán)格，表現(xiàn)如下：
1、XHTML中所有的標(biāo)記都必須有一個相應(yīng)的結(jié)束標(biāo)簽
2、XHTML所有標(biāo)簽的元素和屬性的名字都必須使用小寫；
3、所有的XML標(biāo)記都必須合理嵌套；
4、所有的屬性都必須用引號""括起來；
5、把所有?和&amp; 特殊符號用編碼表示；
6、給所有屬性附一個值；
7、不要在注釋內(nèi)容中使用“--”；
8、圖片必須使用說明文字。

23. HTML5 的 form 如何關(guān)閉自動完成功能？

將不想要自動完成的 form 或 input設(shè)置為 autocomplete=off

24.title 與 h1 的區(qū)別、b 與 strong 的區(qū)別、i 與 em 的區(qū)別

  • title用于網(wǎng)站信息標(biāo)題，突出網(wǎng)站標(biāo)題或關(guān)鍵字，一個網(wǎng)站可以有多個title，seo權(quán)重高于H1；H1概括的是文章主題，一個頁面最好只用一個H1，seo權(quán)重低于title。
    A.從網(wǎng)站角度而言，title則重于網(wǎng)站信息標(biāo)題，突出網(wǎng)站標(biāo)題或關(guān)鍵字用title，一篇文章，一個頁面最好只用一個H1，H1用得太多，會稀釋主題；一個網(wǎng)站可以有多個title，最好一個單頁用一個title以便突出網(wǎng)站頁面主題信息。
    B.從文章角度而言，H1則概括的是文章主題，突出文章主題，用H1，面對的用戶，要突出其視覺效果。
    C.從SEO角度而言，title的權(quán)重高于H1，其適用性要比H1廣。
  • b為了加粗而加粗，strong為了標(biāo)明重點而加粗
    A. b這個標(biāo)簽對應(yīng)bold ,即文本加粗，其目的僅僅是為了加粗顯示文本,是一種樣式/風(fēng)格需求;
    B.strong這個標(biāo)簽意思是加強字符的語氣,表示該文本比較重要,提醒讀者/終端注意。為了達到這個目的,瀏覽器等終端將其加粗顯示;
  • 同上i為了斜體而斜體,em為了標(biāo)明重點而斜體，且對于搜索引擎來說strong和em比b和i要重視的多

25. 請描述下 SEO 中的 TDK？

在 SEO中，所謂的 TDK其實就是title、description、keywords 這三個標(biāo)簽，title 標(biāo)題標(biāo)簽，description 描述標(biāo)簽，keywords關(guān)鍵詞標(biāo)簽

26. Doctype，知道這是干什么的么？

?!DOCTYPE?聲明位于文檔中的最前面的位置，處于 ?html?標(biāo)簽之前。
1.告知瀏覽器文檔使用哪種 HTML 或 XHTML規(guī)范。
2.告訴瀏覽器按照何種規(guī)范解析頁（如果你的頁面沒有 DOCTYPE 的聲明，那么 compatMode默認(rèn)就是 BackCompat,瀏覽器按照自己的方式解析渲染頁面）

  • doctype 是一種標(biāo)準(zhǔn)通用標(biāo)記語言的文檔類型聲明，目的是告訴標(biāo)準(zhǔn)通用標(biāo)記語言解析器要使用什么樣的文檔類型定義（DTD）來解析文檔。
    聲明是用來指示web瀏覽器關(guān)于頁面使用哪個HTML版本進行編寫的指令。 聲明必須是HTML文檔的第一行，位于html標(biāo)簽之前。
  • 瀏覽器本身分為兩種模式，一種是標(biāo)準(zhǔn)模式，一種是怪異模式，瀏覽器通過 doctype來區(qū)分這兩種模式，doctype在 html 中的作用就是觸發(fā)瀏覽器的標(biāo)準(zhǔn)模式，如果 html 中省略了doctype，瀏覽器就會進入到 Quirks 模式的怪異狀態(tài)，在這種模式下，有些樣式會和標(biāo)準(zhǔn)模式存在差異，而 html 標(biāo)準(zhǔn)和 dom 標(biāo)準(zhǔn)值規(guī)定了標(biāo)準(zhǔn)模式下的行為，沒有對怪異模式做出規(guī)定，因此不同瀏覽器在怪異模式下的處理也是不同的，所以一定要在 html 開頭使用 doctype。

27. src 與 href 的區(qū)別

src用于引用資源，替換當(dāng)前元素；
href用于在當(dāng)前文檔和引用資源之間確立聯(lián)系。

28. 嚴(yán)格模式與混雜模式

嚴(yán)格模式：以瀏覽器支持的最高標(biāo)準(zhǔn)運行
混雜模式：頁面以寬松向下兼容的方式顯示，模擬老式瀏覽器的行為

29. 對于 WEB 標(biāo)準(zhǔn)以及 W3C 的理解與認(rèn)識問題

  • web 標(biāo)準(zhǔn)簡單來說可以分為結(jié)構(gòu)、表現(xiàn)和行為。其中結(jié)構(gòu)主要是有HTML 標(biāo)簽組成?；蛟S通俗點說，在頁面 body里面我們寫入的標(biāo)簽都是為了頁面的結(jié)構(gòu)。表現(xiàn)即指css 樣式表，通過 css可以是頁面的結(jié)構(gòu)標(biāo)簽更具美感。行為是指頁面和用戶具有一定的交互，同時頁面結(jié)構(gòu)或者表現(xiàn)發(fā)生變化，主要是有js組成。
  • web 標(biāo)準(zhǔn)一般是將該三部分獨立分開，使其更具有模塊化。但一般產(chǎn)生行為時，就會有結(jié)構(gòu)或者表現(xiàn)的變化，也使這三者的界限并不那么清晰。
  • W3C 對 web 標(biāo)準(zhǔn)提出了規(guī)范化的要求，也就是在實際編程中的一些代碼規(guī)范：包含如下幾點
    1.對于結(jié)構(gòu)要求：（標(biāo)簽規(guī)范可以提高搜索引擎對頁面的抓取效率，對 SEO很有幫助）
    1）標(biāo)簽字母要小寫
    2）標(biāo)簽要閉合
    3）標(biāo)簽不允許隨意嵌套
    2.對于 css和js 來說
    1）盡量使用外鏈 css樣式表和js 腳本。是結(jié)構(gòu)、表現(xiàn)和行為分為三塊，符合規(guī)范。同時提高頁面渲染速度，提高用戶的體驗。
    2）樣式盡量少用行間樣式表，使結(jié)構(gòu)與表現(xiàn)分離，標(biāo)簽的id 和class 等屬性命名要做到見文知義，標(biāo)簽越少，加載越快，用戶體驗提高，代碼維護簡單，便于改版
    3）不需要變動頁面內(nèi)容，便可提供打印版本而不需要復(fù)制內(nèi)容，提高網(wǎng)站易用性。

30. 列舉 IE 與其他瀏覽器不一樣的特性？

a. IE的排版引擎是 Trident（又稱為 MSHTML）
b. Trident內(nèi)核曾經(jīng)幾乎與 W3C 標(biāo)準(zhǔn)脫節(jié)（2005 年）
c. Trident內(nèi)核的大量Bug等安全性問題沒有得到及時解決
d. JS方面，有很多獨立的方法，例如綁定事件的 attachEvent、創(chuàng)建事件的 createEventObject 等
e. CSS 方面，也有自己獨有的處理方式，例如設(shè)置透明，低版本 IE 中使用濾鏡的方式

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 1.web標(biāo)準(zhǔn)： (1)結(jié)構(gòu)標(biāo)準(zhǔn)：其語言主要包括XHTML（實現(xiàn)HTML向XML的過渡。）和XML（用于彌補HTM...
    張果果閱讀 3,883評論 0贊 13
  • 問：對WEB標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識？ 答：標(biāo)簽閉合、標(biāo)簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外鏈css...
    LuckyJin閱讀 3,172評論 0贊 11
  • 1. 瀏覽器頁面有哪三層構(gòu)成，分別是什么，作用是什么? 構(gòu)成：結(jié)構(gòu)層、表示層、行為層分別是：HTML、CSS、Ja...
    程序猿人王小賤閱讀 1,989評論 1贊 11
  • 1.如何理解html語義化 html語義化是指從代碼上展示頁面的結(jié)構(gòu)，而不是從最終視覺上來表現(xiàn)結(jié)構(gòu)。 1.2 表現(xiàn)...
    林不羈吖閱讀 463評論 0贊 0
  • 1. 什么是盒子模型？ 2. 行內(nèi)元素有哪些？塊級元素有哪些？ 空(void)元素有那些？ 3. CSS實現(xiàn)垂直水...
    王帥同學(xué)閱讀 816評論 0贊 0

友情鏈接更多精彩內(nèi)容