51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
信创认证
公众号矩阵
移动端
视频课 免费课 排行榜 短视频 直播课 软考学堂
全部课程 软考 信创认证 华为认证 厂商认证 IT技术 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库
CKA（Kubernetes 管理员认证）精品班
按照企业k8s需求进行技能培训，帮助用户快速拿下CKA认证，K8S采用新版本进行授课，课程内容全、讲解详细 。 免费试学
软考高级：系统架构设计师精品班
根据考试大纲对知识点、高频考点进行深入讲解，传授答题技巧及判断标准，助力高效备考。 免费试学
信创认证：系统架构师精品班（高级）
信息技术应用创新人才考试评价 免费试学

css中margin-top/margin-bottom失效
要设置这两个值，我的理解应该在这个div的父容器中设置了固定宽高，或者设置了绝对定位，比如position:absolute（绝对定位） 或者压根不用，直接用padding-top/padding-bottom替代 参考： http://www.111cn.net/cssdiv/163/87752.
css
绝对定位
.net
宽高
技术
转载
mb5fe190f8e35a0
2016-12-12 02:33:00
414阅读
2评论

CSS--解决margin塌陷(margin-top失效)--实例
当2个垂直外边距相遇时，他们将合并为一个外边距。合并之后的外边距的高度等于2个发生合并的外边距的高度中的较大值。下述场景会导致margin合并：当一个元素包含在另一个元素中时（假设没有内边距或边框把外边距分隔开），它们的上/下外边距会发生合并。
css
前端
html
外边距
解决方案
原创
IT利刃出鞘
2022-02-15 15:44:25
528阅读

CSS margin-top,margin-bottom 的理解和应用
CSS margin-top,margin-bottom 的理解和应用
margin-top margin-b
原创
mybabe0312
2015-11-18 11:40:38
7755阅读

解决margin-top无效问题
当两个空的块级元素嵌套时，如果内部的块设置有margin top属性，而且父元素没有下边解决方法所述的特征，那么内部块的margin top属性会绑架父元素（即将margin top传递凌驾给了父元素）。 html css
解决方法
ide
块级元素
css
html
原创
TBHacker
2021-08-05 15:51:51
227阅读

margin-top不生效原因
margin-top不生效原因
边距
css
伪元素
原创
mb655383be435e4
2023-11-29 21:56:14
192阅读

嵌套的margin-top无效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf- Read More
样式
html
xml
3c
解决方法
转载
已注销
2013-06-04 15:52:00
41阅读
2评论

CSS设置margin-top失效及解决办法
CSS设置margin-top失效及解决办法
边距
解决方法
Chrome
原创
mb655383be435e4
2023-11-30 20:13:12
499阅读

CSS设置margin-top失效及解决办法
在web网站开发中，有时候我们给html元素设置的margin-top或margin-bottom属性，但是
边距
chrome
解决方法
原创
wx6332e0803afcf
2022-11-08 15:47:57
503阅读

CSS中margin-top属性失效问题解决
 CSS属性有很多值得学习的地方，你对CSS中margin-top属性失效的解决方法是否熟悉，这里和大家分享一下，相信通过本文的介绍你对margin-top属性失效的解决方法一定会有深刻的认识。 关于margin-top属性失效的解决方法 常出现两种情况： （一）margin-top失效 先看下面代码： <div> 
html
css
margin
浮动布局
原创
zhanfeng0102
2012-10-08 14:18:04
460阅读

微信小程序 margin-top失效
给父级标签设置如下：overflow: hidden;
微信小程序
leechoy
原创
不秃头的小李同学
2022-11-18 19:11:22
208阅读

margin-top失效的解决办法
最近工作时发现margin-top在火狐和谷歌中没预期的效果。失效，html代码：  蓝枫蓝枫
class
border
div
float
html
原创
前端岚枫
2022-06-30 16:09:52
198阅读

How do negative margins in CSS work and why is (margin-top:-5 != margin-bottom:5)?
How do negative margins in CSS work and why is (margin-top:-5 != margin-bottom:5)? 解答 Negative margins are valid in css and understanding their (compl
css
ide
sed
ios
技术
转载
mb5fe190725e8a3
2019-08-27 10:29:00
151阅读
2评论

嵌套div的margin-top使用注意
margin-top的使用 父元素没有内容的
margin
top
嵌套
原创
歆冉
2018-04-30 12:59:06
1147阅读

css中子元素设置margin-top会影响到父元素
demo代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>index</title> <style> .content_top{ width: 500p...
CSS
margin-top
html
外边距
边距
原创
WongKyunban
2022-08-03 10:49:42
532阅读

relative定位下要使用top、left，而不是margin-top、margin-left
如果需要某个元素相对定位到父级元素的某个位置，那个需要给父级元素加”position: absolute;"，给子元素加“position:relative",子元素的定位要使" top: 30%; left: 30%"之类的来确定位置，而不是使用 “margin-top: 30%; margin-left: 30%"，因为这样可能造成在某些浏览器不支持
知识分享
原创
软件工程小施同学
2021-06-17 14:01:04
730阅读

relative定位下要使用top、left，而不是margin-top、margin-left
如果需要某个元素相对定位到父级元素的某个位置，那个需要给父级元素加”position: absolute;"，给子元素加“position:relative",子元素的定位要使" top: 30%; left: 30%"之类的来确定位置，而不是使用 “margin-top: 30%; margin-left: 30%"，因为这样可能造成在某些浏览器不支持
父级元素
相对定位
其他
原创
软件工程小施同学
2022-03-27 18:47:10
261阅读

父元素与子元素之间的margin-top问题(css hack)
hack： 父元素的盒子包含一个子元素盒子，给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值，而子元素和父元素的边距则没有发生变化。  html代码： 代码如下:<div class="box1"> <div class="box2"></div> </div> css样式： 代码如下:.box1
照片
元素
大桥镇
翻译 精选
风雨萧条
2016-04-20 21:44:36
739阅读

css中子元素设置margin-top为什么影响了父元素
本文介绍了css中子元素设置margin-top为什么影响了父元素，分享给大家，具体如下： 1 2 <style type="text/css"> *{ margin: 0px; padding: 0px; } .show{ margin: 0px auto; width: 200px; heigh
css
绝对定位
优先级
边距
盒模型
转载
mb5ffd7010f3b33
2020-11-24 14:21:00
728阅读
2评论

margin兼容之margin-top的传递问题(面试题)
问题:margin的兼容margin-top的传递描述:大盒子里面嵌套小盒子,给小盒子添加margin-top值,不但没有实现和大盒子之间的间距,反而传递到大盒子上,导致整体下移解决兼容性问题:overflow:hidden解决margin-top的传递问题(此处不是溢出隐藏)padding-top:1px 这种方法会影响最后实际的高度，需要再高度height的基础上减掉,才不会影响最后实际的高度
margin
margin-top
转载
mob604756f52321
2021-05-23 13:40:12
257阅读
2评论

关于DIV多层嵌套的margin-top的BUG
代码如下：<div>上部层</div><div> <!--父层--> <div style="margin-top:200px;">子层</div></div>理想中的效果是父层和上部层贴边显示，子层距离父层顶部有200px的距离，在ie6,7中正常，但是在ff和IE8中却出现问题，子层和父层贴边了，而父层和上部层却间隔了200px。当两个容器嵌套时,如果外层容器和内层容器之间没有别的元素,firefox和IE8会把内层元素的margin-top作用与父元素。也就是说因为子层是父层的第一个非
嵌套
firefox
JAVA
转载
mb5fe55b6d43deb
2011-09-16 14:08:00
87阅读
2评论
  • 1
  • 2
  • 3
  • 4
  • 5
精品课程领资料
免费资料>
2025软考
系统架构设计师 系统规划与管理师 软件设计师 系统集成项目管理工程师
信创认证
系统架构师 信创集成项目管理师 信创规划管理师 系统开发工程师
厂商认证
CKA/CKS架构师 红帽认证工程师 Oracle-OCP认证 Oracle-OCM认证
IT技术
数据库高级工程师 AIGC大模型实战 Linux云计算架构师 Python全栈开发
华为认证
数通HCIP认证 云计算HCIE认证 华为存储HCIE认证 HCIP安全认证
相关文章

关于DIV多层嵌套的margin-top的BUG

盒模型使用margin相关技巧及解决margin-top塌陷问题

IE8的margin-top兼容问题

对行内元素设置margin-top和margin-bottom是否起作用

[css] 解决问题---子元素设置margin-top，作用到父元素上

firefox margin-top失效的原因与解决办法

【转】子元素margin-top为何会影响父元素？

子元素margin-top导致父元素移动的问题

Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯