margin,是CSS语法,这个简写属性用于在一个声明中设定所有当前或者指定元素所有外边距的宽度,或者设定各边上外边距的宽度。
margin 简写属性在一个声明中设定所有当前或者指定元素外边距属性。该属性可以有 1 到 4 个值。margin 属性接受任何长度单位、百分数值甚至负值。margin 属性可以单独改变元素的上,下,左,右边距。也可以一次改变所有的属性。
margin跟padding一样,也有简洁写法。我们可以使用margin属性来设定四个方向的外边距。在实际编程中,我们往往使用的是margin的这种高效简洁写法来编程。margin写法有3种,分别如下:
margin:像素值; margin:像素值1 像素值2; margin:像素值1 像素值2 像素值3 像素值4;
例如:“margin:20px;”表示四个方向的外边距都是20px;“margin:20px 40px;”表示margin-top和margin-bottom为20px,margin-right和margin-left为40px。“margin:20px 40px 60px 80px;”表示margin-top为20px,margin-right为40px,margin-bottom为60px,margin-left为80px。大家按照顺时针方向记忆就可以了。
这个简写属性设定一个元素所有外边距的宽度,或者设定各边上外边距的宽度。块级元素的垂直相邻外边距会合併,而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合併。同样地,浮动元素的外边距也不会合併。允许指定负的外边距值,不过使用时要小心。
margin:5px auto;意思上下为5,左右平均居中margin-top: 20px; 上外边距margin-right: 30px; 右外边距margin-bottom: 30px;下外边距margin-left: 20px; 左外边距margin:1px 四边统一边距margin:1px 1px 上下边距,左右边距margin:1px 1px 1px 上,左右,下边距margin:1px 1px 1px 1px 上,右,下,左边距注释:允许使用负值。
例子 1margin:10px 5px 15px 20px;上外边距是 10px右外边距是 5px下外边距是 15px左外边距是 20px例子 2margin:10px 5px 15px;上外边距是 10px右外边距和左外边距是 5px下外边距是 15px例子 3margin:10px 5px;上外边距和下外边距是 10px右外边距和左外边距是 5px例子 4margin:10px;所有 4 个外边距都是 10px
设定 p 元素的 4 个外边距:p { margin:2cm 4cm 3cm 4cm; }
所有浏览器都支持 margin 属性。注释:任何的版本的 Internet Explorer(包括 IE8)都不支持属性值 "inherit"。
这是很多学html 人的困扰其实说白了padding就是内容与框线的空隙.而margin 则是模组与模组的空隙.下面图解:
本例演示如何将所有的边距属性设定于一个声明中。
<html><head><style type="text/css">p.margin{margin:50px100px75px100px}</style></head><body><p>这个段落没有指定外边距。</p><p class="margin">这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。这个段落带有指定的外边距。</p><p>这个段落没有指定外边距。</p></body></html>
本文发布于:2023-03-25 10:14:32,感谢您对本站的认可!
本文链接:http://www.ranqi119.com/to/1679805949227183.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
留言与评论(共有 0 条评论) |