css - 背景图片充满整个屏幕
body {
/* 加载背景图 */
background: url("../static/images/index/backImg.jpg") no-repeat;
/* 背景图垂直、水平均居中 */
background-position: center center;
/* 当内容高度大于图片高度时,背景图像的位置相对于viewport固定 */
background-attachment: fixed;
/* 让背景图基于容器大小伸缩 */
background-size: cover;
/* 设置背景颜色,背景图加载过程中会显示背景色 */
background-color: rgba(41, 50, 39, 1);
} 将table-cell的display设置为inline-block 就可以给该元素设置margin
css - 背景图片充满整个屏幕的更多相关文章
- css背景图片充满DIV
最近接手前端页面,让给调样式.哥纯粹一个代码程序猿,表示那些个样式应该让前端人员或者美工小妹妹来实现. 书归正传,碰到了问题,页面要在手机上展现,众所周知,手机在中国的牌子很多,很难做到统一. 页面上 ...
- Bootstrap css背景图片的设置
一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...
- css背景图片拉伸 以及100% 满屏显示
如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...
- div css背景图片不显示
我们在写页面时,为了便于维护,css样式通常都是通过link外部导入html的,有时在css中写入背景图片时,此时背景图片的路径应该是相对css文件的.比如,此时的文件有index.html,css. ...
- CSS背景图片定位
原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...
- 【IE6的疯狂之八】链接伪类(:hover)CSS背景图片有闪动BUG
IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存. 例如: CSS代码 a:hover{background:url(imagepath ...
- 【转】链接伪类(:hover)CSS背景图片有闪动BUG
来源:http://www.css88.com/archives/744 --------------------------------------------------------------- ...
- 兼容各浏览器的css背景图片拉伸代码
需要用到背景图拉伸,找到了下面这段css代码: filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='***.jpg' , s ...
- css背景图片拉伸
css背景图片拉伸 background-image:url(bg.png); -moz-background-size: 100% 100%; -o-background-size: 100% 10 ...
随机推荐
- Activity声明周期1
oncreate():在Activity对象第一次创建时调用 onStart():当Activity变得可见时调用该函数 onResume():当Activity开始准备于用户交互时调用该方法(即获得 ...
- 深入浅出RxJava(三:响应式的好处)
在第一篇中,我介绍了RxJava的基础知识.第二篇中,我向你展示了操作符的强大.但是你可能仍然没被说服.这篇里面,我讲向你展示RxJava的其他的一些好处,相信这篇足够让你去使用Rxjava. 错误处 ...
- OCX ACTIVEX程序打包个人精典案例(OCX)
- 统计单词数 OpenJ_Bailian - 4030(字符串处理)
一般的文本编辑器都有查找单词的功能,该功能可以快速定位特定单词在文章中的位置,有的还能统计出特定单词在文章中出现的次数. 现在,请你编程实现这一功能,具体要求是:给定一个单词,请你输出它在给定的文章中 ...
- 一个非常好的php实现手机号归属地查询接口类
前一阵子看到了一个非常好的php手机归属地查询的类,写的很精简,查询也很精确!大致代码是这样的: <?php header("Content-type:text/html;charse ...
- ROS 双目标定
http://wiki.ros.org/camera_calibration/Tutorials/StereoCalibration 发布ZED节点 roslaunch zed_cpu_ros zed ...
- YOLO2(1)配置安装win10+openvc2413+VS2013 简单测试官例
参考官网 https://github.com/AlexeyAB/darknet#how-to-compile-on-windows https://github.com/AlexeyAB/darkn ...
- day04流程控制之while
while语法: while 条件: 缩进的循环体 # 如果条件为真,那么循环体则执行,执行完毕后再次循环,重新判断条件. # 如果条件为假,那么循环体不执行,循环终止 示例一: "&qu ...
- Java部署环境搭建(Linux)
环境搭建必须jdk.tomcat.mysql(基础) 额外的软件包项目中可能用到 jdk:它包含jre和开发所需完整类库. tomcat:它是一个web容器,项目通常往webapps下扔,便于外界访问 ...
- 深入浅出的webpack4构建工具---webpack+vue+router 按需加载页面(十五)
1. 为什么需要按需加载? 对于vue单页应用来讲,我们常见的做法把页面上所有的代码都打包到一个bundle.js文件内,但是随着项目越来越大,文件越来越多的情况下,那么bundle.js文件也会越来 ...