css设置背景图片自适应
CreateTime--2017年12月25日16:36:07
Author:Marydon
控制背景图片100%自适应填充布局
/* 控制背景图片100%自适应填充布局 */
body{
background-image: url(java八种基本数据类型介绍.png);
background-size:100% 100%;
/* firefox 浏览器 */
-moz-background-size:100% 100%;
/* Safari 浏览器 */
-webkit-background-size:100% 100%;
/* ie8及以下有效 */
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='java八种基本数据类型介绍.png',sizingMethod='scale');
}
说明:
1.Firefox,Safari,ie8及以下需要对私有属性进行特殊声明;
2.针对背景图片与容器的大小不一致时,需要设置的属性值也是不一样的。
详细介绍请移步至文章:background-size 和 css 滤镜之AlphaImageLoader。
css设置背景图片自适应的更多相关文章
- img只显示图片一部分 或 css设置背景图片只显示图片指定区域
17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...
- css 设置背景图片模糊,内容不模糊
需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...
- bootstrop设置背景图片自适应屏幕
如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做: <style type="text/css"> html{height: %;} body.a ...
- css设置背景图片,ie显示不了
本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...
- (转)background-position—CSS设置背景图片的位置
background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置.因为在默认情况下背景图片都是从设置了 background-posit ...
- 使用CSS设置背景图片,图片比较大,完全显示在一个DIV中
做的时候想要边框为比较好看的样式,需要UI切图并且放在div中,看起来会好看点 像这样的,我随便挑选了一个,UI帮我切图出来 需要把这个图片填到相应的div里面,但是很显然碰到一个问题,图片太大,而且 ...
- css 设置背景图片透明
最终效果: 背景图片css不变,再背景图片的里层元素设置css样式即可 opacity:0.4; filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */
- css设置背景图片
background:pink;图片在背景图上面 background-image:url(food.jpg);一张图片铺满一行background-repeat:repeat-x;同一张图片多张铺满 ...
- css 设置背景图片铺满固定不动
#page{ position: relative; width: 100%; height: 100%; background-image:url(../img/bg.JPG); backgroun ...
随机推荐
- Ubuntu桌面主题设置以及优化
安装好Ubuntu后,觉得桌面不太美观,便动了修改主题的想法.听说Flatabulous不错,在网上搜索看过主题效果后也觉得蛮不错的,于是准备修改. 安装Unity Tweak Tool Unity ...
- Impala Catalog Server StateStore 端口被占 无法启动问题
最新版的Impala时候关闭的时候无法关闭 Catalog Server和StateStore后台进程,导致错误如下: --max_log_size= --minloglevel= --stderrt ...
- NYOJ 293 Sticks
Sticks 时间限制:3000 ms | 内存限制:65535 KB 难度:5 描述 George took sticks of the same length and cut them r ...
- 【JavaScript 5—基础知识点】:正则表达式(笔记)
一.总体概览 1.1,什么是正则 又称正规表示法.常规表示法(英语:Regular Expression,在代码中常简写为regex.regexp或RE),计算机科学的一个概念.正则表达式使用单个字符 ...
- 【Luogu】P2258子矩阵(状态压缩,DP)
233今天蒟蒻我连文化课都没听光想着这个了 然后我调了一下午终于过了!!! 一看数据范围似乎是状压,然而216等于65536.开一个65536*65536的二维数组似乎不太现实. 所以Rqy在四月还是 ...
- POJ 2154 Color ——Burnside引理
[题目分析] 数据范围有些大. 然后遍求欧拉函数,遍求和就好了,注意取模. [代码] #include <cstdio> #include <cstring> #include ...
- 算法复习——虚树(消耗战bzoj2286)
题目: Description 在一场战争中,战场由n个岛屿和n-1个桥梁组成,保证每两个岛屿间有且仅有一条路径可达.现在,我军已经侦查到敌军的总部在编号为1的岛屿,而且他们已经没有足够多的能源维系战 ...
- P2015 二叉苹果树 (树形动规)
题目描述 有一棵苹果树,如果树枝有分叉,一定是分2叉(就是说没有只有1个儿子的结点) 这棵树共有N个结点(叶子点或者树枝分叉点),编号为1-N,树根编号一定是1. 我们用一根树枝两端连接的结点的编号来 ...
- Spring boot+Spring Security 4配置整合实例
本例所覆盖的内容: 1. 使用Spring Security管理用户身份认证.登录退出 2. 用户密码加密及验证 3. 采用数据库的方式实现Spring Security的remember-me功能 ...
- 【shell】shell编程(三)-if,select,case语句
通过前两篇文章,我们掌握了shell的一些基本写法和变量的使用,以及基本数据类型的运算.那么,本次就将要学习shell的结构化命令了,也就是我们其它编程语言中的条件选择语句及循环语句. 不过,在学习s ...