關(guān)于 html 總結(jié)(3)


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)刃鳄。
form測(cè)試.png

9.post 和 get 方式的區(qū)別?

  1. 數(shù)據(jù)提交方式不同钱骂,get把提交的數(shù)據(jù)url可以看到叔锐,post看不到
  2. get一般用于提交少量數(shù)據(jù),post用于提交大量數(shù)據(jù)
  3. get最多提交1k數(shù)據(jù)见秽,瀏覽器的限制愉烙。post理論上無限制,受服務(wù)器限制解取。
  4. 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)米母。

type=hidden測(cè)試.png

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市毡琉,隨后出現(xiàn)的幾起案子铁瞒,更是在濱河造成了極大的恐慌,老刑警劉巖桅滋,帶你破解...
    沈念sama閱讀 222,729評(píng)論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件慧耍,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡丐谋,警方通過查閱死者的電腦和手機(jī)芍碧,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,226評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來号俐,“玉大人泌豆,你說我怎么就攤上這事±舳觯” “怎么了踪危?”我有些...
    開封第一講書人閱讀 169,461評(píng)論 0 362
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)猪落。 經(jīng)常有香客問我贞远,道長(zhǎng),這世上最難降的妖魔是什么许布? 我笑而不...
    開封第一講書人閱讀 60,135評(píng)論 1 300
  • 正文 為了忘掉前任兴革,我火速辦了婚禮,結(jié)果婚禮上蜜唾,老公的妹妹穿的比我還像新娘杂曲。我一直安慰自己,他們只是感情好袁余,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,130評(píng)論 6 398
  • 文/花漫 我一把揭開白布擎勘。 她就那樣靜靜地躺著,像睡著了一般颖榜。 火紅的嫁衣襯著肌膚如雪棚饵。 梳的紋絲不亂的頭發(fā)上煤裙,一...
    開封第一講書人閱讀 52,736評(píng)論 1 312
  • 那天,我揣著相機(jī)與錄音噪漾,去河邊找鬼甚负。 笑死,一個(gè)胖子當(dāng)著我的面吹牛磅废,可吹牛的內(nèi)容都是我干的映穗。 我是一名探鬼主播,決...
    沈念sama閱讀 41,179評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼诈胜,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼豹障!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起焦匈,我...
    開封第一講書人閱讀 40,124評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤血公,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后缓熟,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體累魔,經(jīng)...
    沈念sama閱讀 46,657評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,723評(píng)論 3 342
  • 正文 我和宋清朗相戀三年够滑,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了薛夜。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,872評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡版述,死狀恐怖梯澜,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情渴析,我是刑警寧澤晚伙,帶...
    沈念sama閱讀 36,533評(píng)論 5 351
  • 正文 年R本政府宣布,位于F島的核電站俭茧,受9級(jí)特大地震影響咆疗,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜母债,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,213評(píng)論 3 336
  • 文/蒙蒙 一午磁、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧毡们,春花似錦迅皇、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,700評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至红氯,卻和暖如春框咙,著一層夾襖步出監(jiān)牢的瞬間咕痛,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,819評(píng)論 1 274
  • 我被黑心中介騙來泰國打工喇嘱, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留茉贡,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 49,304評(píng)論 3 379
  • 正文 我出身青樓者铜,卻偏偏與公主長(zhǎng)得像块仆,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子王暗,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,876評(píng)論 2 361

推薦閱讀更多精彩內(nèi)容

  • 瀏覽器與服務(wù)器的基本概念 瀏覽器(安裝在電腦里面的一個(gè)軟件) 作用: ①將網(wǎng)頁內(nèi)容渲染呈現(xiàn)給用戶查看。 ②讓用戶通...
    云還灬閱讀 1,128評(píng)論 0 0
  • 一庄敛,有序列表俗壹、無序列表、自定義列表如何使用藻烤?寫個(gè)簡(jiǎn)單的例子绷雏。三者在語義上有什么區(qū)別?在哪些情況下使用哪種(重要)怖亭?...
    kingBirds閱讀 827評(píng)論 0 0
  • html是什么:超文本標(biāo)記語言 html的唯一作用就是:給指定的文本添加語義涎显。 html的標(biāo)準(zhǔn)格式: <!DOCT...
    Lins7閱讀 1,000評(píng)論 0 2
  • 語義化、行內(nèi)元素塊級(jí)元素兴猩、POST 和 GET 的區(qū)別 Version two 熟悉列表的使用場(chǎng)景和用法 理解HT...
    吳晗君閱讀 831評(píng)論 0 0
  • Task7 Version two 問答 一期吓、有序列表、無序列表倾芝、自定義列表如何使用讨勤?寫個(gè)簡(jiǎn)單的例子。三者在語義上...
    吳晗君閱讀 800評(píng)論 0 0