css行內(nèi)元素padding,margin,width,height沒有變化
發(fā)布時間:2014-05-07 15:32:07 作者:佚名
我要評論

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