Padding與line-height的區(qū)別
你對Padding屬性與line-height的區(qū)別是否了解,這里向大家描述一下,其實padding是布局設(shè)置,對容器進(jìn)行內(nèi)邊距定義。而line-height是行距設(shè)置,設(shè)置對象(如文本)的行高。
Padding屬性與line-height的區(qū)別
最近有朋友提出一個問題,padding與line-height的區(qū)別。這是CSS基礎(chǔ)知識,對盒模型知識與布局以及相關(guān)屬性不是很了解的時候,是很容易混淆與分不清楚的。其實padding是布局設(shè)置,對容器進(jìn)行內(nèi)邊距定義。而line-height是行距設(shè)置,設(shè)置對象(如文本)的行高。
Padding屬性簡介
padding是內(nèi)補丁也叫內(nèi)邊距,也稱為填充,padding 簡寫屬性在一個聲明中設(shè)置所有內(nèi)邊距屬性。
檢索或設(shè)置對象四邊的補丁邊距。
語法:padding:padding-top|padding-right|padding-bottom|padding-left
說明:檢索或設(shè)置對象四邊的內(nèi)補丁。對于td和th對象而言默認(rèn)值為1。其他對象的默認(rèn)值為0。
參數(shù):length:長度值;%:百分比,由父元素寬度決定
初始值:對于td和th對象而言默認(rèn)值為1。其他對象的默認(rèn)值為0。
繼承性:不可繼承
注釋:不允許使用負(fù)值。
如果提供全部四個參數(shù)值,將按上-右-下-左的順序作用于四邊。
如果只提供一個,將用于全部的四條邊。
如果提供兩個,***個用于上-下,第二個用于左-右。
如果提供三個,***個用于上,第二個用于左-右,第三個用于下。
內(nèi)聯(lián)對象要使用該屬性,必須先設(shè)定對象的height或width屬性,或者設(shè)定position屬性為absolute,且不允許負(fù)值。
line-height是行高
檢索或設(shè)置對象的行高。即字體***端與字體內(nèi)部頂端之間的距離。
如行內(nèi)包含多個對象,則應(yīng)用***行高。此時行高不可為負(fù)值。
也就是文本的行距。文本通常是一行或多行組成的,表示各行之間的距離。
例如:
- <p>網(wǎng)頁教學(xué)網(wǎng)--中國網(wǎng)頁設(shè)計,網(wǎng)頁制作***站</p>
或
- <div>網(wǎng)頁教學(xué)網(wǎng)--中國網(wǎng)頁設(shè)計,網(wǎng)頁制作***站</div>
- p,div{
- padding-top:40px;
- line-height:200%;
- }
最終的效果如圖所示:
【編輯推薦】
- CSS教程:詳解margin和padding屬性應(yīng)用場合
- 微軟展示IE9瀏覽器 力推IE8將取代IE6市場
- 探究IE和Firefox下的2款HTTP調(diào)試工具用法
- CSS中padding和margin屬性用法說明
- 實現(xiàn)IE6、IE7、IE8多版本瀏覽器共存的五種方法