文档章节

HTML中使背景图片自适应浏览器大小

mufengs
 mufengs
发布于 2016/10/09 23:27
字数 159
阅读 135
收藏 0

解决办法: 1、图片不够大,又background属性不能拉伸图片; 2、只能用个div,把其z-index值设为负,并使这个div大小为整个body大小,在div里用<img> ; 3、body的background属性去掉,要不然会被遮住。

<html>  
<body>  
<div id="Layer1" style="position:absolute; left:0px; top:0px; width:100%; height:100%">  
<img src="pictures/background.jpg" width="100%" height="100%"/>  
</div>  
</body>  
</html>  

如果想让图片不随浏览器右边滚动条滚动,就用position:fixed属性。wordpress建站的达人们也可以用此方法,在指定页面定制自己的背景图片。

本文转载自:http://blog.csdn.net/liuliang841210/article/details/39993541

mufengs
粉丝 0
博文 37
码字总数 7056
作品 0
南京
程序员
私信 提问
css 背景图不拉伸自适应屏幕大小

效果图 全屏: 背景图尺寸大于屏幕尺寸,背景图只显示跟屏幕一样大小内容 小屏时: 如效果图所示,图片并没有发生压缩、或者缩小比例,它只是显示跟屏幕尺寸大小的内容,至于如何控制缩小浏览...

xiaoxin502
2015/12/08
4.1K
0
Html5 CSS设置背景图片

昔闻H5,今学H5。 本文聊聊网页设置背景图片,用URL设置图片路径很简单,关键是图片位置匹配。 当然,图片资源太不好,调着又太麻烦,我们换图,送你中get图片资源的方式。 请看【三、设置太...

AmosWang
2016/07/13
1K
0
CSS3:background-size背景图片尺寸属性

background-size可以设置背景图片的大小,数值包括 长度length和百分比percentage。 并且会根据背景原点位置background-origin设置其图片覆盖的范围。那么下面我们一起来了解这个background-...

Sherlock_z
2015/10/14
8.7K
0
React项目实战(四)滚动的数字

上一篇React项目实战(三)尝试实现一个拉动刷新组件 需求 分析:我们要实现一个数字滚动效果,保证每个位上的数字都至少滚动一周,滚动效果是自下往上。让我们先思考一下几个细节: ① 方案...

Ephemera
05/17
0
0
HTML5 背景图片自适应屏幕的大小

在日常的开放中,经常会遇到有背景图片的时候,现在不同屏幕大小的手机又很多,如何让背景图片自适应屏幕的大小了。 在网上搜了很多方法,有的还不一定的能解决问题。如下办法,是我经常使用...

突然很想飞
2015/12/10
27.7K
0

没有更多内容

加载失败,请刷新页面

加载更多

CentOS7.6中安装使用fcitx框架

内容目录 一、为什么要使用fcitx?二、安装fcitx框架三、安装搜狗输入法 一、为什么要使用fcitx? Gnome3桌面自带的输入法框架为ibus,而在使用ibus时会时不时出现卡顿无法输入的现象。 搜狗和...

技术训练营
昨天
5
0
《Designing.Data-Intensive.Applications》笔记 四

第九章 一致性与共识 分布式系统最重要的的抽象之一是共识(consensus):让所有的节点对某件事达成一致。 最终一致性(eventual consistency)只提供较弱的保证,需要探索更高的一致性保证(stro...

丰田破产标志
昨天
8
0
docker 使用mysql

1, 进入容器 比如 myslq1 里面进行操作 docker exec -it mysql1 /bin/bash 2. 退出 容器 交互: exit 3. mysql 启动在容器里面,并且 可以本地连接mysql docker run --name mysql1 --env MY...

之渊
昨天
10
0
python数据结构

1、字符串及其方法(案例来自Python-100-Days) def main(): str1 = 'hello, world!' # 通过len函数计算字符串的长度 print(len(str1)) # 13 # 获得字符串首字母大写的...

huijue
昨天
6
0
PHP+Ajax微信手机端九宫格抽奖实例

PHP+Ajax结合lottery.js制作的一款微信手机端九宫格抽奖实例,抽奖完成后有收货地址添加表单出现。支持可以设置中奖概率等。 奖品列表 <div class="lottery_list clearfix" id="lottery"> ......

ymkjs1990
昨天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部