前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >设置背景图片,解决手机上背景图片高度适应问题

设置背景图片,解决手机上背景图片高度适应问题

作者头像
wfaceboss
发布2019-04-08 10:47:05
1.8K0
发布2019-04-08 10:47:05
举报
文章被收录于专栏:wfacebosswfaceboss

第一种方法:直接对图片进行设置,代码如下

代码语言:javascript
复制
<img src="url" class="PhoneBack">//url为图片地址

.PhoneBack{
position: fixed;
z-index: -10;    
display: block;
width: 100%;
height: 100%;
}

第二种方法:使用一个div作为容器,同时给改该div设置背景图片

代码语言:javascript
复制
标签1:
<div class="PhoneBack">
//其他内容
</div>

样式1:
.PhoneBack{
    position: fixed;
    z-index: -10;
    background: url('../Images/weixin/NowRegister/RegisterBack.png') no-repeat 0px 0px;
    width: 100%;
    height: 100%;
    /*background-repeat: no-repeat;
    background-position: 0px 0px;*/
    background-size: 100% 100%;
}

第三种方法:使用jquery

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017-12-07 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
容器服务
腾讯云容器服务(Tencent Kubernetes Engine, TKE)基于原生 kubernetes 提供以容器为核心的、高度可扩展的高性能容器管理服务,覆盖 Serverless、边缘计算、分布式云等多种业务部署场景,业内首创单个集群兼容多种计算节点的容器资源管理模式。同时产品作为云原生 Finops 领先布道者,主导开源项目Crane,全面助力客户实现资源优化、成本控制。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档