关于margin-top的一些特别问题
当给子元素添加了margin-top的数值,浏览器解析的时候默认添加到父元素上解决的方法:
1 给父元素添加一个上边框border-top。
2 或者给子元素加个浮动。
3 给父元素添加overflow:hidden属性
4给父元素添加浮动。
两个行内块元素或者是行内元素横着排(默认)的情况下,给其中一个元素添加了margin-top,其他的也会有一个margin-top属性。
比如img元素。
div{
width100px;height:100px;background:red;
}
<div>
<img src=" 图片路径"/><img src= "图片路径 "/>
</div>
解决的方法:
1给元素本身添加一个浮动;
2给元素添加一个display:block;
关于margin-top的一些特别问题的更多相关文章
- 左右margin top问题百分比值
不想说今天心情有多差! 9点多開始发现一个"bug",需求是依据屏幕高度动态调整某个div的位置.代码大概是这种. <div style="margin-top: ...
- margin top 无效
常出现两种情况: (一)margin-top失效 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果. 解决办法: 1.box2增加f ...
- CSS margin 属性
设置外边距的最简单的方法就是使用 margin 属性. margin 属性接受任何长度单位,可以是像素.英寸.毫米或 em. margin 可以设置为 auto.更常见的做法是为外边距设置长度值.下面 ...
- CSS| 框模型-margin
CSS margin 属性 设置外边距的最简单的方法就是使用 margin 属性. margin 属性接受任何长度单位,可以是像素.英寸.毫米或 em. margin 可以设置为 auto.更常见的做 ...
- 理解css margin
前提是对display:block元素 1 margin对没有width属性的元素,能影响其宽度,对于有width的则不起作用: 高度方面不受影响 此特性可用来排版 2 margin 与百分比 普通的 ...
- D3树状图给指定特性的边特别显示颜色
D3作为前端图形显示的利器,功能之强,对底层技术细节要求相对比较多. 有一点,就是要理解其基本的数据和节点的匹配规则架构,即enter,update和exit原理,我前面的D3基础篇中有介绍过,不明白 ...
- CSS中margin与padding的区别
CSS边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界(margin):元素周围生成额外 ...
- Margin and Padding in Windows Forms Controls
https://msdn.microsoft.com/en-us/library/ms229627.aspx Margin and Padding Precise placement of contr ...
- 由浅入深漫谈margin属性1
margin 在中文中我们翻译成外边距或者外补白(本文中引用外边距).他是元素盒模型(box model)的基础属性. (该文章解释是否正确有待商榷,目前我的实验结果为:在默认情况或者div左浮动的情 ...
- 不要告诉我你懂margin
分类: Html/CSS | 转载请注明: 出自 海玉的博客 本文地址: http://www.hicss.net/do-not-tell-me-you-understand-margin/ 你真的了 ...
随机推荐
- Windows Server 2016-命令行Ntdsutil迁移FSMO角色
上章节我们介绍了有关图形化界面迁移FSMO角色,进行本章节之前我们首先回顾一下FSMO的五种操作主机角色:架构主机角色(Schema Master).域命名主机角色(Domain Naming Mas ...
- JavaScript正则表达式函数总结
/* 测试环境:Chrome 63.0.3239.132 */ JS中正则对象修饰符可选值为:"i" "g" "m",即忽略大小写 进行全局 ...
- 初涉扫码登录:edusoho实现客户端扫码登录(简版)
一.项目简介及需求 edusoho是一套商业版的在线教育平台,项目本身基于symfony2框架开发,现在有一款自己的APP,要求在不多修改edusoho自身代码的基础上,实现客户端对PC端扫码登录.不 ...
- javascript selenium全套教程发布
为什么有这个系列 目前javascript生态非常丰富,越来越多的人开始用js去做前端的ui测试了.而selenium是web ui测试的标准解决方案,所以一套js的selenium教程是很有必要的. ...
- js创建数组的三个方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Nginx拦截算法
Nginx流量拦截算法 nginx 夏日小草 2015年10月22日发布 | 1 收藏 | 40 4.2k 次浏览 0x00.About 电商平台营销时候,经常会碰到的大流量问题,除了做流量分 ...
- django-装饰器实现PV统计
1.models层建立统计表 # 每日访问量统计 class Statistics(models.Model): pv = models.IntegerField(default=0) uv = mo ...
- dd命令的巧妙使用
dd是一个非常使用高效的命令,他的作用是用指定大小的块拷贝一个文件,并在拷贝的同时进行指定的转换. 一.备份 备份整个磁盘到磁盘 #将sdx整盘备份到sdy中去 dd if=/dev/sdx of=/ ...
- Mysql group by,order by,dinstict优化
1.order by优化 2.group by优化 3.Dinstinct 优化 1.order by优化 实现方式: 1. 根据索引字段排序,利用索引取出的数据已经是排好序的,直接返回给客户端: 2 ...
- windows与虚拟机linux能ping通设置
作为以后参考所用. 首先,介绍如何在VMWare中设置linux的网络.一般网络选项有Bridged,NAT,host-only几种,本次以host-only作详细说明,如下图: 在选择host-on ...