html元素背景样式大小调整
定义元素背景设置 background-size属性cover自适应填充背景,background-size: 100% 100%; background-size: 左右比例 上下比例;
再介绍几个特殊属性:
background-clip :
background-origin :
background-size :背景尺寸。
background-break :
IE兼容background-size添加下面属性
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( sizingMethod='scale');sizingMethod='scale'<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>让IE兼容background-size的方法</title><style>.bgpic { background-image: url('http://img0.bdstatic.com/img/image/6992fdda3cc7cd98d10273a6b34233fb80e7aec90cc.jpg'); background-size: cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( sizingMethod='scale');}</style></head><body> <div class="bgpic" style="width:200px;height:100px;"></div></body></html> <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用img标签实现补充全屏效果</title>
<style>
body{
position: absolute;
overflow:hidden;
width: 100%;
height: 100%;
left: 0px;
top: 0px;
z-index: 0;
}
</style>
</head>
<body >
<img runat="server" id="stretch" src="http://img0.bdstatic.com/img/image/6992fdda3cc7cd98d10273a6b34233fb80e7aec90cc.jpg" style=" width:100%; height:100%;position: absolute;z-index: -1;" />
</body>
</html>
html元素背景样式大小调整的更多相关文章
- CSS3:元素的边框、背景和大小
边框 和边框相关的属性例如以下. border-width 用于设置边框的宽度,可选择包含: 1)<长度值>:将边框宽度设为以CSS度量单位(如em.px.cm)表达的长度值. 2)< ...
- Eclipse设置:背景与字体大小和xml文件中字体大小调整
Eclipse中代码编辑背景颜色修改:代码编辑界面默认颜色为白色.对于长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以改变workspace的背景色,可以使眼睛舒服一些.设置方法如下:1.打开wi ...
- Eclipse中设置背景颜色与字体大小和xml文件中字体大小调整
Eclipse中代码编辑背景颜色修改: 代码编辑界面默认颜色为白色.对于长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以改变workspace的背景色,可以使眼睛舒服一些.设置方法如下: 1.打开 ...
- Eclipse设置:背景与字体大小、xml文件中字体大小调整和自动提示 SVN插件安装
Eclipse中代码编辑背景颜色修改: 代码编辑界面默认颜色为白色.对于长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以改变workspace的背景色,可以使眼睛舒服一些.设置方法如下: 1.打开 ...
- MyEclipse背景与字体大小和xml文件中字体大小调整
1.打开window / Preference,弹出Preference面板 2.展开General标签,选中Editors选项,展开. 3.选中 Text Editors,右边出现TestEdito ...
- (备忘)Eclipse设置:背景与字体大小和xml文件中字体大小调整
Eclipse中代码编辑背景颜色修改: 1.打开window / Preference,弹出Preference面板 2.展开General标签,选中Editors选项,展开. 3.选中 Text ...
- CSS常用字体属性(多出的文本隐藏,或者以省略号的形式显示)和背景样式以及背景图的2个不常用属性:background-origin和background-clip
(一)常用的字体属性: font-weight: 属性值100-900 400等于正常 700等于bold ,数值越大,越粗 font-size:字体大小,单位可以为px或者% font-famil ...
- [19/06/07-星期五] CSS基础_布局&定位&背景样式
一.固定布局(不适应设备的浏览器的变化) <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...
- CSS3初学篇章_5(背景样式/列表样式/过渡动画)
背景样式 1.背景颜色语法:background-color : transparent | color body { background-color:#CCCCCC;} 2.渐变色彩语法:back ...
随机推荐
- ZPPR101-批量更改BOM组件
************************************************************************ Title : ZPPR101 ** Applicat ...
- linux查找webshell
原文出处:http://my.oschina.net/longquan/blog/155905 首先认识一下小马,一般大马容易暴露,骇客都会留一手,把小马加入正常PHP文件里面 <?php ev ...
- leetcode 138. Copy List with Random Pointer ----- java
A linked list is given such that each node contains an additional random pointer which could point t ...
- leetcode 135. Candy ----- java
There are N children standing in a line. Each child is assigned a rating value. You are giving candi ...
- JavaWeb学习记录(二十)——Model1模式(javaBean+jsp)实现简单计算器案例
¨JSP技术提供了三个关于JavaBean组件的动作元素,即JSP标签,它们分别为: ¨<jsp:useBean>标签:用于在JSP页面中查找或实例化一个JavaBean组件. ¨< ...
- Mac下的利器们介绍
先说说一些快捷键吧,从windows下过来还不很习惯: ctrl + 开关 关机等提示 ctrl+shift+开关 关闭显示器 cmd+option+v 相当于剪贴 cmd+tab,对于最小化了的窗口 ...
- Linux 查看CPU信息、机器型号等硬件信息
测试机器的硬件信息: 查看CPU信息(型号) # cat /proc/cpuinfo | grep name | cut -f2 -d: | uniq -c 8 Intel(R) Xeo ...
- Git-仓库迁移
如果你想从别的 Git 托管服务那里复制一份源代码到新的 Git 托管服务器上的话,可以通过以下步骤来操作.1). 从原地址克隆一份裸版本库,比如原本托管于 GitHub. git clone --b ...
- C#实现通过模板自动创建Word文档的方法
原文地址:http://www.jb51.net/article/55332.htm 本文实例讲述了C#实现通过模板自动创建Word文档的方法,是非常实用的技巧.分享给大家供大家参考.具体实现方法 ...
- asp.net中Cookie的用法【转】
比如建立一个名为aspcn,值为灌水小鱼的cookie HttpCookie cookie = new HttpCookie["aspcn"];cookie.Value = &qu ...