web前端工程師面試題

標籤：style   class   c   ext   color   a   

[HTML && CSS]--來自百度文庫 

1. Doctype? strict 模式與混雜模式-如何觸發這兩種模式，區分它們有何意義? 

Doctype

聲明位於文檔中的最前面的位置，處於標籤之前。此標籤可告知瀏覽器文檔使用哪種 HTML 或XHTML 規範。

該標籤可聲明三種DTD 類型，分別表示嚴格版本、過渡版本以及基於架構的 HTML 文檔。

當瀏覽器廠商開始建立與標準相容的瀏覽器時，他們希望確保向後相容性。為了實現這一點，他們創

建了兩種呈現模式：標準模式和混雜模式（quirks mode）。在標準模式中，瀏覽器根據規範呈現頁面；

在混雜模式中，頁面以一種比較寬鬆的向後相容的方式顯示。混雜模式通常類比老式瀏覽器（比如Microsoft IE 4和

Netscape Navigator 4）的行為以防止老網站無法工作。瀏覽器根據DOCTYPE是否存在以及使用的哪種DTD

來選擇要使用的呈現方法。如果XHTML文檔包含形式完整的DOCTYPE，那麼它一般以標準模式呈現。對於

HTML 4.01文檔，包含嚴格DTD的DOCTYPE常常導致頁面以標準模式呈現。包含過渡DTD和URI的DOCTYPE

也導致頁面以標準模式呈現，但是有過渡DTD而沒有URI會導致頁面以混雜模式呈現。DOCTYPE不存在或形式不正確

會導致HTML和XHTML文檔以混雜模式呈現。

2. 行內元素有哪些？區塊層級元素有哪些？CSS的盒模型？

行內元素有：

a b span I b em img input select strong 

區塊層級元素有：

div ul ol li dl dt dd h1 h2 h3 h4…p 

盒模型：

margin border padding width 

3. CSS引入的方式有哪些? link和@import的區別是

1. 使用LINK標籤

將樣式規則寫在

.css的樣式檔案中，再以<link>標籤引入。

<link rel=stylesheet type="text/css" href="example.css"> 

2. 使用@import引入跟link方法很像，但必須放在<STYLE>...</STYLE> 中

<STYLE TYPE="text/css"> 

<!-- @import url(css/example.css); --> 

</STYLE> 

3. 使用STYLE標籤將樣式規則寫在<STYLE>...</STYLE>標籤之中。

<STYLE TYPE="text/css"> 

<!-- 

body {color: #666;background: #f0f0f0;font-size: 12px;} 

td,p {color:#c00;font-size: 12px;} 

--> 

</STYLE> 

4. 使用STYLE屬性將STYLE屬性直接加在個別的元件標籤裡，<元件(標籤) STYLE="性質(屬性)1: 

設定值1; 性質(屬性)2: 設定值2; ...} 

5. 使用<span></span>標記引入樣式

<span style="font:12px/20px #000000;">cnwebshow.com</span>