對(duì)display:inline與float:left正確含義的認(rèn)識(shí)!_CSS教程
教程Tag:暫無(wú)Tag,歡迎添加,賺取U幣!
首先我們要明確,display:inline;與float:left;正確含義。display:inline;(內(nèi)聯(lián))《CSS權(quán)威指南》中文字顯示:任何不是塊級(jí)元素的可見元素都是內(nèi)聯(lián)元素。其表現(xiàn)的特性是“行布局”形式,這里的“行布局”的意思就是說(shuō)其表現(xiàn)形式始終以行進(jìn)行顯示。比如,我們?cè)O(shè)定一個(gè)內(nèi)聯(lián)元素border-bottom:1px solid #000;時(shí)其表現(xiàn)是以每行進(jìn)行重復(fù),每一行下方都會(huì)有一條黑色的細(xì)線。假如是塊級(jí)元素那么所顯示的的黑線只會(huì)在塊的下方出現(xiàn)。
當(dāng)然這看起來(lái)不像是display:inline;與float:left;的區(qū)別所在,但是當(dāng)理解了float:left;的特性那么我們就清楚到底是怎么回事了。float:left;(左浮動(dòng))他使得指定元素脫離普通的文檔流而產(chǎn)生的非凡的布局特性。并且FLOAT必需應(yīng)用在塊級(jí)元素之上,也就是說(shuō)浮動(dòng)并不應(yīng)用于內(nèi)聯(lián)標(biāo)簽。或者換句話來(lái)說(shuō)當(dāng)應(yīng)用了FLOAT那么這個(gè)元素將被指定為塊級(jí)元素。
那么我們很清楚了,內(nèi)聯(lián)(display:inline;)元素不能設(shè)置寬高,因?yàn)閮?nèi)聯(lián)屬于行布局,其特性是在一行里進(jìn)行布局,所以不能被設(shè)定寬高。
當(dāng)然這看起來(lái)不像是display:inline;與float:left;的區(qū)別所在,但是當(dāng)理解了float:left;的特性那么我們就清楚到底是怎么回事了。float:left;(左浮動(dòng))他使得指定元素脫離普通的文檔流而產(chǎn)生的非凡的布局特性。并且FLOAT必需應(yīng)用在塊級(jí)元素之上,也就是說(shuō)浮動(dòng)并不應(yīng)用于內(nèi)聯(lián)標(biāo)簽。或者換句話來(lái)說(shuō)當(dāng)應(yīng)用了FLOAT那么這個(gè)元素將被指定為塊級(jí)元素。
那么我們很清楚了,內(nèi)聯(lián)(display:inline;)元素不能設(shè)置寬高,因?yàn)閮?nèi)聯(lián)屬于行布局,其特性是在一行里進(jìn)行布局,所以不能被設(shè)定寬高。
相關(guān)CSS教程:
CSS教程Rss訂閱Div+Css教程搜索
CSS教程推薦
- CSS:清除浮動(dòng)的最優(yōu)方法
- 實(shí)用CSS教程:從基礎(chǔ)開始(二)
- 符合WEB標(biāo)準(zhǔn)的語(yǔ)義化CSS
- 符合web標(biāo)準(zhǔn)的嵌入Flash的方法
- CSS教程:使用恰當(dāng)?shù)腦HTML元素及避免過(guò)多的使用div與span
- CSS教程1、CSS的應(yīng)用[翻譯Htmldog]
- 在DW中進(jìn)行CSS編碼的技巧
- 巧妙運(yùn)用CSS立刻改變鼠標(biāo)的樣式
- CSShack的一些思考我們?cè)撊绾蚊鎸?duì)它?
- CSS教程12、CSS的BackgroundImages背景圖片[翻譯Htmldog]
猜你也喜歡看這些
- XHTML教程:Doctype文檔類型聲明必不可少!
- HTML表格標(biāo)記教程(25):行的垂直對(duì)齊屬性VALIGN
- HTML表格標(biāo)記教程(23):行的暗邊框色屬性BORDERCOLORDARK
- HTML5isnowalsohostedbytheW3C
- HTMLDOCTYPEDefinitionandUsage-doctype的定義及用法
- HTML高級(jí)教程親和力的連接
- XHTML編碼七條基本規(guī)范
- 將XHTML CSS頁(yè)面轉(zhuǎn)換為打印機(jī)頁(yè)面
- html元素xhtml文檔根元素特性小結(jié)
- HTML表單標(biāo)記教程(5):文字域標(biāo)記
- 相關(guān)鏈接:
復(fù)制本頁(yè)鏈接| 搜索對(duì)display:inline與float:left正確含義的認(rèn)識(shí)!
- 教程說(shuō)明:
CSS教程-對(duì)display:inline與float:left正確含義的認(rèn)識(shí)!
。