1.有序列表、無序列表蒿囤、自定義列表如何使用?寫個(gè)簡(jiǎn)單的例子崇决。三者在語義上有什么區(qū)別材诽?在哪些情況下使用哪種(重要)?
-
有序列表 使用在 需要有先后順序的工作恒傻,代碼是
<ol> <li>a</li> <li>b</li> </ol>
-
無序列表 使用在沒有先后順序的工作 代碼是
<ul> <li>a</li> <li>b</li> </ul>
-自定義列表是一列項(xiàng)目脸侥,而是項(xiàng)目及其注釋的組合。
<dl>
<dt>a</dt>
<dd>a1</dd>
<dd>a2</dd>
<dt>b</dt>
<dd>b1</dd>
</dl>
![Uploading 嵌套測(cè)試_799533.png . . .]
](http://upload-images.jianshu.io/upload_images/1974686-94583b02bb0c56e6.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
2.如何去除列表前面的點(diǎn)或者數(shù)字盈厘?
list-style:none
3.class 和 id 有什么區(qū)別睁枕?什么時(shí)候用 class 什么時(shí)候用 id?
值 | 屬性 | 適用范圍 |
---|---|---|
class | 元素類名沸手,用于指向樣式表中的類外遇,權(quán)重為10,css以.為開頭 | 最好在結(jié)構(gòu)內(nèi)部使用 |
id | 具有唯一性契吉,類似于身份證跳仿,權(quán)重為100,css以#開頭 | 最好在搭建結(jié)構(gòu)時(shí)使用 |
4.塊級(jí)元素捐晶、行內(nèi)元素是什么菲语?有什么區(qū)別?分別對(duì)應(yīng)哪些常用標(biāo)簽惑灵?
元素 | 屬性 | 標(biāo)簽 |
---|---|---|
塊級(jí)元素 | 占用空間是一整行,不能并排顯示山上,能適用于line-heighjt,padding,margin,text-align,display顯示為block | div英支、p佩憾、h1...h6、table干花、tr妄帘、ul、li把敢、dl、dt谅辣、form |
行內(nèi)元素 | 占用空間是它自身的內(nèi)容寬度,但是在左右padding和margin可以生效修赞,并且可以并排顯示,display顯示為inline | a、span柏副、img勾邦、input、button割择、em眷篇、textarea |
5.display: block、display: inline荔泳、display: inline-block分別有什么作用?
屬性 | 作用 |
---|---|
display:block | 變?yōu)閴K級(jí)元素 |
display:inline | 變?yōu)樾袃?nèi)元素 |
display:inline-block | 將對(duì)象呈遞為內(nèi)聯(lián)對(duì)象蕉饼,但是對(duì)象的內(nèi)容作為塊對(duì)象呈遞。旁邊的內(nèi)聯(lián)對(duì)象會(huì)被呈遞在同一行內(nèi)玛歌,允許空格昧港。 (準(zhǔn)確地說,應(yīng)用此特性的元素呈現(xiàn)為內(nèi)聯(lián)對(duì)象支子,周圍元素保持在同一行创肥,但可以設(shè)置寬度和高度地塊元素的屬性,也就是說你在這個(gè)后面寫一個(gè)元素這個(gè)元素會(huì)并排顯示值朋。block為塊元素叹侄,單獨(dú)占一行文檔,并可以給這個(gè)塊元素添加寬高背景顏色昨登。而inline-block是使這個(gè)元素同時(shí)保持不占文檔流的情況下又可以作為塊元素來寫入 |
6.下面代碼是做什么的趾代?抄寫一遍下面的代碼,注意class和id的使用及命名方式
這個(gè)代碼是大體布局的界面篙骡,框架大體分為header,content,footer稽坤,用id劃分,小的框架內(nèi)部使用wrap糯俗,nav(導(dǎo)航)尿褪,aside(側(cè)邊欄),main(中心板塊),用class劃分
7.如何理解 HTML CSS 語義化? 在平時(shí)寫代碼的過程中要注意哪些細(xì)節(jié)得湘。
1杖玲、“語義化”指的是機(jī)器在需要更少的人類干預(yù)的情況下能夠研究和收集信息,讓網(wǎng)頁能夠被機(jī)器理解淘正,最終讓人類受益摆马。
2、語義化的主要目的就是讓大家直觀的認(rèn)識(shí)標(biāo)簽(markup)和屬性(attribute)的用途和作用
3鸿吆、根據(jù)內(nèi)容的結(jié)構(gòu)化(內(nèi)容語義化)囤采,選擇合適的標(biāo)簽(代碼語義化)便于開發(fā)者閱讀和寫出更優(yōu)雅的代碼的同時(shí)讓瀏覽器的爬蟲和機(jī)器很好地解析。
因此惩淳,在我看來蕉毯,所謂語義化就是乓搬,標(biāo)簽標(biāo)準(zhǔn),id,class通俗標(biāo)準(zhǔn)代虾,代碼規(guī)范进肯,排版漂亮,這也是平時(shí)寫代碼過程中注意的問題
8.form表單有什么作用棉磨?有哪些常用的input 標(biāo)簽江掩,分別有什么作用?
<form>用于把用戶輸入的數(shù)據(jù)提交到后臺(tái)
<input>標(biāo)簽:
- type="text": 用于輸入文本 placeholder屬性(可選)展示的是輸入框里的提示乘瓤,maxlength(可選)限制最大輸入長(zhǎng)度环形;
- type="password": 用于輸入密碼 ,所屬入的密碼用***表示
- type="radio": 單選圓圈按鈕 注意:name要相同才能實(shí)現(xiàn)單選馅扣,value要有值
- type="checkbox": 復(fù)選框斟赚。加checked屬性會(huì)默認(rèn)選上。提交時(shí)差油,如果選中(如bike)拗军,則bike=ontype="textarea": 文本域,用于輸入多行文本
- type="hidden": 隱藏域蓄喇,用戶看不到发侵,用于暫存數(shù)據(jù)∽逼或者安全性校驗(yàn)刃鳄。
9.post 和 get 方式的區(qū)別?
- 數(shù)據(jù)提交方式不同钱骂,get把提交的數(shù)據(jù)url可以看到叔锐,post看不到
- get一般用于提交少量數(shù)據(jù),post用于提交大量數(shù)據(jù)
- get最多提交1k數(shù)據(jù)见秽,瀏覽器的限制愉烙。post理論上無限制,受服務(wù)器限制解取。
- get提交的數(shù)據(jù)在瀏覽器歷史記錄中步责,安全性不好
10.在input里,name 有什么作用禀苦?
name 表示表單提交時(shí)的名稱蔓肯,通俗說就是經(jīng)過傳遞信息后的名稱標(biāo)注,你設(shè)置成什么振乏,傳遞后就顯示為什么蔗包,只有設(shè)置了 name 屬性的表單元素才能在提交表單時(shí)傳遞它們的值。
11<button>提交</button>慧邮、<a class="btn" href="#">提交</a>调限、<input type="submit" value="提交">三者有什么區(qū)別邻储?
- <button>提交</button> 只是一個(gè)單純的名為提交的按鈕,單擊并沒有反應(yīng)
- <a class="btn" href="#">提交</a> 是一個(gè)名為提交超鏈接旧噪,按提交后轉(zhuǎn)到所需要的url
- <input type="submit" value="提交"> 按提交后會(huì)把<form>的數(shù)據(jù)提交到action的位置上,也就是傳到后臺(tái)
12.radio 如何 分組?
<div>sex:
<input name="sex" type=radio value="man" />男
<input name="sex" type=radio value="woman" />女
</div>
13.placeholder 屬性有什么作用?
作是輸入框里的提示
14.type=hidden隱藏域有什么作用? 舉例說明
用于暫存數(shù)據(jù)脓匿√灾樱或者安全性校驗(yàn)
當(dāng)我輸入:<input name="test" type="hidden" value="#.php" />
頁面并不會(huì)顯示出來,但提交form后會(huì)顯示出來陪毡,用于安全校驗(yàn)米母。