css height:100%失效
有时做移动端页面时,需要用到height:100%来控制,但是设置完后会发现,用百分比的高是不生效的。
经过上网浏览等查阅资料得知,是否可以使用百分比是根据父级对象定义的。所以解决方法就是在body和html,加上height:100%;就可以了。下面看代码。
- html,body{
- height:100%;
- }
- .height{
- height:50%;
- }
- <div class="height">高度百分比</div>
这样问题就解决了,如果div层级比较深,那就在需要百分比高的前面几层div都加上height:100%。
css height:100%失效的更多相关文章
- css height:100%和height:auto的区别
css height:100%和height:auto的区别 height:auto,是指根据块内内容自动调节高度.height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高 ...
- flex引起height:100%失效
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- CSS height:100%无效
本文同时发表在https://github.com/zhangyachen/zhangyachen.github.io/issues/38 浏览器根本就不计算内容的高度,除非内容超出了视窗范围(导致滚 ...
- CSS中设置height:100%无效的解决方案
在网页设计中有时会设置某个DIV或者TABLE的高度自适应,即元素的高度充满父元素的高度.一般使用设置CSS height:100%来实现.但是当元素层级嵌套比较深的时候,设置该属性并不能得到应有的 ...
- css中 出现height为100%失效的原因及解决方案
我们都知道需要给html和body标签设置了高度height:100%之后,再给内部的div设置height:100%的时候,内部div的高度100%才会起到作用.这是由于:%是一个相对父元素计算得来 ...
- 《CSS世界》读书笔记(五) --height:100%
<!-- <CSS世界> 张鑫旭著 --> 相对简单而单纯的height:auto height:auto比width:auto简单的多,原因在于: CSS默认流是水平方向的, ...
- css top,right,bottom,left设置为0有什么用?它和width:100%和height:100%有什么区别?
壹 ❀ 引 当我们使用position属性时,总免不了与top,left,right,bottom四个属性打交道,那么这四个属性都设置为0时有什么用,与宽高设置100%又有什么区别?本文对此展开讨论 ...
- [转载]css菜鸟之HTML 中块级元素设置 height:100% 的实现
HTML 中块级元素设置 height:100% 的实现 当你设置一个页面元素的高度(height)为100%时,期望这样元素能撑满整个浏览器窗口的高度,但大多数情况下,这样的做法没有任何效果. 为什 ...
- 【CSS系列】height:100%设置div的高度
一.div设置百分百高度实现描述 在html布局中body内第一个div盒子对象设置100%高度height样式,是无法成功显示100%高度的.这个是因为body高度默认值为自适应的,所以及时设置bo ...
随机推荐
- 《鸟哥的Linux私房菜》读书笔记一
1.CPU为一个具有特定功能的芯片,里面含有微指令集,一个CPU又可以分为两个主要的单元:算术逻辑单元和控制单元.CPU读取的数据都是从内存读取来的,内存内的数据是从输入单元传输来的.CPU处理完也要 ...
- AD域环境的搭建 基于Server 2008 R2
AD(Active Directory)即活动目录,微软的基础件.微软的很多产品如:Exchange Server,Lync Server,SharePoint Server,Forefront Se ...
- PEP Index > PEP 339 -- Design of the CPython Compiler 译文
http://www.python.org/dev/peps/pep-0339/ PEP: 339 标题: CPython的编译器设计 版本: 425fc5598ee8 最后修改: 2011-01-1 ...
- struts2结合生成验证码
import java.util.Arrays; /** * 工具类,生成随机验证码字符串 * @version 1.0 2012/12/01 * @author shiyz * */ public ...
- picturebox 图片自适应
picturebox控件共有两种载入图片方式,分别为: pictureBox1.BackgroundImage = Image,pictureBox1.load(url) 为使加载的图片自使用控件尺寸 ...
- 《华油能源OA系统数据同步和扩展的设计与实现_张宇峰》阅读笔记
为什么我会找到这篇论文? 华油能源集团拥有多套信息化软件系统,每个用户需要登录操作多个软件系统,记住多个系统的用户名.密码,需要不停的切换到每个系统,查看是否有需要进行的工作:管理员更是疲于每天对各个 ...
- 老的acm & oj学习站点
1.网易小鱼博客 http://gisyhy.blog.163.com/blog/#m=0&t=1&c=fks_087069086082087064085081082095085084 ...
- Chrome 浏览器地址栏直接搜索太慢的解决方案
用Chrome经常直接把要搜索的内容写在地址栏, 回国就搜索,但最近发现搜索结果出来得太慢,要刷新好几次才行. 解决方案如下: 打开Chrome的"设置", 找到”管理搜索引擎“, ...
- Android4.0 -- UI控件之 Menu 菜单的的使用(四)
2. PopupMenu 菜单的使用 1) PopupMenu 介绍 创建弹出菜单,它一般会在view的上边或者下边弹出菜单[具体看是否有空间],注意弹出菜单是api在11或者更高版本中使用 ...
- JDBC初步 JDBC连接SQLServer 2008之心路历程
转自:http://www.cnblogs.com/weilengdeyu/archive/2013/01/17/2864321.html JDBC简介 今天,研究了下JDBC连接SQL Server ...