04.CSS中margin的使用技巧

565 阅读1分钟

一.水平居中

1.设置margin属性为:

2.距离上100px,左右自动,距离下边距100px

margin: 100px auto 100px;

二.margin实现贴边:

1.在HTMLbody自带的CSS样式有8pxmargin

2.将HTMLbody自带的margin设置为0

body{
    margin:0;
}

3.再将需要贴边的内容margin再次设置为0即可贴边

三.将margin属性设置为负数实现去重叠:

1. 此代码效果如下

2. 将6个盒子的border设置为1时,导致了上边框与下边border框重合

3.设置元素margin-top为**-1**:

4.再次看效果,border2变为1,由于**-1pxmargin-top属性使其上移1px导致,而margin-bottom**不变。

实现了去边重合。