HTML中的外边距样式属性和内边距样式属性

外边距样式

margin：，设置外边框对外的距离（外边距）。
margin-top：设置元素的上外边距。
margin-right：设置元素的右外边距。
margin-bottom：设置元素的下外边距。
margin-left：设置元素的左外边距。

<p>PERFECT</p>
<span>GOOD</span>
<b>GREAT</b>
<i>NICE</i>
<style>

	p{
		margin:20px;//上下左右外边距为20px
	}

	span{
		margin:20px,10px;//上下外边距为20px,左右外边距为10px
	}

	b{
		margin:20px,10px,30px;//上外边距为20px，左右外边距为10px，下外边距为30px
	}

	i{
		margin:20px,10px,30px,40px;//上外边距为20px，右外边距为10px，下外边距为30px,左外边距为40px
	}

	margin:0 auto;//水平居中，auto：自适应
	
</style>

内边距样式

padding：，设置外边框内元素对边框的距离（内边距）。
padding-top：设置元素的上内边距。
padding-right：设置元素的右内边距。
padding-bottom：设置元素的下内边距。
padding-left：设置元素的左内边距。

<p>PERFECT</p>
<span>GOOD</span>
<b>GREAT</b>
<i>NICE</i>
<style>

	p{
		padding:20px;//上下左右内边距为20px
	}

	span{
		padding:20px,10px;//上下内边距为20px,左右内边距为10px
	}

	b{
		padding:20px,10px,30px;//上内边距为20px，左右内边距为10px，下内边距为30px
	}

	i{
		margin:20px,10px,30px,40px;//上内边距为20px，右内边距为10px，下内边距为30px,左内边距为40px
	}
</style>