父元素与子元素之间的margin-top问题(csshack)-创新互联

hack
父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化。
父元素与子元素之间的margin-top问题(css hack)
html代码

创新互联专注于获嘉企业网站建设,响应式网站,购物商城网站建设。获嘉网站建设公司,为获嘉等地区提供建站服务。全流程按需定制网站,专业设计,全程项目跟踪,创新互联专业和态度为您提供的服务

代码如下:



css样式

代码如下:

.box1{height:200px;width:200px;background:gray;}
.box2{height:100px;width:100px;background:gold;margin-top:50px;}

本人测试后的解决方法
1、修改父元素的高度,增加padding-top样式模拟(padding-top:1px;常用)

2、为父元素或者子元素声明浮动(float:left;可用)
3、为父元素添加border(border:1px solid transparent可用)
4、为父元素或者子元素声明绝对定位

创新互联www.cdcxhl.cn,专业提供香港、美国云服务器,动态BGP最优骨干路由自动选择,持续稳定高效的网络助力业务部署。公司持有工信部办法的idc、isp许可证, 机房独有T级流量清洗系统配攻击溯源,准确进行流量调度,确保服务器高可用性。佳节活动现已开启,新人活动云服务器买多久送多久。


标题名称:父元素与子元素之间的margin-top问题(csshack)-创新互联
文章起源:http://bzwzjz.com/article/dhedpj.html

其他资讯

Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号
友情链接: 成都网站制作 手机网站设计 企业网站设计 高端网站设计 重庆外贸网站建设 成都网站建设 成都网站建设公司 成都网站制作 成都网站设计 成都网站建设 网站制作 成都网站制作 网站设计 移动手机网站制作 企业网站建设 温江网站设计 网站制作报价 企业手机网站建设 成都网站建设 LED网站设计方案 成都品牌网站设计 成都网站设计