CSS margin(外边距)属性设置及简介说明


摘要:
下文讲述css中设置外边距的方法分享,如下所示:


css margin简介

在html编码的世界中,一个元素一定存在一个外边框(margin),外边框是没有背景颜色,是一个透明的空间占位符,
我们可以通过设置margin属性的上 下 左 右的距离,使其同其他元素的间隔。

margin--边距说明

margin–边距说明



实现思路:
通过设置margin属性或
单边边距
margin-top —上边距
margin-bottom —下边距
margin-right —右边距
margin-left —左边距
属性
—-这些属性值我们可以放入
auto
length(px pt em等浏览器支持的长度单位)
百分比%
—————–注意事项—————
margin可以快速简写输入外边距
例:
margin:15px 60px 85px 90px;
上边距为15px
右边距为60px
下边距为785px
左边距为90px

margin:15px 60px 55px;
上边距为15px
左右边距为60px
下边距为55px

margin:15px 25px;
上下边距为15px
左右边距为25px

margin:15px;
上下左右4个边距都是15px

例:
设置 元素的外边距

  <html>
<head>
<meta charset="utf-8"> 
<title>猫猫教程(maomao365.com)--设置元素外边距</title> 
<style>
p
{
	background-color:blue;
}
p.margin
{
	margin:90px 20px;
}
</style>
</head>

<body>

<p>无外边距的元素</p>
<p class="margin">设置上下边距90px 左右边距20px</p>

</body>
</html>
css margin 外边距_应用举例

css margin 外边距_应用举例