1. 有序列表、無序列表、自定義列表如何使用？寫個簡單的例子。三者在語義上有什么區(qū)別？在哪些情況下使用哪種（重要）？ 如何嵌套？
-
有序列表：按照字母或數(shù)字等順序排列的列表項目。 注意有序列表的結(jié)果是帶有前后順序之分的編號,如果插入和刪除一個列表項，編號會自動調(diào)整。有序列表始于
<ol>標(biāo)簽。每個列表項始于<li>標(biāo)簽。
如：
有序列表
<ol>的屬性標(biāo)記：<start>、<type>。<start>是編號開始的數(shù)字，如start=2則編號從2開始，如果從1開始可以省略，或是在<li>標(biāo)簽中設(shè)定value＝"n"改變列表行項目的特定編號，例如<li value="7">。type=用于編號的數(shù)字,字母等的類型，如type=a，則編號用英文字母。使用這些屬性，把它們放在<ol>或<li>的的初始標(biāo)簽中。如：
-
無序列表：“無序”指的是沒用數(shù)字或字母等來標(biāo)記，不是像1,2,3或a,b,c這樣的顯示，而是在各條列前面使用●□◇◆等符號以示區(qū)隔。無序列表始于
<ul>標(biāo)簽。每個列表項始于<li>標(biāo)簽。
如：
無序列表<ul>的type屬性有三個數(shù)值可選，這三個選項分別為：disc實心園、circle空心園、square小方塊。 默認(rèn)屬性是disc實心園。
如：
-
自定義列表：自定義列表不僅僅是一列項目，而是項目及其注釋的組合。自定義列表以
<dl>標(biāo)簽開始。每個自定義列表項以<dt>開始。每個自定義列表項的定義以<dd>開始。
如：
區(qū)別及使用場景：對于一個列表項目，三種方法都可以實現(xiàn)，但是在有嚴(yán)格順序要求的情況下，使用有序列表最好。在內(nèi)容是并列的情況下，最好用無序列表，不需要非常注意次序，只需要列出即可。自定義列表用法和無序列表一樣，不過比無序列表更便捷。
嵌套：
2. 如何去除列表前面的點或者數(shù)字？
使用list-style:none；
3. class 和 id 有什么區(qū)別？什么時候用 class 什么時候用 id？
-
區(qū)別：
a. class在樣式可以使用多次，而id只能使用一次。
b. class書寫前綴使用“.”，而id的前綴使用“#”。
c. id是一個標(biāo)簽，用于區(qū)分不同的結(jié)構(gòu)和內(nèi)容，就像名字，如果一個屋子有2個人同名，就會出現(xiàn)混淆；class是一個樣式，可以套在任何結(jié)構(gòu)和內(nèi)容上，使用時并沒有規(guī)定次數(shù)和使用條件。 -
用法：
id在頁面中是獨一無二的，在劃分頁面的大區(qū)塊的時候使用，這樣大的區(qū)塊不會受其他的樣式的影響。比如地圖上的省份，就是獨一無二的。
class可以重復(fù)，一般在結(jié)構(gòu)內(nèi)部使用，用于樣式定義；class可以通過給多個元素賦予同一class，批量操作來設(shè)置css。
4. 塊級元素、行內(nèi)元素是什么？有什么區(qū)別？分別對應(yīng)哪些常用標(biāo)簽？
-
定義：
塊級元素占據(jù)其父元素（容器）的整個空間，因此創(chuàng)建了一個“塊”。通常瀏覽器會在塊級元素前后另起一行。能容納其他塊元素或者內(nèi)聯(lián)元素。行內(nèi)元素，也叫內(nèi)聯(lián)元素或者內(nèi)嵌元素，只占據(jù)它對應(yīng)標(biāo)簽的邊框所包含的空間。只能容納文本或者其他內(nèi)聯(lián)元素。 -
區(qū)別：
a. 塊級元素可以包含行內(nèi)元素，也可以包含塊級元素，行內(nèi)元素不能包含塊級元素，塊級元素在瀏覽器顯示時通常會以新行來開始或者結(jié)束，內(nèi)聯(lián)元素在顯示時通常不會以新行開始。
b. 塊級元素可以設(shè)置寬高，內(nèi)聯(lián)元素在沒有將其轉(zhuǎn)換成塊級元素之前是無法設(shè)置它的寬高的，內(nèi)聯(lián)元素的寬高總是隨著自身內(nèi)容的增減去擴大縮小.
c. 塊級元素與行內(nèi)元素的屬性不一樣，塊級元素設(shè)置margin和padding是正常的， 內(nèi)聯(lián)元素設(shè)置margin和padding的上下是無效的，但是可以使用（line-height）設(shè)置它的行高，將其撐開。 -
常用標(biāo)簽
塊級元素：div、p、h1...h6、table、tr、ol、ul、li、dl、dt、form
行內(nèi)元素：a、span、img、input、button、em、textarea
5. display: block、display: inline、display: inline-block分別有什么作用?
display:block就是將元素顯示為塊級元素
display:inline就是將元素顯示為行內(nèi)元素
display:inline-block表示此塊級元素既有行內(nèi)元素的性質(zhì)，可以水平排列，又具有塊級元素的性質(zhì)，可以設(shè)置上下左右的邊距，但缺點是IE8以下不能使用。當(dāng)然要實現(xiàn)這樣的效果也可以使用浮動來實現(xiàn)。
6. 下面代碼是做什么的？抄寫一遍下面的代碼，注意class和id的使用及命名方式。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> .wrap{ width:900px; margin:0 auto; } </style> </head> <body> <div id="header"> <div class="wrap"> <a id="logo" href="#"><img src=""></a> <ul class="nav"> <li><a href="#">導(dǎo)航1</a></li> <li><a href="#">導(dǎo)航2</a></li> <li><a href="#">導(dǎo)航3</a></li> </ul> </div> </div> <div id="content"> <div class="wrap"> <div class="aside">側(cè)邊欄</div> <div class="main">中心區(qū)塊</div> </div> </div> <div id="footer"> <div class="wrap">這里是footer</div> </div> </body> </html>
這個頁面里面有頭部（header），內(nèi)容（content），頁腳（footer）三大塊，用id標(biāo)識，頭部里面有無序的三個導(dǎo)航鏈接，內(nèi)容部分由一個側(cè)邊欄和一個中間區(qū)組成。在這三大塊中均有一個使用wrap作為class的類名的類選擇器，在css樣式里面對wrap進行統(tǒng)一設(shè)置，用margin:0 auto的方法，使頁面大于固定寬度900像素時，自動居中。
7. 如何理解 HTML CSS 語義化? 在平時寫代碼的過程中要注意哪些細(xì)節(jié)？
語義化的含義就是用正確的標(biāo)簽做正確的事情，html語義化就是讓頁面的內(nèi)容結(jié)構(gòu)化，便于對瀏覽器、搜索引擎解析；在沒有樣式CSS情況下也以一種文檔格式顯示，并且是容易閱讀的。搜索引擎的爬蟲依賴于標(biāo)記來確定上下文和各個關(guān)鍵字的權(quán)重，利于 SEO。使閱讀源代碼的人對網(wǎng)站更容易將網(wǎng)站分塊，便于閱讀維護理。
在平時寫代碼中要規(guī)范格式，統(tǒng)一風(fēng)格。對于單詞的命名大小寫要統(tǒng)一，需要連接的地方用“-”不要用下劃線“_”。
8. form表單有什么作用？有哪些常用的input 標(biāo)簽，分別有什么作用？
<form> 標(biāo)簽用于為用戶輸入創(chuàng)建 HTML 表單。它可以把瀏覽者輸入的數(shù)據(jù)傳送到服務(wù)器端，這樣服務(wù)器端程序就可以處理表單傳過來的數(shù)據(jù)。
屬性：
| 屬性 | 值 | 描述 |
|---|---|---|
| accept-charset | charset-list | 規(guī)定服務(wù)器可處理的表單數(shù)據(jù)字符集。 |
| action | URL | 規(guī)定當(dāng)提交表單時向何處發(fā)送表單數(shù)據(jù)。 |
| autocomplete（H5新增） | on off | 規(guī)定是否啟用表單的自動完成功能。 |
| enctype | 見說明 | 規(guī)定在發(fā)送表單數(shù)據(jù)之前如何對其進行編碼。 |
| method | get post | 規(guī)定用于發(fā)送 form-data 的 HTTP 方法。 |
| name | form_name | 規(guī)定表單的名稱。 |
| novalidate（H5新增） | novalidate | 如果使用該屬性，則提交表單時不進行驗證。 |
| target | _blank _self _parent _top | 規(guī)定在何處打開 action URL。 |
說明：
- application/x-www-form-urlencoded
- multipart/form-data
- text/plain
input輸入表單有以下幾種類型：
- type="text"，用于輸入文本，placeholder屬性（可選）展示的是輸入框的提示，maxlength（可選）限制最大的輸入長度；
- type="password"，用于輸入密碼，輸入的內(nèi)容顯示為星號；
- type="radio"單選圓圈按鈕，注意：name要相同才能實現(xiàn)單選，value要有值；
- type="checkbox" 復(fù)選框。加上checked屬性會默認(rèn)選上；
- type="textarea" 文本域，用于輸入多行文本；
- type="hidden"隱藏域，用戶看不到，用于暫存數(shù)據(jù)或者安全性校驗；
- type="submit" 提交按鈕，把form表單的所有內(nèi)容發(fā)送給服務(wù)器。
- select:選擇列表，selected屬性會默認(rèn)選中該項目
9. post 和 get 方式的區(qū)別？
| 方面 | GET | POST |
|---|---|---|
| 后退按鈕/刷新 | 無害 | 數(shù)據(jù)會被重新提交（瀏覽器應(yīng)該告知用戶數(shù)據(jù)會被重新提交）。 |
| 書簽 | 可收藏為書簽 | 不可收藏為書簽 |
| 緩存 | 能被緩存 | 不能緩存 |
| 編碼類型 | application/x-www-form-urlencoded | application/x-www-form-urlencoded 或 multipart/form-data。為二進制數(shù)據(jù)使用多重編碼。 |
| 歷史 | 參數(shù)保留在瀏覽器歷史中。 | 參數(shù)不會保存在瀏覽器歷史中。 |
| 對數(shù)據(jù)長度的限制 | 是的。當(dāng)發(fā)送數(shù)據(jù)時，GET 方法向 URL 添加數(shù)據(jù)；URL 的長度是受限制的（URL 的最大長度是 2048 個字符）。 | 無限制。 |
| 對數(shù)據(jù)類型的限制 | 只允許 ASCII 字符。 | 沒有限制。也允許二進制數(shù)據(jù)。 |
| 安全性 | 與 POST 相比，GET 的安全性較差，因為所發(fā)送的數(shù)據(jù)是 URL 的一部分。在發(fā)送密碼或其他敏感信息時絕不要使用 GET ！ | POST 比 GET 更安全，因為參數(shù)不會被保存在瀏覽器歷史或 web 服務(wù)器日志中。 |
| 可見性 | 數(shù)據(jù)在 URL 中對所有人都是可見的。 | 數(shù)據(jù)不會顯示在 URL 中。 |
10. 在input里，name 有什么作用？
name 屬性用于對提交到服務(wù)器后的表單數(shù)據(jù)進行標(biāo)識，或者在客戶端通過 JavaScript 引用表單數(shù)據(jù)。
當(dāng)name的值相同時表示一組，可以實現(xiàn)單選。復(fù)選框中，可以把name值設(shè)置成一個數(shù)組，比如：
<input type="radio" name="gender" value="male"/> 男
<input type="radio" name="gender" value="female"/> 女
<input type="checkout" name="love []" value="travel"/>旅游
<input type="checkout" name="love []" value="pet"/>寵物
11. <button>提交</button>、<a class="btn" href="#">提交</a>、<input type="submit" value="提交"> 三者有什么區(qū)別？
<button>提交</button>標(biāo)簽之間的所有內(nèi)容都是按鈕的內(nèi)容，其中包括任何可接受的正文內(nèi)容，比如文本或多媒體內(nèi)容。例如，我們可以在按鈕中包括一個圖像和相關(guān)的文本，用它們在按鈕中創(chuàng)建一個吸引人的標(biāo)記圖像。但是它存在一定的缺陷就是是不同的瀏覽器得到的 value 值不同；可能還有其他的瀏覽器兼容問題。
<a class="btn" href="#">提交</a>這是一個文本鏈接，點擊提交會跳轉(zhuǎn)到另一個頁面，但是不會向后臺提交數(shù)據(jù)。<input type="submit" value="提交">這樣的按鈕用戶點擊之后會自動提交 form，除非你寫了javascript 阻止它。
12. radio 如何分組?
radio是單選類型，當(dāng)name相同時說明他們是同一組，可以實現(xiàn)單選。
<input type="radio" name="gender" value="male"/> 男
<input type="radio" name="gender" value="female"/> 女
13. placeholder 屬性有什么作用?
placeholder 屬性能夠讓你在文本框里顯示提示信息，一旦你在文本框里輸入了什么信息，提示信息就會隱藏。
只有IE8以上的瀏覽器才支持此功能。
<input type="text" name="用戶名" placeholder="ddd"/>
14. type=hidden隱藏域有什么作用? 舉例說明。
隱藏域在頁面中對于用戶是不可見的，在表單中插入隱藏域的目的在于收集或發(fā)送信息，以利于被處理表單的程序所使用。瀏覽者單擊發(fā)送按鈕發(fā)送表單的時候，隱藏域的信息也被一起發(fā)送到服務(wù)器。它可以用于暫存數(shù)據(jù)以及安全性校驗認(rèn)證。
如：
本教程版權(quán)歸本人和饑人谷所有，轉(zhuǎn)載須說明來源
