有序列表、無序列表商玫、自定義列表如何使用箕憾？寫個簡單的例子。三者在語義上有什么區(qū)別拳昌？在哪些情況下使用哪種（重要）袭异？ 如何嵌套？

列表例子

• 有序列表
  有序列表使用編號來記錄項目的順序炬藤，編號可以是數(shù)字或者英文字母御铃。適用于明顯有次序、不容亂的內(nèi)容列表沈矿。
  列表標簽采用< ol>< /ol>上真，列表項由< li>< /li>組成。

• 無序列表
  無序列表使用項目符號來記錄無序的項目羹膳。應(yīng)用場景為并列的睡互、地位相同、需要均勻排列的內(nèi)容列表陵像，此列項目使用粗體圓點（典型的小黑圓圈）進行標記就珠。大部分網(wǎng)頁應(yīng)用中的列表均采用無序列表。
  列表標簽采用< ul>< /ul>醒颖，列表項由< li>< /li>組成妻怎。

• 自定義列表
  自定義列表不僅僅是一列項目，而是項目及其注釋的組合泞歉。
  自定義列表以 < dl> 標簽開始逼侦。每個自定義列表項以 < dt> 開始。每個自定義列表項的定義以 < dd> 開始疏日。

如何嵌套偿洁？

如何去除列表前面的點或者數(shù)字撒汉？

list-style:none;

class 和 id 有什么區(qū)別沟优？什么時候用 class 什么時候用 id？

1 class 和 id的區(qū)別

• 在CSS文件里書寫時睬辐，ID加前綴"#"挠阁；CLASS用"."
• id一個頁面只可以使用一次；class可以多次引用溯饵。
• ID是一個標簽侵俗，用于區(qū)分不同的結(jié)構(gòu)和內(nèi)容，就象名字丰刊，如果一個屋子有2個人同名隘谣，就會出現(xiàn)混淆；class是一個樣式，可以套在任何結(jié)構(gòu)和內(nèi)容上寻歧，就象一件衣服掌栅；
• 從概念上說就是不一樣的：id是先找到結(jié)構(gòu)/內(nèi)容，再給它定義樣式码泛；class是先定義好一種樣式猾封，再套給多個結(jié)構(gòu)/內(nèi)容。

2 什么時候用 class 什么時候用 id噪珊？
W3C標準這樣規(guī)定的晌缘，在同一個頁面內(nèi)，不允許有相同名字的id對象出現(xiàn)痢站，但是允許相同名字的class磷箕。這樣，一般網(wǎng)站分為頭阵难，體搀捷，腳部分，因為考慮到它們在同一個頁面只會出現(xiàn)一次多望，所以用id嫩舟，其他的，比如說你定義了一個顏色為red的class怀偷，在同一個頁面也許要多次用到家厌，就用class定義。另外椎工，當頁面中用到j(luò)s或者要動態(tài)調(diào)用對象的時候饭于，要用到id，所以要根據(jù)自己的情況運用维蒙。

塊級元素掰吕、行內(nèi)元素是什么？有什么區(qū)別颅痊？分別對應(yīng)哪些常用標簽殖熟？

1 塊級元素、行內(nèi)元素是什么斑响？

• 塊級元素默認占一行高度菱属，一行內(nèi)添加一個塊級元素后無法一般無法添加其他元素（float浮動后除外）。兩個塊級元素連續(xù)編輯時舰罚，會在頁面自動換行顯示纽门。塊級元素一般可嵌套塊級元素或行內(nèi)元素。塊級元素一般作為容器出現(xiàn)营罢，用來組織結(jié)構(gòu)赏陵。
• 行內(nèi)元素也叫內(nèi)聯(lián)元素、內(nèi)嵌元素等；行內(nèi)元素一般都是基于語義級(semantic)的基本元素蝙搔，只能容納文本或其他內(nèi)聯(lián)元素候醒。

2 有什么區(qū)別？

• 塊級：塊級元素會獨占一行杂瘸，默認情況下寬度自動填滿其父元素寬度
  行內(nèi)：行內(nèi)元素不會獨占一行倒淫，相鄰的行內(nèi)元素會排在同一行。其寬度隨內(nèi)容的變化而變化败玉。
• 塊級：塊級元素可以設(shè)置寬高
  行內(nèi)：行內(nèi)元素不可以設(shè)置寬高
• 塊級：塊級元素可以設(shè)置margin敌土，padding
  行內(nèi)：行內(nèi)元素水平方向的margin-left; margin-right; padding-left; padding-right;可以生效。但是豎直方向的margin-bottom; margin-top; padding-top; padding-bottom;卻不能生效运翼。
• 塊級：display:block;
  行內(nèi)：display:inline;
  可以通過修改display屬性來切換塊級元素和行內(nèi)元素

3 分別對應(yīng)哪些常用標簽返干？

• 塊級元素常用標簽：div , p , form, ul, li , ol, dl, form, address, fieldset, hr, menu, table
• 行內(nèi)元素常用標簽：span, strong, em, br, img , input, label, select, textarea, cite

display: block、display: inline血淌、display: inline-block分別有什么作用?

• display:block是將元素顯示為塊級元素矩欠。（塊級元素的概念見上一個問題）
• display:inline是將元素顯示為行內(nèi)元素。（行內(nèi)元素的概念見上一個問題）
• display:inline-block是將對象呈遞為內(nèi)聯(lián)對象悠夯，但是對象的內(nèi)容作為塊對象呈遞癌淮。旁邊的內(nèi)聯(lián)對象會被呈遞在同一行內(nèi)，允許空格沦补。(準確地說乳蓄，應(yīng)用此特性的元素呈現(xiàn)為內(nèi)聯(lián)對象，周圍元素保持在同一行夕膀，但可以設(shè)置寬度和高度地塊元素的屬性)
  display:inline虚倒、block、inline-block的區(qū)別

下面代碼是做什么的产舞？抄寫一遍下面的代碼魂奥，注意class和id的使用及命名方式

手抄代碼

定義了一個上中下結(jié)構(gòu)的網(wǎng)頁結(jié)構(gòu)。header易猫、content耻煤、footer三個div使用id命名方式將頁面分成三部分，三個部分的內(nèi)部都使用了wrap統(tǒng)一定義內(nèi)容區(qū)寬度為900px擦囊，并且內(nèi)容區(qū)域始終居中顯示违霞。header內(nèi)部定義了logo圖片和導航列表，content內(nèi)部定義了側(cè)邊欄和中心區(qū)塊瞬场。

如何理解 HTML CSS 語義化? 在平時寫代碼的過程中要注意哪些細節(jié)？

1 如何理解 HTML CSS 語義化?
據(jù)內(nèi)容的結(jié)構(gòu)化（內(nèi)容語義化）涧郊，選擇合適的標簽（代碼語義化）便于開發(fā)者閱讀和寫出更優(yōu)雅的代碼的同時讓瀏覽器的爬蟲和機器很好地解析贯被。

2 在平時寫代碼的過程中要注意哪些細節(jié)？

• 盡可能少的使用無語義的標簽div和span；
• 在語義不明顯時彤灶，既可以使用div或者p時看幼，盡量用p, 因為p在默認情況下有上下間距，對兼容特殊終端有利幌陕；
• 不要使用純樣式標簽诵姜，如：b、font搏熄、u等棚唆，改用css設(shè)置；
• 需要強調(diào)的文本心例，可以包含在strong或者em標簽中（瀏覽器預(yù)設(shè)樣式宵凌，能用CSS指定就不用他們），strong默認樣式是加粗（不要用b）止后，em是斜體（不用i）瞎惫；
• 使用表格時，標題要用caption译株，表頭用thead瓜喇，主體部分用tbody包圍，尾部用tfoot包圍歉糜。表頭和一般單元格要區(qū)分開欠橘，表頭用th，單元格用td现恼；
• 表單域要用fieldset標簽包起來肃续，并用legend標簽說明表單的用途；
• 每個input標簽對應(yīng)的說明文本都需要使用label標簽叉袍，并且通過為input設(shè)置id屬性始锚，在lable標簽中設(shè)置for=someld來讓說明文本和相對應(yīng)的input關(guān)聯(lián)起來。

form表單有什么作用喳逛？有哪些常用的input 標簽瞧捌，分別有什么作用？

1 form表單有什么作用润文？
form標簽是用來進行表單提交用的姐呐。
常見屬性：
name：表單提交時的名稱
action: 表單提交的地址, 肯定是要提交給某個服務(wù)器的,action的地址就是要提交的服務(wù)器的地址
method:以何種方式提交,常見的為get和post. 區(qū)別在于一個是明文(在url中顯示),一個是暗文

2 有哪些常用的input 標簽，分別有什么作用典蝌？

• type="text"
  輸入類型是text曙砂，這是我們見的最多也是使用最多的，比如登陸輸入用戶名骏掀，注冊輸入電話號碼鸠澈，電子郵件柱告，住址等等。當然這也是Input的默認類型笑陈。
  參數(shù)name：同樣是表示的該文本輸入框名稱际度。
  參數(shù)size：輸入框的長度大小。
  參數(shù)maxlength：輸入框中允許輸入字符的最大數(shù)涵妥。
  參數(shù)value：輸入框中的默認值乖菱。
  特殊參數(shù)readonly：表示該框中只能顯示，不能添加修改蓬网。

• type="password"
  輸入類型是password窒所，一看就明白的密碼輸入框，最大的區(qū)別就是當在此輸入框輸入信息時顯示為保密字符拳缠。參數(shù)和“type=text”相類似墩新。

• type="file"
  當你在BBS上傳圖片，在Email中上傳附件時一定少不了的東西窟坐，提供了一個文件目錄輸入的平臺海渊，選擇上傳文件。參數(shù)有name哲鸳，size臣疑。

• type=hidden
  非常值得注意的一個，通常稱為隱藏域徙菠。如果一個非常重要的信息需要被提交到下一頁讯沈，但又不能或者無法明示的時候。一句話婿奔，你在頁面中是看不到hidden在哪里缺狠。

• type="button"
  標準的windows風格的按鈕，當然要讓按鈕跳轉(zhuǎn)到某個頁面上還需要加入寫JavaScript代碼萍摊。

• type="checkbox"
  多選框挤茄，常見于注冊時選擇愛好、性格冰木、等信息穷劈。參數(shù)有name,value及特別參數(shù)checked（表示默認選擇） 其實最重要的還是value值，提交到處理頁的也就是value踊沸。

• type="radio"
  單選框歇终，出現(xiàn)在多選一的頁面設(shè)定中。參數(shù)同樣有name,value及特別參數(shù)checked逼龟。不同于checkbox的是评凝，name值一定要相同，否則就不能多選一审轮。當然提交到處理頁的也還是value值肥哎。

• type="image"
  比較另類的一個辽俗，可以作為提交式圖片按鈕疾渣，通常采用這種按鈕效果更美觀篡诽。

• type="submit" and type="reset"
  分別是“提交”和“重置”兩按鈕，submit主要功能是將Form中所有內(nèi)容進行提交action頁處理榴捡，reset是快速清空所有填寫內(nèi)容的功能杈女。

post 和 get 方式的區(qū)別？

1. get是從服務(wù)器上獲取數(shù)據(jù)吊圾，post是向服務(wù)器傳送數(shù)據(jù)达椰。
2. get是把參數(shù)數(shù)據(jù)隊列加到提交表單的ACTION屬性所指的URL中，值和表單內(nèi)各個字段一一對應(yīng)项乒，在URL中可以看到啰劲。post是通過HTTP post機制，將表單內(nèi)各個字段與其內(nèi)容放置在HTML HEADER內(nèi)一起傳送到ACTION屬性所指的URL地址檀何。用戶看不到這個過程蝇裤。
3. 對于get方式，服務(wù)器端用Request.QueryString獲取變量的值频鉴，對于post方式栓辜，服務(wù)器端用Request.Form獲取提交的數(shù)據(jù)。
4. get傳送的數(shù)據(jù)量較小垛孔，不能大于2KB藕甩。post傳送的數(shù)據(jù)量較大，一般被默認為不受限制周荐。但理論上狭莱，IIS4中最大量為80KB，IIS5中為100KB概作。
5. get安全性非常低腋妙，post安全性較高。但是執(zhí)行效率卻比Post方法好仆嗦。

在input里辉阶，name 有什么作用？

作為可與服務(wù)器交互數(shù)據(jù)的HTML元素的服務(wù)器端的標示瘩扼。

<button>提交</button>谆甜、<a class="btn" href="#">提交</a>、<input type="submit" value="提交">三者有什么區(qū)別集绰？

<button>具有<input type="button" ... >相同的作用但是在可操控性方面更加強大规辱。在 button 元素內(nèi)部，可以放置文本或圖像栽燕。Button 標簽更像是“觸發(fā)一個功能”罕袋，而A標簽打開另一個網(wǎng)頁則是一個跳轉(zhuǎn)鏈接改淑，Input標簽提交表單則是“輸入”。

如果是鏈接到外部資源或內(nèi)部頁面的鏈接應(yīng)當使用 a 標簽膨疏。如果是應(yīng)用程序中的功能按鈕，例如：添加到購物車藕赞，應(yīng)當使用 button 標簽成肘。如果實在表單中使用，應(yīng)當使用 input 標簽（例如提交按鈕）

radio 如何 分組?

name的值設(shè)成一樣的為一組

<input type="radio" name="user" value="張三" >
<input type="radio" name="user" value="曾四" >

上面的兩個選項的name值都是user斧蜕，所以兩個它們兩個為一組双霍，并且為單選項。

placeholder 屬性有什么作用?

提供可描述輸入字段預(yù)期值的提示信息（hint）批销。
該提示會在輸入字段為空時顯示洒闸，并會在字段獲得焦點時消失。
placeholder 屬性是 HTML5 中的新屬性均芽。

type=hidden隱藏域有什么作用? 舉例說明

1. 隱藏域在頁面中對于用戶是不可見的丘逸，在表單中插入隱藏域的目的在于收集或發(fā)送信息弄喘，以利于被處理表單的程序所使用孽水。瀏覽者單擊發(fā)送按鈕發(fā)送表單的時候逃呼，隱藏域的信息也被一起發(fā)送到服務(wù)器膨桥。
2. 有些時候我們要給用戶一信息，讓他在提交表單時提交上來以確定用戶身份和泌，如sessionkey本昏，等等．當然這些東西也能用cookie實現(xiàn)蛹尝，但使用隱藏域就簡單的多了．而且不會有瀏覽器不支持镣奋，用戶禁用cookie的煩惱币呵。
3. 有些時候一個form里有多個提交按鈕，怎樣使程序能夠分清楚到底用戶是按那一個按鈕提交上來的呢侨颈？我們就可以寫一個隱藏域余赢，然后在每一個按鈕處加上onclick="document.form.command.value="xx""然后我們接到數(shù)據(jù)后先檢查command的值就會知道用戶是按的那個按鈕提交上來的芯义。
4. 有時候一個網(wǎng)頁中有多個form，我們知道多個form是不能同時提交的妻柒，但有時這些form確實相互作用扛拨，我們就可以在form中添加隱藏域來使它們聯(lián)系起來。
5. javascript不支持全局變量蛤奢，但有時我們必須用全局變量鬼癣，我們就可以把值先存在隱藏域里陶贼，它的值就不會丟失了啤贩。
6. 還有個例子，比如按一個按鈕彈出四個小窗口拜秧，當點擊其中的一個小窗口時其他三個自動關(guān)閉．可是IE不支持小窗口相互調(diào)用痹屹，所以只有在父窗口寫個隱藏域，當小窗口看到那個隱藏域的值是close時就自己關(guān)掉枉氮。

<input type="hidden" name="field＿name" value="value">

本教程版權(quán)歸作者和饑人谷所有志衍，轉(zhuǎn)載須說明來源！