<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        *{

            margin:0px;

            padding:0px;

        }

        .test{

            background-color: pink;

            height: 100%;

            width:100%;

            position:absolute;

        }

    </style>

</head>

<body>

    <div class="test">

        fdsaf

    </div>

</body>

</html>

position如果不设置，body里的div height百分比设置不起作用，具体数值才起作用

让div充满整个body的更多相关文章

  1. DIV+CSS布局问题：一个宽度不确定的DIV里面放三个水平对齐的DIV，左右两个DIV宽度固定为150px，中间那个DIV充满剩余的宽度

    一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...

  2. 单个div充满屏幕的CSS方法

    1.通过定位实现 <style> *{ margin: 0; padding: 0; } div{ width:100%; height: 100%; background: yellow ...

  3. 【css面试题】三个DIV要求水平对齐，左右两个DIV宽度固定为100px，中间那个DIV充满剩余的宽度（至少2种方法）

    这是我在一家公司面试时遇到的问题,当时没有答上来!! 所以看到的小伙伴一定要注意了!! 变化浏览器宽度可看到效果: 左 右 中 然后我们来看看代码: 第一种方法:(浮动) <style type ...

  4. HTML DIV充满整个屏幕

    <!DOCTYPE html> <html> <head> <title>A Little Game!</title> <meta c ...

  5. 模仿QQ空间 网页设计

    目的:1.通过模仿QQ空间,全自主写代码,熟悉网页设计的流程 2.熟练的掌握HTML.CSS.JS的应用 3.将在此过程中遇到的问题及其解决方法记录在此,以便取用. 开始: 一.登陆界面(index. ...

  6. H5微场景宽、高度自适应办法

    最近在做一些手机端微场景,发现处理各种手机屏幕分辨率是个很让人头疼的事情,最终找到了一个处理效果比较满意的方案.各位客观请往下看: 如果有过做微场景经历的客官们应该都了解,在代码中给一个元素的宽高设成 ...

  7. 【CSS】整屏大背景

    1. 利用div的层次,设置底层div充满屏幕,并给div设置背景图 <div id="Layer1" style="position:absolute;top:0 ...

  8. retina屏 适配问题

    物理像素(physical pixel) 一个物理像素是显示器(手机屏幕)上最小的物理显示单元,在操作系统的调度下,每一个设备像素都有自己的颜色值和亮度值. 设备独立像素(density-indepe ...

  9. web前端工程师入门须知

    本文是写给那些想要入门web前端工程的初学者,高手请路过,也欢迎高手们拍砖. 先说下web前端工程师的价值,目前web产品交互越来越复杂,用户使用体验和网站前端性能优化这些都得靠web前端工程师去做w ...

随机推荐

  1. go微服务框架kratos学习笔记四(kratos warden-quickstart warden-direct方式client调用)

    目录 go微服务框架kratos学习笔记四(kratos warden-quickstart warden-direct方式client调用) warden direct demo-server gr ...

  2. 18年第一弹射 和网络有关； 艾曲塞嗯诶系列篇 san

    62: 管理员想要更新 AR2200路由器的VRP, 正确的方法: 1)管理员把 AR2200 配置为FTP客户端,通过FTP来传输VRP软件 2)管理员把AR2200 配置为FTP服务器,通过FTP ...

  3. jvm内存模型、常见参数及调优

    JVM内存结构: 主要分为:方法区.堆.虚拟机栈.本地方法栈.程序计数器,其中方法区和堆是线程共享的,其他的都是线程隔离的. 方法区: 主要存放类的信息.静态变量.常量.编译后的方法代码,永久代Per ...

  4. Redis（七）：set/sadd/sismember/sinter/sdiffstore 命令源码解析

    上两篇我们讲了hash和list数据类型相关的主要实现方法,同时加上前面对框架服务和string相关的功能介绍,已揭开了大部分redis的实用面纱. 现在还剩下两种数据类型: set, zset. 本 ...

  5. Ubuntu固定多个静态ip

    步骤: 1.sudo vim /etc/network/interfaces 加入下列内容 auto eth0#此处查看自己的ip信息是eth0还是eth1等等 iface eth0 inet sta ...

  6. python之路：day3

    内容 变量的创建过程 身份运算和None 数据类型 一. 变量创建过程 首先,当我们定义了一个变量name = ‘oldboy’的时候,在内存中其实是做了这样一件事: 程序开辟了一块内存空间,将‘ol ...

  7. Nutz框架-- Cnd条件使用原生sql

    案例 今天接到一个临时的业务需求,做一个简单的过滤作为临时业务需要使用一两天,于是想到在原有的Cnd条件上加上一个Not like 进行过滤,但是发现现有Cnd条件查询好像满足不了 解决方案 使用Nu ...

  8. SSH(一)

    系统程序架构:    整合思路        1.逆依赖方向而行,由Spring提供对象管理和服务        2.依次实现Spring与Hibernate.Spring与Struts2的集成 配置 ...

  9. Linux文件和目录权限实战讲解

    一 相关课程回顾1.1 linux文件类型当执行ls -l或ls -la 命令后显示的结果中最前面的第2~10个字符是用来表示文件权限 第一个字符一般用来区分文件和目录: d:表示是一个目录,事实上在 ...

  10. 03讲基础篇：经常说的CPU上下文切换是什么意思（上）

    小结 总结一下,不管是哪种场景导致的上下文切换,你都应该知道: CPU 上下文切换,是保证 Linux 系统正常工作的核心功能之一,一般情况下不需要我们特别关注. 但过多的上下文切换,会把CPU时间消 ...