<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS 外邊距</title>
<style>
p{background-color: #FF00FF}
p.a{
margin-top:100px;
margin-bottom:2cm;
margin-right:50px;
margin-left:50px;
}
p.b{
margin: 2em;
}
p.c{
margin: 2em 50px 100px;
}
p.d{
margin: 2em 10%;
}
p.e{
margin: 20px 30px 20px 30px;
}
</style>
</head>
<body>
</body>
<p>這是一個(gè)未指定外邊距的段落</p>
<p class="a">這是一個(gè)指定外邊距的段落</p>
<p class="b">這是一個(gè)指定外邊距的段落</p>
<p class="c">這是一個(gè)指定外邊距的段落</p>
<p class="d">這是一個(gè)指定外邊距的段落</p>
<p class="e">這是一個(gè)指定外邊距的段落</p>
</html>
<!--
CSS margin(外邊距)
CSS margin(外邊距)屬性定義元素周圍的空間。
margin
margin 清除周圍的（外邊框）元素區(qū)域。margin 沒有背景顏色，是完全透明的。
margin 可以單獨(dú)改變元素的上，下，左，右邊距，也可以一次改變所有的屬性
-->
<!--
可能的值
值 說明
auto 設(shè)置瀏覽器邊距。這樣做的結(jié)果會依賴于瀏覽器
length 定義一個(gè)固定的margin（使用像素，pt，em等）
% 定義一個(gè)使用百分比的邊距
Remark Margin可以使用負(fù)值，重疊的內(nèi)容。
-->
<!--
Margin - 單邊外邊距屬性
在CSS中，它可以指定不同的側(cè)面不同的邊距：
實(shí)例
margin-top:100px;
margin-bottom:100px;
margin-right:50px;
margin-left:50px;
-->
<!--
Margin - 簡寫屬性
為了縮短代碼，有可能使用一個(gè)屬性中margin指定的所有邊距屬性。這就是所謂的簡寫屬性。
所有邊距屬性的簡寫屬性是 margin :
實(shí)例
margin:100px 50px;
嘗試一下 ?
margin屬性可以有一到四個(gè)值。
margin:25px 50px 75px 100px;
上邊距為25px
右邊距為50px
下邊距為75px
左邊距為100px
margin:25px 50px 75px;
上邊距為25px
左右邊距為50px
下邊距為75px
margin:25px 50px;
上下邊距為25px
左右邊距為50px
margin:25px;
所有的4個(gè)邊距都是25px
-->
<!--
所有的CSS邊距屬性
屬性 描述
margin 簡寫屬性。在一個(gè)聲明中設(shè)置所有外邊距屬性。
margin-bottom 設(shè)置元素的下外邊距。
margin-left 設(shè)置元素的左外邊距。
margin-right 設(shè)置元素的右外邊距。
margin-top 設(shè)置元素的上外邊距。
-->
CSS 外邊距
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。
