此场景适用于移动端百分比布局，背景全屏显示。

在一个没有设置宽高的容器中设置背景，想要背景全屏显示，设置bcakground-size:100%;后还需设置position:absolut;

原因：

absolute会脱离normal float, 即该元素会直接以root标签(类似window但不是<html>标签)进行参照,而root标签的高度存在具体数值, 即浏览器视窗高度, 有明确px值.

而relative不会脱离normal float, 他的height会直接依赖直接父元素(em单位也是), 所以百分比计算出来的高度是依照父元素继承的.

在一个没有设置宽高的容器中,为什么设置position:absolute后就可以全屏显示了?的更多相关文章

  1. Css动画形式弹出遮罩层，内容区上下左右居中于不定宽高的容器中

    <!DOCTYPE html> <html> <head> </head> <body id="body"> <! ...

  2. 在虚拟机中安装ubuntu16.04后不能全屏显示

    一.在终端输入:xrandr 二.输入:xrandr -s 1920x1440 参考网站:https://blog.csdn.net/qq_33202928/article/details/75021 ...

  3. 物体position:absolute后设置left:50%发生的有趣小事

    今天在重构ui控件中3秒hint提示框样式,发现了一个有趣的小事,特发个文章记录一下,方便自己日后看一下 一 准备知识 ①一个已设置宽高的块状元素设置position:absolute后会保持他原来宽 ...

  4. <canvas>设置宽高遇到的问题

    在使用<canvas>元素时必须设置宽度和高度,指定可以绘画的区域大小.但是这里设置宽度和高度的时候有一个小问题. 样例代码: <!DOCTYPE html> <html ...

  5. css实现定高的元素在不定高的容器中水平垂直居中（兼容IE8及以上）

    容器设置相对定位 元素设置宽高,并使用绝对定位,上下左右值均为0,margin:auto 如下所示: <!DOCTYPE html> <html> <head lang= ...

  6. 关于“float”的一次探索--遇到了一个span元素可以设置宽高引发的思考

    起初,这个问题和float还有设置宽高之间是没有任何关联的,一开始这是一个关于height和line-height的问题,目的是为了探究一下这两者之间的关系,但是在学习的过程中,我翻之前写的代码,发现 ...

  7. a标签什么时候可以设置宽高

    行内元素(如a标签),在文档流中的时候因为是行内元素所以无法设置宽高:而当设置了绝对定位或者浮动,会生成块框(即变成块元素),所以就可以设置宽高了

  8. android下载网络图片，设置宽高，等比缩放

    使用Picasso组件去下载图片会发现图片宽高会变形不受等比缩放控制,即使设置了图片的 scaleType,可能是对Picasso的api没有用对, Picasso.with(this.activit ...

  9. 第4天：JS入门-给div设置宽高背景色

    今天学习了js入门课程,听的不多,做了个小练习,给div设置宽高.背景色.一点点都是进步.核心代码如下: <!DOCTYPE html><html lang="en&quo ...

随机推荐

  1. 【网络】 数据链路层&物理层笔记

    数据链路层 简称链路层,功能在于将数据包封装成帧,控制帧对介质的访问.链路层连接了物理介质和其之上抽象层,可以使上层不用关心用什么方法在什么介质中传输信息. 在帧被传输时经过的每一跳,每个中间设备(通 ...

  2. STL --> stack栈

    stack栈 c++stack(堆栈)是一个容器的改编,它实现了一个先进后出的数据结构(FILO),使用该容器时需要包含#include<stack>头文件: 定义stack对象示例: s ...

  3. leaflet简单例子，绘制多边形

    var crs = L.CRS.EPSG900913; var map = L.map('map', { crs: crs, width: '100%', height: '100%', maxZoo ...

  4. JDBC（通俗易懂）简单的操作（增、删、改、查）

    项目所写的类: 说明:①.DButil 动态加载数据库驱动,以及获取java.sql.Connection的对象. ②.Personmodel 数据库列(栏位)所对应的字段,定义了相应的set和get ...

  5. 使用属性升级MyBank

    一.访问修饰符  private   :使用private访问修饰符修饰的属性或者方法只能在本类中使用 public    :可以在任何类中访问到 二.this 关键字:代表当前类,this.属性:代 ...

  6. Jmeter返回参数值写入文件《一》

    在用Jmeter做自动化测试的时候,某些特殊情况下我们需要将Jmeter的返回的某个特殊值写入的文件中,那么我们该如何做呢? 对于Jmeter这个工具来说,我们不难知道,它是一个java开源的可扩展的 ...

  7. 【分布式系列之dubbo】SSM+Dubbo实战

    对于传统的单一构架,也就是打成的war或者ear包部署在同一个Web容器里的构架,它虽然开发.测试.部署简单,但随着业务的不断发展,维护成本增加,可扩展性差,而且一台Tomcat的并发数在500左右, ...

  8. 网络1711班 C语言第一次作业批改总结

    Testing 总结 1 本次作业评分规则 1.1 基本要求(1分) 按时交 - 有分 未交 - 0分 迟交一周以上 - 倒扣本次作业分数 抄袭 - 0分 博客作业格式不规范,没有用Markdown语 ...

  9. C语言博客作业--一二维数组。

    一.PTA实验作业 题目1:7-1 将数组中的数逆序存放 1. 本题PTA提交列表 2. 设计思路 定义三个整型变量n用来存放整数个数i,j是循环数 scanf("%d",& ...

  10. 《Language Implementation Patterns》之 强类型规则

    语句的语义取决于其语法结构和相关符号:前者说明了了要"做什么",后者说明了操作"什么对象".所以即使语法结构正确的,如果被操作的对象不合法,语句也是不合法的.语 ...