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 ...
随机推荐
- 启动myeclipse出现JVM terminated. Exit code=-1
在启动myeclipse时出现如图: 解决方法 第一种: myeclipse.ini中内存设置过大导致 修改: 256m改成128m,512m 改为 256m. 第二种:在myeclipse.ini ...
- UIBarButtonSystemItem 样式
使用时需要注意创建方式的区别: 01 typedef enum { 02 UIBarButtonSystemItemDone, 03 UIBarButtonSystemItemCanc ...
- C盘清理小技巧
步骤/方法 1 1 关闭休眠功能,在开始菜单的运行里输入powercfg -h off 指令,关闭休眠,此文件实际大小和物理内存是一样的,大约可以为C盘释放1-3G的空间. 2 2 设置虚拟内存: ...
- Python中的socket网络编程(TCP/IP,UDP)讲解
在网络编程中的一个基本组件就是套接字(socket).套接字基本上是两个端点的程序之间的"信息通道".程序可能分布在不同的计算机上,通过套接字互相发送信息.套接字包括两个:服务器套 ...
- 电子邮件中的to、cc、bcc
电子邮件中的to.cc(carbon copy)和bcc(blind carbon copy),分别是收件人.抄送.密送 to 收件人 你想要给其发邮件的人 cc 抄送人 cc和to是一样的,但是cc ...
- Cocoa-Cocoa对象
2.Cocoa对象 2.1 Objective-C是面向对象的语言 Objective-C和Java C++一样,有封装,继承,多态,重用.但是它不像C++那样有重载操作法.模版和多继承,也没有Jav ...
- HDU 5514 Frogs
Frogs Time Limit: 1000ms Memory Limit: 65536KB This problem will be judged on HDU. Original ID: 5514 ...
- 快速排序php
<?php /** * Created by PhpStorm. * User: brady.wang * Date: 2017/11/10 * Time: 9:45 */ $arr=array ...
- HackerRank# Candies
原题地址 LeetCode上也有这道题,直接扫一遍就行了,连数组都不用开,感觉像是蕴含了某种动归的思想在里面,要不怎么是个动归题呢 代码: #include <cmath> #includ ...
- 常州模拟赛d6t3 噪音
FJ有M个牛棚,编号1至M,刚开始所有牛棚都是空的.FJ有N头牛,编号1至N,这N头牛按照编号从小到大依次排队走进牛棚,每一天只有一头奶牛走进牛棚.第i头奶牛选择走进第p[i]个牛棚.由于奶牛是群体动 ...