当父容器是body时,height:100%不起作用(无效),解决办法:在css代码段中添加

html, body{ margin:0; height:100%; }

实现div全屏的时候需要上面那段代码。

下面给个div全屏的示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>全屏div</title>
<style>
html,body {
margin:0;
height:100%;
}
#test {
width:100%;
height:100%;
background-color:#FC0;
}
</style>
</head> <body>
<div id="test"></div>
</body>
</html>

height:100%不起作用(无效),div全屏的更多相关文章

  1. 用CSS3 vh 简单实现DIV全屏居中

    vh.vw.vmin.vmax介绍 vw:视窗宽度的百分比(1vw 代表视窗的宽度为 1%)vh:视窗高度的百分比vmin:当前 vw 和 vh 中较小的一个值vmax:当前 vw 和 vh 中较大的 ...

  2. 网页js,DIV全屏布局

    <script type="text/javascript"> $(document).ready(function(){ findDimensions(); }); ...

  3. table布局 height=100%无效分析

    (从死了一次又一次终于挂掉的百度空间中抢救出来的,发表日期 2014-08-11) 原文链接:http://www.cnblogs.com/gaojun/archive/2012/05/07/2487 ...

  4. 如何让 height:100%; 起作用

    当你设置一个页面元素的高度(height)为100%时,期望这样元素能撑满整个浏览器窗口的高度,但大多数情况下,这样的做法没有任何效果.你知道为什么height:100%不起作用吗? 按常理,当我们用 ...

  5. CSS 如何让 height:100%; 起作用

    当你设置一个页面元素的高度(height)为100%时,期望这样元素能撑满整个浏览器窗口的高度,但大多数情况下,这样的做法没有任何效果.你知道为什么height:100%不起作用吗? 按常理,当我们用 ...

  6. 如何让 height:100%; 起作用---父级元素必须设定高度

    参考: http://www.webhek.com/post/css-100-percent-height.html https://www.cnblogs.com/kunmomo/p/1060066 ...

  7. html body width height 100%使用

    首先我们来看一个实际的问题,让body中的一个div占全屏,(问题来源:http://stackoverflow.com/questions/1575141/make-div-100-height-o ...

  8. 关于height:100%两三事

    对于CSS的height:100%,顾名思义,该元素的高度自动填充为其父元素的高度.但该样式有时候会不起作用,Mark down 一下.>< 首先,看一下以下CSS代码: div { he ...

  9. [转载]css菜鸟之HTML 中块级元素设置 height:100% 的实现

    HTML 中块级元素设置 height:100% 的实现 当你设置一个页面元素的高度(height)为100%时,期望这样元素能撑满整个浏览器窗口的高度,但大多数情况下,这样的做法没有任何效果. 为什 ...

随机推荐

  1. 如何在window Form中使用Font Awesome?

    随着技术的发展,web上以前的图片按钮现在逐步换成了图标字体,这些图标字体是矢量的,矢量图意味着每个图标都能在所有大小的屏幕上完美呈现,可以随时更改大小和颜色,而且不失真,真心给人一种“高大上”的感觉 ...

  2. CSS级联和继承

    2016-11-06 <CSS入门经典>第七章 1.在HTML中使用CSS样式表的三种方式: (1)内联的样式表. eg:<em style="background-whi ...

  3. 10本Java经典书目推荐

    本文列出的10本书是我个人非常喜欢的Java书籍,当我有时间的时候,我就会将它们捧在手里阅读.甚至有些书我反复读过很多遍,每次重新读的时候总会有新的收获.因此这些书也是大部分Java程序员喜欢的书籍. ...

  4. Troubleshooting FIM: (No Display Name) in FIM Portal

    from: http://social.technet.microsoft.com/wiki/contents/articles/12682.troubleshooting-fim-no-displa ...

  5. 【Leafletjs】5.L.Control 自定义一个Control

    L.Control 所有leaflet控制的基础类.继承自IControl接口. 你可以这样添加控件: control.addTo(map); // the same as map.addContro ...

  6. 服务 {49A27252-A326-4EF1-B698-6EBC7068833C} 的计时器作业 id {573BE459-DF82-481C-84BD-CA14D287450B} 配置刷新的上一个实例仍在运行,因此将跳过当前的实例。请考虑增加作业之间的时间间隔。

    在SharePoint2007的错误日志中发现大量如下错误: 07/02/2013 16:17:25.99     OWSTIMER.EXE (0x0958)     0x097C    Window ...

  7. 使用fastboot工具刷入recovery.img、boot.img、system.img等

    在Android SDK目录的platform-tools目录下有fastboot.exe刷机工具(注:需要将机器进入fastboo模式) 刷recovery.img: fastboot flash ...

  8. Android 杀死进程

    当应用不再使用时,通常需要关闭应用,可以使用以下三种方法关闭android应用: 第一种方法:首先获取当前进程的id,然后杀死该进程.android.os.Process.killProcess(an ...

  9. 【代码笔记】iOS-短信分享

    代码: ViewController.h #import <UIKit/UIKit.h> //短信分享 #import <MessageUI/MFMailComposeViewCon ...

  10. 【代码笔记】iOS-侧滑效果

    一,效果图. 二,工程图. 三,代码. AppDelegate.h #import <UIKit/UIKit.h> //加入头文件 #import "PPRevealSideVi ...