一直不明白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. Jenkins邮件配置，实现邮件发送策略（可实现每个Job对应不同的发送邮箱）

    前言: 首先,要有一个用来发送的邮箱,首选网易!参考:http://www.cnblogs.com/EasonJim/p/6051636.html,这里我注册了网易的免费企业邮箱. 并且我新建没多个邮 ...

  2. 研华外触发实验PCI1714板卡安装事项

    1.安装在工控机中 研华的旧版本驱动和新版本的驱动文件不能同时安装,有冲突. 如何安装新版本: 卸载旧版本.控制面板中的device manager. 安装新版本的DAQ NAVI SDK文件,安装P ...

  3. LuaLaTeX \documemtclass{standalone} 编译错误

    最近在学习用LaTeX中的TikZ包画图 (graph), 必须要用LuaLaTeX编译. 然而却出现了奇怪的错误. \documentclass{standalone} \usepackage{ti ...

  4. UnicodeEncodeError: 'ascii' codec can't encode characters in position 0-13: ordinal not i│ n range(128)

    python保持网页文件遇到的错误,归根结底还是编码问题,改一下要保存的数据为utf-8就好了. 如下最简单: import sys reload(sys) sys.setdefaultencodin ...

  5. oracle报错：ORA-28000: the account is locked

    连接数据库的时候报: ORA-28000: the account is locked 解决方法: cmd-进入命令行 C:\Users\0>sqlplus /nolog SQL*Plus: R ...

  6. Mysql学习笔记（一）

    技术的王国太过迷人,我刚从事IT就被各种技术所引诱迷惑,什么都想学.我还算言而有信的那一类人,还好有一丁点毅力,于是各种东西都沾染了一点.但是这种遍地开花的情况实在和我的智商不匹配.我没有那么多的精力 ...

  7. iOS - libc++abi.dylib: terminate_handler unexpectedly threw an exception

    代码出现crash,报错:libc++abi.dylib: terminate_handler unexpectedly threw an exception 当我们很明确是某一块代码执行导致了错误, ...

  8. rabbitmq因为主机名更改导致连接不上

    今天创建rabbitmq用户的时候报错,说nodedown,定睛一看,发现主机名是localhost,而此时我们的主机名是controller01,所以猜测是主机名导致的,重启服务器,就成功添加了. ...

  9. 最小路径(prim)算法

    #include <stdio.h>#include <stdlib.h>/* 最小路径算法 -->prim算法 */#define VNUM 9#define MV 6 ...

  10. SVN服务器配置说明

    1.前 言 花了72小时,终于把 Subversion 初步掌握了.从一个连“什么是版本控制”都不知道的门外汉,到配置出精确至每目录访问的入门者,中间还卡了一天时间.其中费了许多气力,摸索实验了多次, ...