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 ...
随机推荐
- 双线性差值(由于分析sift源码 )
双线性插值 双线性插值,顾名思义就是两个方向的线性插值加起来.所以只要了解什么是线性插值,分别在x轴和y轴都做一遍,就是双线性插值了. 线性插值的概念也非常简单粗暴,就是两个点A,B,要在AB中间插入 ...
- 2017 ACM-ICPC 亚洲区(南宁赛区)网络赛 F题
The Heaviest Non-decreasing Subsequence Problem 解题心得 这个题就是一个简单的动态规划,非递减最长子序列的改版(加一个权重),只要把权重为5的改成5个权 ...
- pytest分布式执行(pytest-xdist)
前言 平常我们手工测试用例非常多时,比如有1千条用例,假设每个用例执行需要1分钟.如果一个测试人员执行需要1000分钟才能执行完,当项目非常紧急的时候, 我们会用测试人力成本换取时间成本,这个时候多找 ...
- 新技术---- MongoDB
MongoDB 在 CentOS7 上安装 MongoDB-------https://www.linuxidc.com/Linux/2016-06/132675.htm Centos7 安装mong ...
- zoj 2679 Old Bill
Old Bill Time Limit: 2 Seconds Memory Limit: 65536 KB Among grandfather��s papers a bill was fo ...
- ASP.NET(二):Application、Session和Server对象
导读:在上篇博客中,总结了:Reques对象和Response对象的区别,以及IsPostBack属性的用法.其中说明Asp.net有6大对象,那么,这次就介绍剩下的3个对象,分别是:Applicat ...
- oracle11g rac 个性归档模式
关闭数据库并将一节点启动到mount状态 [root@QSZAAS-XYORC02 ~]# su - grid[grid@QSZAAS-XYORC02 ~]$ srvctl stop database ...
- oracle create directory
1.新建directory的语法 CREATE [OR REPLACE] DIRECTORY directory AS 'pathname'; 例如: create or replace direct ...
- BZOJ 2176 Strange string ——最小表示法
本来想用来练习后缀自动机的,但是100w有点虚(事实证明确实T掉了). 只好上最小表示法. #include <cstdio> #include <cstring> #incl ...
- mybatis学习(四)——config全局配置文件解析
在全集配置文件中引入dtd约束“http://mybatis.org/dtd/mybatis-3-config.dtd”,主要有以下几个标签,现在详细解释下这几个标签的使用 1.properties属 ...