1. 首页
  2. 网站建设
  3. 其他知识

CSS中Margin和Padding简单介绍

今天章郎虫对哈罗网吧的模板稍微修改了一下。在修改时需要用到css代码的添加或者修改,我学到了Margin和Padding两个属性的区别及简单用法。下面内容是我整理的有关这两个属性的用法,希望对朋友们有帮助。

1、Margin

Margin是指层的边框以外留的空白,用于页边距或者与其它层制造一个间距。Margin又包括margin-top,margin-right,margin-bottom和margin-left,分别表示上,右,下,左四个方向。你可以分别用这四个属性定义,也可以使用下面的简写规则。

margin: 10px 10px 10px 10px ;代表上右下左(顺时针方向)四个边距都是10px,也可以缩写成Margin: 10px;

当上下, 左右margin值分别一致, 可简写为:margin: 10px 10px;前一个10px代表上下margin值, 后一个10px代表左右margin值 。

当上下左右margin值均一致, 可简写为:margin: 10px;

如果边距为零,要写成Margin: 0px;。这里需要注意:当值是零时,除了RGB颜色值0%必须跟百分号,其他情况后面可以不跟单位”px”。Margin是透明元素,不能定义颜色。

2、Padding

Padding是指层的边框到层的内容之间的空白,主要控制块级元素内部,content与border之间的距离。Padding和Margin一样,也包括padding-top,padding-right,padding-bottom,padding-left四个属性。代码和简写都和Margin一样,可以参考以上的介绍。

Padding也是透明元素,不能定义颜色。

经过我简单的介绍,和我一样的童鞋们在看css文件代码时对Margin和Padding两个属性的意义和区别是不是清楚些了?

联系我们

0574-55011290

QQ:248687950

邮件:admin@nbhao.org

工作时间:周一至周五,9:00-18:00,节假日休息

QR code