body {
/* 加载背景图 */
background-image: url(images/background-photo.jpg); /* 背景图垂直、水平均居中 */
background-position: center center; /* 背景图不平铺 */
background-repeat: no-repeat; /* 当内容高度大于图片高度时,背景图像的位置相对于viewport固定 */
background-attachment: fixed; /* 让背景图基于容器大小伸缩 */
background-size: cover; /* 设置背景颜色,背景图加载过程中会显示背景色 */
background-color: #464646;
}

CSS实现响应式全屏背景图的更多相关文章

  1. css实现响应式全屏背景

    利用css中 background-size:cover  填充整个viewport 注意: 一张背景图像素5000px*5000px在pc端 缩放都基本满足要求 不会出现模糊失真: 但是在移动端使用 ...

  2. CSS之全屏背景图

    吐槽啦:Yeah  明天就是国庆了o(* ̄▽ ̄*)o!哈哈,提前祝福各位园友国庆快乐.假期愉快.生活美满.天天开心!国庆我要回家一趟,把一些不用的东西带回家,走访一下亲朋好友,在家打几天酱油~~~ 言 ...

  3. jQuery10种不同动画效果的响应式全屏遮罩层

    遮罩层有很多今天介绍这个jQuery10种不同动画效果的响应式全屏遮罩层 效果预览 下载地址 实例代码 <div class="container"> <head ...

  4. css设置全屏背景图,background-size 属性

    在写主题样式的时候经常会碰到用背景图铺满整个背景的需求,这里分享下使用方法 需要的效果 图片以背景的形式铺满整个屏幕,不留空白区域 保持图像的纵横比(图片不变形) 图片居中 不出现滚动条 多浏览器支持 ...

  5. 基于html5和css3响应式全屏滚动页面切换效果

    分享一款全屏响应式的HTML5和CSS3页面切换效果.这个页面布局效果对于那些页面要求固定100%高度和宽度的网站和APP来说是十分有用的.效果图如下: 在线预览   源码下载 HTML wrappe ...

  6. 全屏背景图的实现及background的相关属性

    今天需要做一个占满设备宽度的轮播图,这里作为demo仅展示一张图,下面分别是要操作的图片(这里做了缩放处理,实际的图比较大),以及要实现的效果图,很明显两者是不成比例的:      (图一)     ...

  7. swiper实现响应式全屏自动轮播

    html: <!--轮播 --> <div class="Excellent_swi"> <div class="swiper-contai ...

  8. unity中全屏背景图缩放

    using UnityEngine; using System.Collections; public class BgPicScript : MonoBehaviour { // Use this ...

  9. CSS之生成全屏背景图片

    在CSS中背景图片的填充方法: background-position:x,y(背景图片x,y轴的定位) background-repeat:no-repeat(不平铺) background-rep ...

随机推荐

  1. 蓝牙扫描工具btscanner修复暴力扫描模式

    蓝牙扫描工具btscanner修复暴力扫描模式   在btscanner 2.1-5版本中,当用户按下快捷键b,执行暴力扫描模式,会出现程序奔溃问题.该问题现在已经修复.用户只需要更新系统,将btsc ...

  2. BZOJ.2242.[SDOI2011]计算器(扩展欧几里得 BSGS)

    同余方程都不会写了..还一直爆int /* 2.关于同余方程ax ≡b(mod p),可以用Exgcd做,但注意到p为质数,y一定有逆元 首先a%p=0时 仅当b=0时有解:然后有x ≡b*a^-1( ...

  3. [__NSArrayM insertObject:atIndex:]: object cannot be nil'

    错误描述:如下图 分析原因: 1.插入的对象为空了 2.[__NSSetM addObject:] object cannot be nil [__NSArrayM insertObject:atIn ...

  4. Java之String、StringBuilder、StringBuffer的区别

    String : 字符串常量,它们的值在创建之后不能更改.代表字符串,Java 程序中的所有字符串字面值(如 "abc" )都作为此类的实例实现. String的值是不可变的,这就 ...

  5. MyEclipse设置文件的编码格式

    在MyEclipse中复制properties文件的时候,发现一个问题,在EditPlus中打开文件中文可以正常显示,并且是UTF-8的编码格式. 但是将这个文件复制到MyEclipse中再打开时,中 ...

  6. Android开源项目SlidingMenu学习(二)

    前一篇SlidingMenu学习(一)文章中了解了导入SlidingMenu到我们项目经常出现的问题,下面我们正式学习. 先看一个效果: 看到两幅图片的差别了吗,左边的一栏时可以滑动的,可以隐藏掉,现 ...

  7. 枚举进程句柄File,Section,Mutant,Timer关闭Mutex句柄实现游戏多开

    原文:http://www.cnblogs.com/Y4ng/archive/2012/09/06/EnumProcessHandle_EnumMutex.html 相信做过游戏多开的朋友就会发现,很 ...

  8. caffe中的fine-tuning

    caffe finetune两种修改网络结构prototxt方法 第一种方法:将原来的prototxt中所有的fc8改为fc8-re.(若希望修改层的学习速度比其他层更快一点,可以将lr_mult改为 ...

  9. git 对比两个commit 之间的差异

    git 对比两个commit 之间的差异 比较两个版本之间的差异 git diff commit-id-1 commit-id-2 > d:/diff.txt 结果文件diff.txt中: &q ...

  10. C# 远程服务器 安装、卸载 Windows 服务,读取远程注册表,关闭杀掉远程进程

    这里安装windows服务我们用sc命令,这里需要远程服务器IP,服务名称.显示名称.描述以及执行文件,安装后需要验证服务是否安装成功,验证方法可以直接调用ServiceController来查询服务 ...