一，有序列表焕襟、無序列表分扎、自定義列表如何使用？寫個簡單的例子胧洒。三者在語義上有什么區(qū)別畏吓？在哪些情況下使用哪種（重要）墨状？ 如何嵌套？
答：
有序列表通常用來表示內(nèi)容之間的順序或者是重要性關(guān)系菲饼，每一個列表都分為多個子項肾砂，每一個子項都有相應(yīng)的編號。
無序列表僅僅用于表示內(nèi)容之間存在有并列關(guān)系宏悦，也是分為多個子項镐确，但是子項之前沒有相應(yīng)的編號，只有一個原點用于標(biāo)識饼煞。
定義列表通常用于表示名詞或者是概念的定義源葫，每一個子項有兩個部分組成，第一部分是名詞或者是概念砖瞧，第二部分是相應(yīng)的解釋和描述息堂。
列表的簡單舉例
<!doctype html>
<HTML>
<head>
<meta name="hkeywords" content"ol,ul,dl" charset="utf-8"/>
</head>
<body>
<!--無序列表-->
<ul>
<li>我是無序列表</li>
<li>我是無序列表</li>
<li>我是無序列表</li>
</ul>
<!--有序列表-->
<ol>
<li>我是有序列表1</li>
<li>我是有序列表2</li>
<li>我是有序列表3</li>
</ol>
<!--自定義列表-->
<dl>
<dt>我是自定義列表項目</dt>
<dd>這是項目內(nèi)容</dd>
<dd>這是項目內(nèi)容</dd>
<dt>web前端</dt>
<dd>HTML</dd>
<dd>CSS</dd>
<dd>JavaScript</dd>
<dt>編程語言</dt>
<dd>Java</dd>
<dd>C++</dd>
</dl>
</body>
</HTML>
無序列表 unorder list 默認(rèn)列表項前是小圓點
有序列表排序的類型共五種：默認(rèn)阿拉伯?dāng)?shù)字，“a”小寫字母块促，"A"大寫字母荣堰，"I"大寫羅馬數(shù)字排序，"i"小寫羅馬數(shù)字排序.
start 排序的其實位置如果type="a" start="5" 那么從字母e開始.
reversed="true" 倒序排列.
自定義列表表達(dá)對名詞或概念的解釋或者描述
- 三者在語義上的區(qū)別：
1.無序列表:就是列表結(jié)構(gòu)中的列表項沒有先后順序的列表形式竭翠，大部分網(wǎng)頁應(yīng)用中的列表均采用無序列表振坚，其列表標(biāo)簽采用ul，默認(rèn)的使用粗體圓點進行標(biāo)記斋扰。每個列表項始于li標(biāo)簽渡八。
2.有序列表:有序列表就是列表結(jié)構(gòu)中的列表項有先后順序的列表形式，從上到下可以有各種不同的序列編號传货，如1屎鳍、2、3或a损离、b哥艇、c等绝编；列表使用ol標(biāo)簽標(biāo)記，start值表示編號起始值。每個列表項始于li標(biāo)簽捕捂。
3.自定義列表:它由兩個部分組成：定義條件和定義描述漂洋。
列表以 dl 標(biāo)簽開始，每個自定義列表項以 dt 開始逗堵。每個自定義列表項的定義以 dd 開始秉氧。 - 在哪些情況下使用哪種（重要）？
對于一個列表項目蜒秤，三種方法都可以實現(xiàn)汁咏，若此項目是按順序排列的亚斋，則使用有序列表。若項目中的列表內(nèi)容是并列的攘滩，則使用無序列表帅刊，自定義列表用法和無序列表一樣，不過比無序列表更便捷漂问。
list-style-type:list-style-type屬性是用來定義li列表的項目符號的赖瞒，即列表前面的修飾,是一個可繼承的屬性。
list-style-image:list-style-image用來定義使用圖片代替項目符號蚤假。它也是一個可繼承屬性栏饮。
list-style-position屬性是用來定義項目符號在列表中顯示位置的屬性。它同樣是一個可繼承的屬性磷仰，語法結(jié)構(gòu)如下：
list-style-position:inside/outside
inside：項目符號放置在文本以內(nèi)袍嬉。 outside：項目符號放置在文本以外。
- 如何嵌套芒划？
<HTML>
<head>
<meta name="hkeywords" content"ol,ul,dl" charset="utf-8"/>
</head>
<body style="background-color:#ccc color:#333">
<p>綜合性大學(xué)</p>
<!--無序列表-->
<ul>
<li>外國語學(xué)院</li>
<li>工商管理學(xué)院</li>
<li>計算機學(xué)院</li>
<!--嵌套有序列表-->
<ol>
<li>計算機網(wǎng)絡(luò)技術(shù)</li>
<li>計算機編程技術(shù)</li>
<li>web前端開發(fā)</li>
<!--嵌套自定義列表-->
<dl>
<dt>web前端</dt>
<dd>HTML</dd>
<dd>CSS</dd>
<dd>JavaScript</dd>
</dl>
<li>操作系統(tǒng)與系統(tǒng)架構(gòu)</li>
<li>數(shù)據(jù)庫編程與開發(fā)</li>
</ol>
<li>化工學(xué)院</li>
<li>醫(yī)學(xué)院</li>
</ul>
</body>
</HTML>
參考資料：css控制UL LI 的樣式詳解(推薦)
二冬竟，如何去除列表前面的點或者數(shù)字？
答：將列表屬性值設(shè)置為：list-style-type:none民逼。即可泵殴。
三，class 和 id 有什么區(qū)別拼苍？什么時候用 class 什么時候用 id笑诅？
答：
class：用于概念上相似的元素，可以出現(xiàn)在同一頁面上的多個位置疮鲫。
id：具有唯一性吆你，用于不同的唯一的元素。
區(qū)別：
（1）class可重復(fù)使用俊犯；而id只能使用一次妇多。
（2）class具有普遍性；id具有唯一性燕侠。
（3）id的樣式優(yōu)先級高于class者祖。
（4）在CSS文件里書寫時，id加前綴"#"绢彤；class用"."七问。
（5）class在結(jié)構(gòu)內(nèi)部使用，通常用于樣式定義茫舶；id在結(jié)構(gòu)外圍使用械巡，通常用于頁面布局。id和class的使用方法和時機
單一的元素，或需要程序讥耗、JS控制的東西有勾，需要用id定義；重復(fù)使用的元素古程、類別柠衅，用class定義。其他解釋：
class是設(shè)置標(biāo)簽的類籍琳，id是設(shè)置標(biāo)簽的標(biāo)識菲宴，class屬性用于指定元素屬于何種樣式的類。
例如樣式表可以加入
.content1 { color: red; background: #ff80c0 }使用方法：class="content1"
id屬性用于定義一個元素的獨特的樣式趋急。如一個CSS規(guī)則#content2 { font-size: larger }使用方法：id="content2"
id是一個標(biāo)簽喝峦，用于區(qū)分不同的結(jié)構(gòu)和內(nèi)容，就象你的名字呜达，區(qū)分你和別人谣蠢。
class是一個樣式，可以套在任何結(jié)構(gòu)和內(nèi)容上查近，就象一件衣服眉踱；
概念上說就是不一樣的：
id是先找到結(jié)構(gòu)/內(nèi)容，再給它定義樣式霜威；class是先定義好一種樣式谈喳，再套給多個結(jié)構(gòu)/內(nèi)容。
參考資料,還有這里.
四戈泼，塊級元素婿禽、行內(nèi)元素是什么？有什么區(qū)別大猛？分別對應(yīng)哪些常用標(biāo)簽扭倾？
答：
常用塊級元素如下：
塊級元素：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, 。
行內(nèi)元素與塊級函數(shù)的三個區(qū)別
1.行內(nèi)元素與塊級元素直觀上的區(qū)別：
行內(nèi)元素會在一條直線上排列挽绩，都是同一行的膛壹，水平方向排列塊級元素各占據(jù)一行，垂直方向排列唉堪。塊級元素從新行開始結(jié)束接著一個斷行模聋。
2.塊級元素可以包含行內(nèi)元素和塊級元素。行內(nèi)元素不能包含塊級元素巨坊。
3.行內(nèi)元素與塊級元素屬性的不同撬槽，主要是盒模型屬性上行內(nèi)元素設(shè)置width無效此改，height無效(可以設(shè)置line-height)趾撵，margin左右有效，上下無效，padding左右有效占调，上下無效暂题。
4.塊級元素和行內(nèi)元素的相關(guān)屬性是display,其中塊級元素對應(yīng)于display:block,行內(nèi)元素對應(yīng)于display:inline.我們可以修改dispaly屬性切換塊級元素和行內(nèi)元素。
5.<input>和<img>都是行內(nèi)元素究珊，但是它們是可以設(shè)置寬和高的薪者。這里就涉及到可替換元素和不可替換元素〗虽蹋可替換元素一般都是行內(nèi)元素言津。
附錄：
所有的塊級元素和行內(nèi)元素
塊級元素（block element）
- address - 地址
- blockquote - 塊引用
- center - 舉中對齊塊
- div - 常用塊級容易，也是css layout的主要標(biāo)簽
- dl - 定義列表
- fieldset - form控制組
- form - 交互表單
- h1 - 大標(biāo)題
- h2 - 副標(biāo)題
- h3 - 3級標(biāo)題
- h4 - 4級標(biāo)題
- h5 - 5級標(biāo)題
- h6 - 6級標(biāo)題
- hr - 水平分隔線
- isindex - input prompt
- ol - 有序列表
- p - 段落
- pre - 格式化文本
- table - 表格
- ul - 無序列表
內(nèi)聯(lián)元素(inline element)
- a - 錨點
- abbr - 縮寫
- acronym - 首字
- b - 粗體(不推薦)
- big - 大字體
- br - 換行
- cite - 引用
- code - 計算機代碼(在引用源碼的時候需要)
- dfn - 定義字段
- em - 強調(diào)
- font - 字體設(shè)定(不推薦)
- i - 斜體
- img - 圖片
- input - 輸入框
- kbd - 定義鍵盤文本
- label - 表格標(biāo)簽
- q - 短引用
- s - 中劃線(不推薦)
- samp - 定義范例計算機代碼
- select - 項目選擇
- small - 小字體文本
- span - 常用內(nèi)聯(lián)容器取试，定義文本內(nèi)區(qū)塊
- strike - 中劃線
- strong - 粗體強調(diào)
- sub - 下標(biāo)
- sup - 上標(biāo)
- textarea - 多行文本輸入框
可替換元素
可變元素為根據(jù)上下文語境決定該元素為塊元素或者內(nèi)聯(lián)元素悬槽。
- applet - java applet
- button - 按鈕
- del - 刪除文本
- iframe - inline frame
- ins - 插入的文本
- map - 圖片區(qū)塊(map)
- object - object對象
- script - 客戶端腳本
五，display: block瞬浓、display: inline初婆、display: inline-block分別有什么作用?
答：
1.display：block將元素定義為塊級元素。元素占滿整行100%猿棉，可設(shè)置width,height磅叛、margin和padding屬性
2.display：inline將元素定義為行內(nèi)元素，對width,height無效萨赁，line-height有效弊琴，margin和padding屬性水平方向有效，垂直方向無效杖爽。一行排滿才會換行访雪，寬度隨元素內(nèi)容而變化。
3.display: inline-block的作用是行內(nèi)快元素掂林。元素既擁有了block元素可以設(shè)置width和height的特性臣缀，又保持了inline元素不換行的特性。
六泻帮，下面代碼是做什么的精置？抄寫一遍下面的代碼，注意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>
答：網(wǎng)頁實現(xiàn)了一個簡單的頁面布局锣杂。主要分為三大區(qū)塊脂倦，分別為頭部的header區(qū)，中間部分的content區(qū)（又分為側(cè)邊欄aside和主體區(qū)域main）元莫，以及底部區(qū)域footer赖阻。
網(wǎng)頁中統(tǒng)一的樣式布局全部用class（.wrap）來定義。id作為區(qū)域劃分的標(biāo)簽使用踱蠢。使頁面的布局和樣式清晰明了火欧。
七棋电，如何理解 HTML CSS 語義化? 在平時寫代碼的過程中要注意哪些細(xì)節(jié)？
答：根據(jù)內(nèi)容的結(jié)構(gòu)化（內(nèi)容語義化）苇侵，選擇合適的標(biāo)簽（代碼語義化）便于開發(fā)者閱讀和寫出更優(yōu)雅的代碼的同時讓瀏覽器的爬蟲和機器很好地解析赶盔。使頁面有良好的結(jié)構(gòu)，頁面元素有含義榆浓，能夠讓人和搜索引擎都容易理解于未。
寫HTML代碼時應(yīng)注意什么？
- 盡可能少的使用無語義的標(biāo)簽div和span陡鹃；
- 在語義不明顯時烘浦，既可以使用div或者p時，盡量用p, 因為p在默認(rèn)情況下有上下間距萍鲸，對兼容特殊終端有利谎倔；
- 不要使用純樣式標(biāo)簽，如：b猿推、font片习、u等，改用css設(shè)置蹬叭。
- 需要強調(diào)的文本藕咏，可以包含在strong或者em標(biāo)簽中（瀏覽器預(yù)設(shè)樣式，能用CSS指定就不用他們）秽五，strong默認(rèn)樣式是加粗（不要用b）孽查，em是斜體（不用i）；
- 使用表格時坦喘，標(biāo)題要用caption盲再，表頭用thead，主體部分用tbody包圍瓣铣，尾部用tfoot包圍答朋。表頭和一般單元格要區(qū)分開，表頭用th棠笑，單元格用td梦碗；
- 表單域要用fieldset標(biāo)簽包起來，并用legend標(biāo)簽說明表單的用途蓖救；
- 每個input標(biāo)簽對應(yīng)的說明文本都需要使用label標(biāo)簽洪规，并且通過為 input設(shè)置id屬性，在lable標(biāo)簽中設(shè)置for=someld來讓說明文本和相對應(yīng)的input關(guān)聯(lián)起來循捺。
八斩例，form表單有什么作用？有哪些常用的input 標(biāo)簽从橘，分別有什么作用念赶？
答：<form> 標(biāo)簽用于為用戶輸入創(chuàng)建 HTML 表單,表單向服務(wù)器傳輸用戶數(shù)據(jù)础钠。
表單能夠包含 input 元素，比如文本字段晶乔、復(fù)選框、單選框牺勾、提交按鈕等等正罢。表單還可以包含 menus、textarea驻民、fieldset和 label 元素 等翻具。
<form>標(biāo)簽屬性：
- name: 表單提交時的名稱
- action {URL}：一個URL地址；指定form表單向何處發(fā)送數(shù)據(jù)回还。
- method {get/post}：指定表單以何種方式發(fā)送到指定的頁面裆泳。
指定的值有g(shù)et和post：
get ：from表單里所填的值，附加在action指定的URL后面柠硕，做為URL鏈接而傳遞工禾；
post ：from表單里所填的值，附加在HTML Headers上蝗柔。 - enctype {string}：規(guī)定在發(fā)送表單數(shù)據(jù)之前闻葵，如何對表單數(shù)據(jù)進行編碼。
指定的值有application/x-www-form-urlencoded 和multipart/form-data：
application/x-www-form-urlencoded ：在發(fā)送前編碼所有字符（默認(rèn)為此方式）癣丧；
multipart/form-data ：不對字符編碼槽畔。使用包含文件上傳控件的表單時，必須使用該值胁编。
附錄：常見的input類型
有哪些常用的input 標(biāo)簽厢钧，分別有什么作用?
<input type="text">用于輸入文本,可以加入placeholder屬性來寫框內(nèi)的提示內(nèi)容，還有maxlength用來限制文本框里的字?jǐn)?shù)嬉橙，value用來填寫里面的默認(rèn)內(nèi)容早直。
<input type="password">里面輸入密碼顯示文字為星號。
<input type=“raido”>是單選框但是只在里面name相同的情況下是單選市框，不相同的話是多選莽鸿。
<input type="checkbox">復(fù)選框，加入checked使之成為默認(rèn)選項拾给。
<input type="textrea">文本域祥得，用于輸入大量文本。
<input type="select">下拉選擇列表蒋得，加入selected使之成為默認(rèn)選擇级及。
<input type="submit">定義提交按鈕,向服務(wù)器發(fā)送表單數(shù)據(jù)，里面的內(nèi)容根據(jù)value決定额衙。
<input type="reset" > 定義重置按鈕饮焦。重置按鈕會清除表單中的所有數(shù)據(jù)怕吴。
<input type="image" >定義圖像形式的提交按鈕。
必須把標(biāo)簽的 src 屬性和Alt屬性與其結(jié)合使用县踢。
<input type="hidden">定義隱藏字段转绷。隱藏字段對于用戶是不可見的。隱藏字段通常會存儲一個默認(rèn)值硼啤，它們的值也可以由 JavaScript 進行修改议经。
<input type="file" >用于文件上傳。
<input type="button" >定義可點擊的按鈕谴返，但沒有任何行為煞肾。button 類型常用于在用戶點擊按鈕時啟動 JavaScript 程序。
所有的input可以添加屬性 disabled來禁用輸入
參考資料1嗓袱，參考資料2,參考資料2,參考資料3籍救。
九，post 和 get 方式的區(qū)別渠抹？
答：
- GET提交蝙昙，請求的數(shù)據(jù)會附在URL之后（就是把數(shù)據(jù)放置在HTTP協(xié)議頭中），以?分割URL和傳輸數(shù)據(jù)梧却，多個參數(shù)用&連接耸黑；例 如：
login.action?name=jierengu&password=idontknow&verify=%E4%BD%A0 %E5%A5%BD。如果數(shù)據(jù)是英文字母/數(shù)字篮幢，原樣發(fā)送;如果是空格大刊，轉(zhuǎn)換為+，如果是中文/其他字符三椿，則直接把字符串用BASE64加密缺菌，得出如： %E4%BD%A0%E5%A5%BD，其中％XX中的XX為該符號以16進制表示的ASCII搜锰。
POST提交：把提交的數(shù)據(jù)放置在是HTTP包的包體中伴郁。上文示例中紅色字體標(biāo)明的就是實際的傳輸數(shù)據(jù)
因此，GET提交的數(shù)據(jù)會在地址欄中顯示出來蛋叼，而POST提交焊傅，地址欄不會改變
- 傳輸數(shù)據(jù)的大小：首先聲明：HTTP協(xié)議沒有對傳輸?shù)臄?shù)據(jù)大小進行限制狈涮，HTTP協(xié)議規(guī)范也沒有對URL長度進行限制狐胎。
而在實際開發(fā)中存在的限制主要有：
GET:特定瀏覽器和服務(wù)器對URL長度有限制，例如 IE對URL長度的限制是2083字節(jié)(2K+35)歌馍。對于其他瀏覽器握巢，如Netscape、FireFox等松却，理論上沒有長度限制暴浦，其限制取決于操作系 統(tǒng)的支持溅话。
因此對于GET提交時，傳輸數(shù)據(jù)就會受到URL長度的 限制歌焦。
POST:由于不是通過URL傳值飞几，理論上數(shù)據(jù)不受 限。但實際各個WEB服務(wù)器會規(guī)定對post提交數(shù)據(jù)大小進行限制独撇，Apache屑墨、IIS6都有各自的配置。 - 安全性：
POST的安全性要比GET的安全性高券勺。注意：這里所說的安全性和上面GET提到的“安全”不是同個概念绪钥。上面 “安全”的含義僅僅是不作數(shù)據(jù)修 改灿里，而這 里安全的含義是真正的Security的含義关炼，比如：通過GET提交數(shù)據(jù)，用戶名和密碼將明文出現(xiàn)在URL上匣吊，因為：
(1)登錄頁面有可能被瀏覽器緩存儒拂，
(2)其他人查看瀏覽器的歷史紀(jì)錄，那么別人就可以拿到你的賬號和密碼了色鸳，除此之外社痛，使用GET提交數(shù)據(jù)還可能會造成Cross-site request forgery攻擊。 - Http get,post,soap協(xié)議都是在http上運行的命雀。
1）get：請求參數(shù)是作為一個key/value對的序列（查詢字符串）附加到URL上的查詢字符串的長度受到web瀏覽器和web服務(wù)器的限制（如IE最多支持2048個字符）蒜哀，不適合傳輸大型數(shù)據(jù)集同時，它很不安全
2）post：請求參數(shù)是在http標(biāo)題的一個不同部分（名為entity body）傳輸?shù)睦羯埃@一部分用來傳輸表單信息撵儿，因此必須將Content-type設(shè)置為:application/x-www-form- urlencoded。post設(shè)計用來支持web窗體上的用戶字段狐血，其參數(shù)也是作為key/value對傳輸淀歇。但是：它不支持復(fù)雜數(shù)據(jù)類型，因為post沒有定義傳輸數(shù)據(jù)結(jié)構(gòu)的語義和規(guī)則匈织。3）soap：是http post的一個專用版本浪默，遵循一種特殊的xml消息格式Content-type設(shè)置為: text/xml 任何數(shù)據(jù)都可以xml化。
十纳决，在input里，name 有什么作用乡小？
答：
- name屬性用于規(guī)定input元素的名稱岳链，
- 用于對提交到服務(wù)器后的表單數(shù)據(jù)進行標(biāo)識，
- 在客戶端通過javascript引用表單數(shù)據(jù)
[注意]只有設(shè)置了name屬性的表單元素才能在提交表單時傳遞它們的值劲件。
擴展閱讀：name id,參考資料1.
十一掸哑，<button>提交</button> / <a class="btn" href="#">提交</a> / <input type="submit" value="提交">三者有什么區(qū)別约急？
答：
<button>提交</button>是一個單純的按鈕，點擊以后頁面沒有任何動作苗分。
<a class=“btn” href="#">提交</a>是一個偽裝成按鈕的超鏈接厌蔽，點擊以后可以進入另外的頁面。
<input type=“submit” value=“提交”>摔癣，是表單的按鈕奴饮，用來向服務(wù)器提交表單數(shù)據(jù)。
十二择浊，radio 如何 分組?
答：設(shè)置 name 屬性戴卜，名稱相同的為一組。
placeholder 屬性適用于以下的 <input> 類型：text, search, url, telephone, email 以及 password琢岩。
十三投剥，placeholder 屬性有什么作用?
答：placeholder屬性是HTML5 中為input添加的。在input上提供一個占位符担孔，文字形式展示輸入字段預(yù)期值的提示信息（hint）江锨，該字段會在輸入為空時顯示。
<!DOCTYPE HTML>
<html>
<body>
<form action="/example/html5/demo_form.asp" method="get">
<input type="search" name="user_search" placeholder="Search W3School" />
姓名：<input type="text" name="姓名" placeholder="姓名"/>
密碼：<input type="password" name="密碼" placeholder="密碼"/>
<input type="submit" />
</form>
</body>
</html>
十三糕篇，type=hidden隱藏域有什么作用? 舉例說明
答：
隱藏域的功能是用來儲存一些表單資訊啄育，而不想要直接顯示在頁面表單上。例如一些特定的參數(shù)拌消，填寫時間戳記挑豌，登入記錄...等，有許多種的應(yīng)用都可以使用隱藏欄位來記錄墩崩。當(dāng)表單提交的時候氓英，隱藏域的值也會傳遞給后端的程序，每一個表單可以安插許多不同名稱的隱藏域泰鸡，傳遞各種表單信息债蓝。
<head>
<title>My Page</title>
</head>
<body>
<form name="myform" action="http://www.mydomain.com/myformhandler.cgi" method="POST">
<div align="center">
<input type="text" size="25" value="Enter your name here!">
<input type="hidden" name="Language" value="English">
<input type="submit" name="submit" value="提交">
</div>
</form>
</body>
</html>
