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设置背景图片自适应的更多相关文章

  1. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  2. css 设置背景图片模糊,内容不模糊

    需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...

  3. bootstrop设置背景图片自适应屏幕

    如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做: <style type="text/css"> html{height: %;} body.a ...

  4. css设置背景图片,ie显示不了

    本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...

  5. (转)background-position—CSS设置背景图片的位置

    background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置.因为在默认情况下背景图片都是从设置了 background-posit ...

  6. 使用CSS设置背景图片,图片比较大,完全显示在一个DIV中

    做的时候想要边框为比较好看的样式,需要UI切图并且放在div中,看起来会好看点 像这样的,我随便挑选了一个,UI帮我切图出来 需要把这个图片填到相应的div里面,但是很显然碰到一个问题,图片太大,而且 ...

  7. css 设置背景图片透明

    最终效果: 背景图片css不变,再背景图片的里层元素设置css样式即可 opacity:0.4; filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */

  8. css设置背景图片

    background:pink;图片在背景图上面 background-image:url(food.jpg);一张图片铺满一行background-repeat:repeat-x;同一张图片多张铺满 ...

  9. css 设置背景图片铺满固定不动

    #page{ position: relative; width: 100%; height: 100%; background-image:url(../img/bg.JPG); backgroun ...

随机推荐

  1. Python语言程序设计之三--列表List常见操作和错误总结

    最近在学习列表,在这里卡住了很久,主要是课后习题太多,而且难度也不小.像我看的这本<Python语言程序设计>--梁勇著,列表和多维列表两章课后习题就有93道之多.我的天!但是题目出的非常 ...

  2. shell 中exec、source以及bash的区别

    在bash shell中,source.exec以及sh都可以用来执行shell script,但是它们的差别在哪里呢? sh:父进程会fork一个子进程,shell script在子进程中执行 so ...

  3. (转)TDD的iOS开发初步以及Kiwi使用入门

    本文转自“瞄神”博客 TDD的iOS开发初步以及Kiwi使用入门 测试驱动开发(Test Driven Development,以下简称TDD)是保证代码质量的不二法则,也是先进程序开发的共识.App ...

  4. Codeforces Round #879 (Div. 2) C. Short Program

    题目链接:http://codeforces.com/contest/879/problem/C C. Short Program time limit per test2 seconds memor ...

  5. 浅谈 HTTP 协议

    一. HTTP简介 超文本传输协议 Hyper Text Transfer Protocol 是一种用于分布式.协作式和超媒体信息系统的应用层协议 HTTP是万维网的数据通信的基础 HTTP有很多应用 ...

  6. vscode python code-runner 中文乱码解决

    https://www.cnblogs.com/zhaoshizi/p/9050768.html 这里我使用的是第二种方法

  7. HP DL380 G5 安装操作系统流程

    1.准备服务器引导盘,设置光盘启动.注意:会将服务器所有数据清除 2.依据引导盘选择需要的安装系统 3.插入系统安装光盘.ps:若kvm等远程工具无法插入光盘,需要插入物理介质的安装光盘

  8. ubuntu14.04:php7+apache2+mysql

    apache2: sudo apt-get install apache2 apache2-dev service apache2 start mysql: sudo apt-get install ...

  9. oracle客户端安装与配置

    在进行开发时经常需要连接Oracle数据库,一般的场景是Oracle数据库在远程服务器上,本地计算机通过plsql developer来访问. 这就要求在本地安装好plsql developer,但是 ...

  10. BZOJ-1269 文本编辑器

    .... 这道题就是Noi原题嘛...虽然更容易写... 题意: 建立一个数据结构,并支持以下操作: Insert 区间插入有序序列:Delete 区间删除:Rotate 区间翻转:Get 单点查询 ...