当父容器是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. MAC使用CocoaPods

    前言,還是那句話,按照濤叔下面畫黃色的步驟順序執行就好了 使用CocoaPods兩種方式:使用之前安裝的插件&命令行. 一.利用插件 1.創建項目后添加CocoaPods 2.在文本框中輸入如 ...

  2. Loadrunner中web_find和web_reg_find函数的使用与区别

    总结一下Loadrunner中的检查点函数,主要介绍两个函数:web_find()和web_reg_find():这两个函数均用于内容的查找,但两者也有本质的区别,具体介绍如下:一.web_find( ...

  3. Java实现注册时发送激活邮件+激活

    最近从项目分离出来的注册邮箱激活功能,整理一下,方便下次使用 1.RegisterController.java package com.app.web.controller; import java ...

  4. Criteria查询初学者的采纳点哦

    一.Hibernate提供了5种检索对象的方式 1.导航对象图检索方式:根据已经加载的对象导航到其他对象    from  Emp e group by e.dept.deptName 2.OID检索 ...

  5. treeview bootstrap 多级下拉树

    bootstrap-treeview.js1是一款强大的树菜单插件,本文演示bootstrap-treeview.js15种不同的调用方法.它可一次性加载数据,也可异步加载.支持Checkbox,se ...

  6. CountUp.js – 让数字以非常有趣的动画方式显示

    CountUp.js 无依赖的.轻量级的 JavaScript 类,可以用来快速创建以一种更有趣的动画方式显示数值数据.尽管它的名字叫 countUp,但其实可以在两个方向进行变化,这是根据你传递的 ...

  7. JS高程1.javascript简介

    1.javaScript诞生于1995年,最开始是为了处理以前由服务器端语言负责的一些诸如验证的操作. 2.一些名词: ECMA:European Computer Manufacturers Ass ...

  8. 源码详解openfire保存消息记录_修改服务端方式

    实现openfire消息记录通常有两种方式,修改服务端和添加消息记录插件. 今天,简单的说明一下修改服务端方式实现消息记录保存功能. 实现思路 修改前: 默认的,openfire只提供保存离线记录至o ...

  9. <转>iOS应用程序内使用IAP/StoreKit付费、沙盒（SandBox）测试、创建测试账号流程！

    原文地址:http://blog.csdn.net/xiaominghimi/article/details/6937097 //——2012-12-11日更新   获取"产品付费数量等于0 ...

  10. Android自定义控件1

    概述 Android已经为我们提供了大量的View供我们使用,但是可能有时候这些组件不能满足我们的需求,这时候就需要自定义控件了.自定义控件对于初学者总是感觉是一种复杂的技术.因为里面涉及到的知识点会 ...