设为首页收藏本站

九九站长,站长论坛,discuz教程

 找回密码
 立即注册
查看: 763|回复: 0
收起左侧

[div+css技术] 九九站长论坛—css样式的外边距讲解!

[复制链接]

250

主题

344

帖子

3337

积分

九七级-版主

Rank: 7Rank: 7Rank: 7

交易币
1712 枚
发表于 2013-5-12 12:08:36 | 显示全部楼层 |阅读模式

注册加入九九站长论坛,一起交流,学习,分享网站技术,资源等!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
   比如说有两个div,如果没有加任何的浮动,那么默认的就一上一下,如下:

1.jpg

上图是两个div,只给它们添加了宽高的属性,没有浮动,那么他们看上去就是在一起的,如果想让他们分开,可以给div1添加属性:     margin-bottom:10px     意思是说给div1添加下外边距10个像素

或者给div2加属性:   margin-top:10px 意思是说给div2添加向上的边距10个像素
1.jpg
外边距的属性:
  • margin-top                  上外边距
  • margin-right                 右外边距
  • margin-bottom            下外边距
  • margin-left                    左外边距

比如给一个div添加四个边的边距,那么是不是就要添加四个属性,不用那么麻烦,可以这样写:
margin:10px  20px  30px  40px
这是什么意思呢?就相当于:
margin:上 右 下 左
这是顺序,就也叫外边距的合并,方向是逆时针方向,第一个值是上外边距,然后是右,下,左,如果只想控制一个元素的上和右的话,那么可以这样写:
margin:10px  15px  0 0;
这样就只控制了上和右的外边距,其它的不要边距的直接写零;

这中外边距的合并是一次合并了四个值,也可以直接写两个值,如:
margin:10px 20px;
两个值的意思是说第一个值是上下的外边距,第二值是左右的外边距;

也可以合并成写三个值,如:
margin:10px 15px 20px
三个值的意思是所第一个值是上边距,第二值是左右边距  ,第三个值是下边距;

外边距的值总是遵循上,右,下,左的方向,记住!

随便逛逛,增加下人气!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

网上报警岗亭图标

Archiver|手机版|小黑屋|九九站长网 ( 渝ICP备13002263 )  
站长论坛   建站教程   discuz教程   discuz模板下载   网站优化
九九站长论坛版权所有:© 2001-2015;如有侵犯你的权利,请告知!

网警备案图
快速回复 返回顶部 返回列表