css行內(nèi)元素padding,margin,width,height沒有變化
發(fā)布時(shí)間：2014-05-07 15:32:07 作者：佚名 
我要評(píng)論
我要評(píng)論這篇文章主要介紹了css行內(nèi)元素設(shè)置padding,margin,width,height沒有變化的解決方法，需要的朋友可以參考下
要點(diǎn)：
塊狀元素前后元素會(huì)換行
行內(nèi)元素前后元素不會(huì)換行
第一：行內(nèi)元素與寬度
寬度不起作用
span {
width:200px;
}
沒有變化
第二：行內(nèi)元素與高度
高度不起作用
span{
height:200px;
}
沒用變化
第三：行內(nèi)元素與padding,margin
span{
padding:200px;
}
影響左右，不影響上下
如何實(shí)現(xiàn)
<ul>
<li>第一</li>
<li>第一</li>
<li>第一</li>
</ul>
中的li在同一行顯示并有上下邊距呢,
如果用display:inline，可行讓其在一行內(nèi)顯示，但上下padding不起作用。
所以這種情況下用float:left;使其在一行內(nèi)顯示，并且其還是block元素，可以用
padding使與上下padding起作用，差生一定距離
塊狀元素前后元素會(huì)換行
行內(nèi)元素前后元素不會(huì)換行
第一：行內(nèi)元素與寬度
寬度不起作用
復(fù)制代碼
代碼如下:span {
width:200px;
}
沒有變化
第二：行內(nèi)元素與高度
高度不起作用
復(fù)制代碼
代碼如下:span{
height:200px;
}
沒用變化
第三：行內(nèi)元素與padding,margin
復(fù)制代碼
代碼如下:span{
padding:200px;
}
影響左右，不影響上下
如何實(shí)現(xiàn)
復(fù)制代碼
代碼如下:<ul>
<li>第一</li>
<li>第一</li>
<li>第一</li>
</ul>
中的li在同一行顯示并有上下邊距呢,
如果用display:inline，可行讓其在一行內(nèi)顯示，但上下padding不起作用。
所以這種情況下用float:left;使其在一行內(nèi)顯示，并且其還是block元素，可以用
padding使與上下padding起作用，差生一定距離
相關(guān)文章
CSS中height和width在IE和其他瀏覽器中的區(qū)別圖文詳解
這篇文章主要介紹了CSS中height和width在IE和其他瀏覽器中的區(qū)別，需要的朋友可以參考下2014-05-12IE6不支持CSS中的min-width/height屬性問題的解決方法
min-width與min-height在css中是相當(dāng)好用的語法，可以讓HTML元素最少仍保持一定的寬和高，而需要時(shí)仍隨著元素的內(nèi)容增加寬和高。2009-09-08- 關(guān)鍵字描述：最大 圖片 控制 這個(gè) var // 寬度 maxwidth if 科汛CMS官方模板中自帶了一段JS用來控制文章中的圖片的最大高度和寬度。不過我也很奇怪，為什么這個(gè)j2009-06-06
整體上看是一本不錯(cuò)的讀物,首先他的編寫結(jié)構(gòu)相當(dāng)清晰,章節(jié)不多,每一章都是逐步深入,非常值得一讀2020-10-12
