CSS中margin外边距如何设置,要点有哪些
Admin 2022-08-01 群英技术资讯 548 次浏览
使用说明
1、用来增加元素间距的,外边距跟边框一样,分为上、右、下、左4个方向的边距。
2、margin可以沿着四个不同的方向(top,right,bottom,left)添加,所以在深入研究示例和用例之前,一定要阐明一些基本概念,这一点非常重要。
实例
<!--设置元素的外边距,是让当前元素和四周的元素产生距离,默认各元素的外边距是0,即两个div是贴合在一起的--> div{ width: 200px; height: 200px; } .box1{ background: red; <!--设置元素box1的下外边距,让box1的下方和box2的上方有20px的距离--> margin-bottom: 20px; <!--如果设置两个值得话,那么第一个值代表上下,第二个值代表左右,padding同理--> //margin-bottom: 20px 50px; <!--用外边距设置元素水平居中,不能垂直居中--> //margin: auto; <!--margin还可以设置负值,使当前元素和另一元素边框合并,或者覆盖另一元素--> //margin-top: -100px; } .box2{ background: blue; } <div><div> <div></div>
本文教程操作环境:windows7系统、css3版,DELL G3电脑。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
我们在网页设计时,展示图片的方法有很多,可以做成列表图片,轮播图片,幻灯片图片等等,这篇文章就分享用CSS3实现3D翻牌效果的图片展示,效果如下图所示,感兴趣的朋友继续往下看吧。
css渐进增强的理解:1、为低版本浏览器构建页面,保证最基本的功能,然后对高级浏览器进行效果、交互等改进,增加功能。2、渐进增强认为应该关注内容本身。
这篇文章主要介绍了CSS3 不定高宽垂直水平居中的几种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
这篇文章主要介绍了使用CSS混合模式和SVG来动态更改产品图片的颜色,需要的朋友可以参考下
这篇文章主要介绍了css模块化方案,css的模块化方案可能和js的一样多,下面简单介绍几种主要的模块方案,非常具有实用价值,需要的朋友可以参考下
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008