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 ...
随机推荐
- Scrapy中将item字段转为简体or繁体
1. 安装hanziconv安装一个简繁体转换的包: pip install hanziconv 2. 自定义一个itempiples找到项目中的pipelines.py文件 添加自定义的pipeli ...
- Java中关于AbstractQueuedSynchronizer的入门(一)
备注:博文仅仅是学习过程中的零散记录,后期整理. AbstractQueuedSynchronizer的简单介绍可以网上搜索,简单了解字段作用. 示例代码,分析获取锁的过程: import java. ...
- MySql常用命令集Mysql常用命令4
说明: 用中括号([])括起来的部分表示是可选的,用大括号({})括起来的部分是表示必须 从中选择其中的一个. 1 FROM子句 FROM 子句指定了Select语句中字段的来源.FROM子句后面是包 ...
- logstash同步mysql数据到mysql(问题一)
问题 通过logstash同步数据时 字段类型为tinyint时 通过过去 0变成了false 1变为了true 时间类型 变为 2018-10-16T14:58:02.871Z 分析 开始尝试通过 ...
- 查看linux服务器的配置
https://zhidao.baidu.com/question/489376921.html 1.查看逻辑CPU个数: #cat /proc/cpuinfo |grep "process ...
- web安全之攻击
转自 知乎https://www.zhihu.com/question/22953267 作者:潘良虎链接:https://www.zhihu.com/question/22953267/answer ...
- PAT A1127 ZigZagging on a Tree (30 分)——二叉树,建树,层序遍历
Suppose that all the keys in a binary tree are distinct positive integers. A unique binary tree can ...
- PAT A1128 N Queens Puzzle (20 分)——数学题
The "eight queens puzzle" is the problem of placing eight chess queens on an 8×8 chessboar ...
- 初级算法-6.两个数组的交集 II
题目描述: 给定两个数组,编写一个函数来计算它们的交集. 示例 : 输入: nums1 = [,,,], nums2 = [,] 输出: [,] 示例 : 输入: nums1 = [,,], nums ...
- 【Codeforces Gym 100725K】Key Insertion
Codeforces Gym 100725K 题意:给定一个初始全0的序列,然后给\(n\)个查询,每一次调用\(Insert(L_i,i)\),其中\(Insert(L,K)\)表示在第L位插入K, ...