css中margin和padding的使用

转自:http://blog.csdn.net/limengmeng9006/article/details/8162350

1、设置属性方法

   margin和padding都是用来隔开元素,margin用于布局元素使元素与元素互不相干,padding是用于元素与内容之间的间隔。元素四边可以设置的属性:margin-top,margin-right,margin-bottom,margin-left,padding-top,padding-right,padding-bottom和padding-left。还可以按照上、右、下、左的顺序分别设置各边的边距,各边均可以使用不同的单位或百分比值:比如p{padding:10px 0.25em 2ex 20%}.

2、什么时候用margin,什么时候用padding

   margin和padding在许多地方往往达到的效果都是一模一样的,所以有时我们会迷惑margin和padding应当什么时候用哪个比较好。

何时应当使用margin:

(1)需要在border外侧添加空白时,

(2)空白处不需要有背景(色)时,

(3)上下相连的两个盒子之间的空白需要相互抵消时,比如15px+20px的margin,将得到20px的空白(注意地方见第三点)。

何时应当使用padding

(1)需要在border内侧添加空白时(往往是文字与边框距离的设置),

(2)空白处需要背景(色)时,

(3)上下相连的两个盒子之间的空白希望等于两者之和时,比如15px+20px的padding,将得到35px的空白。

3、margin使用时应该注意的地方

margin在垂直方向上相邻的值相同时会发生叠加,水平方向上相邻的值会相加。margin取负值时,在垂直方向上,两个元素的边界仍然会重叠。但是,此时一个为正值,一个为负值,并不是取其中较大的值,而是用正边界减去负边界的绝对值,也就是说,把正的边界值和负的边界值相加。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值