body和普通div背景图的区别

 background: url(//m.360buyimg.com/mobilecms/s220x220_jfs/t2746/167/831241799/299152/1731092b/5728423cNa16c83cb.jpg!q70.jpg);
    background-size: 100% 100%;
    position: absolute;
    height: 100px;
    width: 100%; 
 
 
 你给body这个设置，和给一般的div这样设置，都把他们的父级设为relative，没有高度
会发现区别：

这样的设置div，可以出现背景图；而body这样设置 的没有

结论：

当你设置body为absolute或者fixed,relative时，他的背景的宽高百分比其实取的是相对于body的父级，也就是html

body和普通div背景图宽高百分比的区别的更多相关文章

  1. 背景图宽高100%无法无法显示的问题【body设置relative，当前元素absolute】

    以下1,2两个关键元素 body{   width:100%;   height:100%;   position:relative; //1 } .login-form { width: 100%; ...

  2. 多个div背景图无缝拼接

    公司在做环形进度条的时候遇到了这个问题,上网一搜,原来是因为两个div背景图拼接起来的,所以中间出现了必不可少的缝隙,最后把position改为relative,再加个margin:0,就解决好了,下 ...

  3. div的最小宽高和最大宽高

    div的最小宽高和最大宽高很少使用但是很实用,今天敲代码,就遇到了,要在div里设置滚动条,众所周知,一般是设overflow-y:auto,但需要一个高度,只有div里的内容超过这个高度时,才会有滚 ...

  4. css背景图充满屏幕

    代码: body { /* 加载背景图 */ background: url(resource/inv_bg.png); /* 背景图不平铺 */background-repeat: no-repea ...

  5. css3处理sprite背景图压缩来解决H5网页在手机浏览器下图标模糊的问题

    近期在负责一个微信H5 App项目,遇到一个郁闷的问题,手机浏览器查看网页时图标都是模糊的,有锯齿,电脑浏览器显示则是正常.大概知道是分辨率适配等类型的问题,后来网上查找了一些办法.大部分的解决方式都 ...

  6. css 快捷修改 checkbox 及 radio的背景图

    在CSS内选择要修改的input input[type=checkbox]:disabled{ //input类型等于复选框并且是disabled状态的所有(根据情况自由指定) -webkit-app ...

  7. IE6下 input 背景图滚动问题及标签规范

    ie6 背景图滚动问题: <title>ie6下input背景图滚动问题</title> <style> .box{ height:20px; width:300p ...

  8. 在css中设置图片的背景图，怎么设置图片纵向拉伸

    css中设置背景图拉伸填充,在css2.1之前这个背景的长宽值是不能被修改的. 实际的结果是只能重复显示,可以使用repeat,repeat-x,repeat-y,no-repeat这些属性来控制背景 ...

  9. table-cell设置宽高、居中

    table-cell默认宽高由内容决定 <style type="text/css" rel="stylesheet"> .content { co ...

随机推荐

  1. .html 页面修改成 .jsp 后缀后中文乱码解决办法。

    .html 后缀的文件,如果直接将 .html后缀改成 .jsp 后缀,则会乱码. 正确方法如下: 将如图的代码中 html  声明去掉,然后加上这段代码:<%@ page language=& ...

  2. windows查看与清理dns缓存

    1.windows下在命令行输入  ipconfig /flushdns 清理本地dns缓存查看dns缓存   ipconfig/displaydns2.Mac OSX下在命令行输入  lookupd ...

  3. ubuntu 常见问题解决

    1.更新出现Could not get lock /var/lib/apt/lists/lock问题解决方法: 首先输入命令:sudo rm /var/lib/apt/lists/* -vf 执行完成 ...

  4. 如何找GitHub上热门的开源项目

    访问:https://github.com/trending,选择时间段和关联语言就可以查看最近热门的项目. Java最近一个月热门项目如下:

  5. 洛谷 1312 Mayan游戏——暴搜+剪枝

    题目:https://www.luogu.org/problemnew/show/P1312 自己写了很久.又T又WA的. 发现对题理解有误.改完后应该只有T了,但还是T的. 自己写了许多剪枝,很鸡肋 ...

  6. 08.IdentityServer4登录中心

    08.IdentityServer4登录中心 IdentityServer就是一套Framework,实现了OAuth的授权 理解OAuth流程,学会怎么使用他 http://ruanyifeng.c ...

  7. UVa 12333 Revenge of Fibonacci (字典树+大数)

    题意:给定一个长度小于40的序列,问你那是Fib数列的哪一项的前缀. 析:首先用大数把Fib数列的前100000-1项算出来,注意,一定不能是100000,要不然会WA的,然后每个数取前40位,不足4 ...

  8. LeetCode: 292 Nim Game(easy)

    题目: You are playing the following Nim Game with your friend: There is a heap of stones on the table, ...

  9. Lightoj1014【基础题】

    题意: 有C个人,安排了P个吃的,每个人会吃Q个吃的,最后留下L个吃的:求所有可能的Q,从小到大输出,要保证Q>L; 思路: 其实就是求出P-L的所有数的约数,然后这个约数>L的话就满足: ...

  10. 安装MySQL出现1045错误

    安装MySQL出现1045错误 一.运行环境 MySQL mysql-5.1.26-rc-win32 操作系统:Windows 7 X64 二.问题描述 安装MySQL过程中会涉及对root密码的设置 ...