一直不明白height:100%和height:auto的区别,最近在制作前端页面时都用了height:100%;overflow:hidden; ,可是有些浏览器出现莫名的奇妙的问题,但换成height:auto就好了,百度过这个问题,却一直没有细看。

今天又浮现了同样的问题,百度细看和群里的朋友指点,终于明白其中的道理,记录一下。

height:auto,是指根据块内内容自动调节高度。
height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高度的父层的高度来定义高度。

<参考:http://blog.sina.com.cn/s/blog_601b97ee0101dtwk.html>

height:100%和height:auto的区别的更多相关文章

  1. css height:100%和height:auto的区别

    css height:100%和height:auto的区别 height:auto,是指根据块内内容自动调节高度.height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高 ...

  2. height:100%与height:inherit的区别

    一.兼容性 首先,inherit这个属性只是在ie8+才支持:100%支持ie6: 二.大多数情况下没有区别 在正常情况下height:100%与height:inherit没有任何区别: 1.父元素 ...

  3. width:100%;与width:auto;的区别

    <div> <p>1111</p> </div> div{ width:980px; background-color: #ccc; height:30 ...

  4. height:100% 布局

    常常会碰到需要填满整个浏览器,并且自适应高度的需求.首先肯定会想到给容器设定height:100%,但是会没有效果.原因是body没有高度,所以百分比无法生效. 解决方案:给html,body,标签都 ...

  5. jQuery中的height()、innerheight()、outerheight()的区别总结

    在前端jQuery代码中突然看到outerheight(),第一感觉就是,这是什么鬼?然后仔细查阅了一下,居然发现还有这么多相似的东西. 在jQuery中,获取元素高度的函数有3个,它们分别是heig ...

  6. flex引起height:100%失效

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. css设置height 100%

    需要显式设置html,body为100%,body是相对于html,wrapper是相对于body html,body{ height: 100%; } .wrapper{ height: 100; ...

  8. height:100%失败

    height显然,设置100% 为什么不能看到效果.非常多的时间不是很扎实的时间的基础上,,经常会遇到这样的问题,原因很简单的事实 首先,你必须确保 html{height:100%;} body{h ...

  9. 对height 100%和inherit的总结

    对height 100%和inherit的总结 欢迎大家来我的博客留言:https://sxq222.github.io/CSS%...博客主页:https://sxq222.github.io 正文 ...

随机推荐

  1. MVC3的安装方法(含安装包)

    安装方式: 1.直接官方下载安装包安装.链接:http://pan.baidu.com/s/1nvLfG8p 密码:534g 2.整个项目通过nuget进行安装.(推荐) 总结: MVC3有个尴尬的问 ...

  2. AutoIt3(AU3)开发的智能驱动安装工具,用于系统封装,支持参数静默启动

    项目相关地址 源码:https://github.com/easonjim/Smart_Driver bug提交:https://github.com/easonjim/Smart_Driver

  3. Android——旋转屏幕导致Activity重建解决方法

    Android开发文档上专门有一小节解释这个问题.简单来说,Activity是负责与用户交互的最主要机制,任何“设置”(Configuration)的改变都可能对Activity的界面造成影响,这时系 ...

  4. C语言实现penna模型

    一年前写的代码,偶然翻出来.发现自己当时水平还不赖吗. # include <stdio.h> # include <stdlib.h> # include <time. ...

  5. RBM Formula Deduction

    Energy based Model the probability distribution (softmax function): \[p(x)=\frac{\exp(-E(x))}{\sum\l ...

  6. iOS - 装饰对象

    1.设计模式原则 多组合,少继承 类对拓展开放,对修改关闭 派生的子类接口是在编译时就静态决定的,而所有子类都会继承到相同的接口.然而,利用组合或者说装饰模式来拓展抽象类的接口,就可以在运行时动态的进 ...

  7. mysql中max_allowed_packet参数的配置方法(避免大数据写入或者更新失败)

    修改方法 1.修改配置文件 可以编辑my.cnf来修改(windows下my.ini),在[mysqld]段或者mysql的server配置段进行修改. 代码如下: max_allowed_packe ...

  8. sql自带函数语句

    --取数值表达式的绝对值select abs(-41)      41select abs(41)       41select abs(-41.12)   41.12select abs(41.12 ...

  9. wpf 前台获取资源文件路径问题

    1 <ImageBrush ImageSource="YT.CM.CommonUI;component/Resource/FloadwindowImage/middle.png&quo ...

  10. SMO推导和代码-记录毕业论文4

    SMO的数学公式通过Platt的论文和看这个博客:http://www.cnblogs.com/jerrylead/archive/2011/03/18/1988419.html,大概弄懂了.推导以后 ...