1.通过定位实现

<style>

    *{

        margin: 0;

        padding: 0;

    }

    div{

        width:100%;

        height: 100%;

        background: yellow;

        position: absolute;

    }

</style>

<body>

<div></div>

</body>

2.通过设置html,body的宽高来让div充满屏幕

<style>

    *{

        margin: 0;

        padding: 0;

    }

    html,body{

        width: 100%;

        height: 100%;

    }

    div{

        width:100%;

        height: 100%;

        background: yellow;

    }

</style>

<body>

<div></div>

</body>

　　

单个div充满屏幕的CSS方法的更多相关文章

  1. 关于一个div上下左右居中的css方法

    1:通过position:absolute定位,上下左右的值都设为0,margin:auto:需要知道div的宽高 { width: 64px; height: 64px; border: 1px s ...

  2. HTML+CSS，让div在屏幕中居中（水平居中+垂直居中）方法总结

    最近写网页经常需要将div在屏幕中居中显示,遂记录下几个常用的方法,都比较简单. 水平居中直接加上<center>标签即可,或者设置margin:auto;当然也可以用下面的方法 下面说两 ...

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

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

  4. CSS教程:div垂直居中的N种方法以及多行文本垂直居中的方法

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  5. CSS教程:div垂直居中的N种方法[转]

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  6. 基于单个 div 的 CSS 画图

    原文: Single Div Drawings with CSS 译文: 基于单个 div 的 CSS 画图 译者: 前端外刊评论 译注:通读本文,强烈地感受到了技术与艺术的结合.赞作者的这句话:Re ...

  7. 基于单个 div 的 CSS 绘图

    为什么只使用一个 Div? 2013年5月,我参加了 CSSConf,看到了Lea Verou 关于 border-radius 的演讲,你可能会认为这个属性很不起眼.但是这个演讲让我大开眼界,认识到 ...

  8. jQuery的css()方法

    jQuery的css()方法下面的代码可以为div一次性设置多个样式属性<!DOCTYPE html><html><head><meta charset=&q ...

  9. div垂直居中的几种方法

    CSS教程:div垂直居中的N种方法[转](原文地址:http://www.cnblogs.com/chuncn/archive/2008/10/09/1307321.html) 在说到这个问题的时候 ...

随机推荐

  1. 遇到的[]bug

    "Runtime Error Message:reference binding to null pointer of type 'struct value_type' Last execu ...

  2. MySql中SQL语句与其他数据库不一样的地方

    目前发现的mysql与其他数据库如SqlServer.Oracle不同的地方 mysql中的注释(--)后要多加一个空格才生效 mysql中查询条件的字符串可以是双引号 mysql中查询条件的字符串不 ...

  3. 使用Log4J收集日志

    一:搭建好Selenium+testNG+Maven环境,可参考 http://www.cnblogs.com/hc1020/p/8602863.html 二:百度搜索Maven仓库,然后搜索Log4 ...

  4. PhoenixFD插件流体模拟——UI布局【Foam】详解

    流体泡沫 本文主要讲解Foam折叠栏中的内容.原文地址:https://docs.chaosgroup.com/display/PHX3MAX/Liquid+Foam 主要内容 Overview 综述 ...

  5. NIO学习笔记

    零.前言 这里整理摘录了我了解NIO的一些笔记. 参考资料: 1.深入浅出NIO之Channel.Buffer 2.深入浅出NIO之Selector实现原理 3.Java NIO vs. IO 一.N ...

  6. get() got an unexpected keyword argument

    TypeError: get() got an unexpected keyword argument 'news_id'ERROR basehttp 154 "GET /news/3/ H ...

  7. java第七章集合框架

    如果想存储多个人物信息可以使用数组实现但是采用数组存以下明显缺陷: 数组长度不变不能适应元素变化情况,若存储大于20个英雄信息则长度不够,若只存储10个则造成内存空间浪费.可用.length获取数组中 ...

  8. 利用ELK分析Nginx日志

    本文以api.mingongge.com.cn域名为测试对象进行统计,日志为crm.mingongge.com.cn和risk.mingongge.com.cn请求之和(此二者域名不具生产换环境统计意 ...

  9. 如何把ppt写好

    前言 这里不是总结ppt如何写的美观漂亮,而是总结写整体的结构,如何修辞 整体结构 前后呼应 就像做作文一样,前后呼应,产生共鸣和联想,切记过于离散 抽象化 不要把自己做的东西写小了,要有一定的抽象度 ...

  10. js实现接口隔离

    昨天公司培训了接口隔离,简单说一下 接口隔离:类间的依赖关系应该建立在最小的接口上.接口隔离原则将非常庞大.臃肿的接口拆分成更小具体的接口,这样客户讲会只需要知道他们感兴趣的方法. 接口隔离原则的目的 ...