這篇文章主要介紹css3中邊距屬性有哪些,文中介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們一定要看完!
創(chuàng)新互聯(lián)于2013年創(chuàng)立,先為浮山等服務建站,浮山等地企業(yè),進行企業(yè)商務咨詢服務。為浮山企業(yè)網(wǎng)站制作PC+手機+微官網(wǎng)三網(wǎng)同步一站式服務解決您的所有建站問題。
css3的兩種邊距屬性:1、內(nèi)邊距屬性(padding、padding-top等),可設置元素邊框與元素內(nèi)容之間的空間;2、外邊距屬性(margin、margin-top等),可設置元素周圍的空間。
本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
css3的邊距分為兩種:
內(nèi)邊距(padding):元素邊框與元素內(nèi)容之間的空間
外邊距(margin):元素周圍的空間
.jpg)
內(nèi)邊距屬性
| 屬性 | 說明 |
|---|---|
| padding | 使用簡寫屬性設置在一個聲明中的所有填充屬性 |
| padding-bottom | 設置元素的底部填充 |
| padding-left | 設置元素的左部填充 |
| padding-right | 設置元素的右部填充 |
| padding-top | 設置元素的頂部填充 |
示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p
{
background-color:yellow;
}
p.padding
{
padding:25px 50px;
}
</style>
</head>
<body>
<p>這是一個沒有指定內(nèi)邊距的段落。</p>
<p class="padding">這是一個指定內(nèi)邊距的段落。</p>
</body>
</html>
外邊距屬性
| 屬性 | 描述 |
|---|---|
| margin | 簡寫屬性。在一個聲明中設置所有外邊距屬性。 |
| margin-bottom | 設置元素的下外邊距。 |
| margin-left | 設置元素的左外邊距。 |
| margin-right | 設置元素的右外邊距。 |
| margin-top | 設置元素的上外邊距。 |
示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p
{
background-color:yellow;
}
p.margin
{
margin:100px 50px;
}
</style>
</head>
<body>
<p>這是一個沒有指定外邊距大小的段落。</p>
<p class="margin">這是一個指定外邊距大小的段落。</p>
</body>
</html>
以上是“css3中邊距屬性有哪些”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對大家有幫助,更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
分享文章:css3中邊距屬性有哪些
文章路徑:http://www.chinadenli.net/article44/gpohhe.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供外貿(mào)網(wǎng)站建設、虛擬主機、定制網(wǎng)站、移動網(wǎng)站建設、定制開發(fā)、
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)