1、在父元素内添加内容,并且要在子元素块前面添加,后面添加内容无效。

内容可以是文字、图片甚至是空格,源代码里直接按空格无效,可以用占位符 

2、让子元素或父元素浮动float:left。

缺点:在元素不能用浮动的情况

3、让父元素顶部增加一条边框,可以设边框为透明:border-top:1px solid transparent。

缺点:虽然是透明但还是多了1px的占位,一般精确度要求不高,1px基本可以忽略了。

4、让子元素或父元素绝对定位:position:absolute。

缺点:在元素不能用绝对定位的情况

5、让父元素overflow:hidden。

缺点:元素不能用overflow:hidden的情况。

总结,相对完美的是添加占位符 和overflow:hidden了。

原文链接:http://www.w3cfuns.com/blog-5456068-5403195.html

解决子元素margin让父辈元素位置一起改变的问题的更多相关文章

  1. 子元素margin带动父元素拖动

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. ss 如何解决margin-top使父元素margin失效

    给子元素设置margin-top的时候父元素的也会受影响.会产生子元素和父元素margin合并的问题. 解决办法: 给父元素设置padding.或者border把父子的margin之间隔开. 一般来说 ...

  3. 能用padding,margin解决的不要使用伪元素,能用背景解决的也不要用伪元素

    能用padding,margin解决的不要使用伪元素,能用背景解决的也不要用伪元素

  4. div宽度设置width:100%后再设置padding或margin超出父元素的解决办法

    div宽度设置width:100%后再设置padding或margin超出父元素的解决办法 一.总结 一句话总结:直接加上box-sizing:border-box;即可解决上述问题. 1.box-s ...

  5. 如何解决子元素设了margin-top之后父元素所受的影响

    解决方法: 1.在父元素上加:overflow:hidden. 2.给父元素加border; 3.外容器上加上padding.

  6. {03--CSS布局设置} 盒模型 二 padding bode margin 标准文档流 块级元素和行内元素 浮动 margin的用法 文本属性和字体属性 超链接导航栏 background 定位 z-index

    03--CSS布局设置 本节目录 一 盒模型 二 padding(内边距) 三 boder(边框) 四 简单认识一下margin(外边距) 五 标准文档流 六 块级元素和行内元素 七 浮动 八 mar ...

  7. python 全栈开发,Day48(标准文档流,块级元素和行内元素,浮动,margin的用法,文本属性和字体属性)

    昨日内容回顾 高级选择器: 后代选择 : div p 子代选择器 : div>p 并集选择器: div,p 交集选择器: div.active 属性选择器: [属性~='属性值'] 伪类选择器 ...

  8. padding(内边框), border(边框), margin, 标准文档流, 块级元素和行内元素, 浮动 ,margin的用法

    盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和IE模型 ...

  9. JS子元素oumouseover触发父元素onmouseout

    原文:JS子元素oumouseover触发父元素onmouseout JavaScript中,父元素包含子元素: 当父级设置onmouseover及onmouseout时,鼠标从父级移入子级,则触发父 ...

随机推荐

  1. OPENGL若干重要基础概念

    投影:3D数据“压平”到2D的计算机屏幕上,即将真正的三维物体显示到二维屏幕上,这种3D压平到2D的过程称为投影. 投影类型:正投影,透视投影 正投影:垂直于投影平面的平行投影(不垂直的投影平面的平行 ...

  2. 你所不知道的Android Studio调试技巧

    转载:http://www.jianshu.com/p/011eb88f4e0d Android Studio目前已经成为开发Android的主要工具,用熟了可谓相当顺手.作为开发者,调试并发现bug ...

  3. bzoj 3172 AC自动机

    初学AC自动机,要先对于每一个模式串求出来trie树,在此基础上构建fail指针,然后在trie树加上失配边构建出整张trie图. AC自动机的原理和KMP差不多,一个节点的fail指针就是指向tri ...

  4. 【poj1186】 方程的解数

    http://poj.org/problem?id=1186 (题目链接) 题意 已知一个n元高次方程:   其中:x1, x2,…,xn是未知数,k1,k2,…,kn是系数,p1,p2,…pn是指数 ...

  5. wildfly jobss 同时连接多个数据源

    由于需要从一个远程机器取数据.处理后保存到本地数据库处理.用 wildfly datasource 会报: [com.arjuna.ats.arjuna] (default task-6) ARJUN ...

  6. CSS--值和单位

    等价颜色表 什么叫Web安全色 所谓的“web安全”颜色是指在256色计算机系统上总能避免抖动的颜色. Web安全颜色可以表示为RGB值为20%和51(相应的十六进制值为33)的倍数. 如果使用RGB ...

  7. 如何写出优雅的css代码 ?

    如何写出优雅的css代码 ? 对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于 ...

  8. [VSTS] 从零开始 Team Foundation Server 2010 安装配置详细图文教程

    http://www.cnblogs.com/WilsonWu/archive/2011/11/24/2261674.html 近期公司要配TFS用于新项目的管理,公司也将逐步迁移至VSTS平台,前期 ...

  9. FIREFOX A tool for easily making HTTP requests (GET/PUT/POST/DELETE)

    https://addons.mozilla.org/zh-CN/firefox/addon/httprequester/

  10. 查看apt-get安装软件的版本

    apt-cache search name 查询 apt-get install name 安装 dpkg dpkg dpkg-checkbuilddeps dpkg-genchanges dpkg- ...