背景图完全适应于屏幕
第四步、将容器宽度设置为 width:100%;容器高度设置为 height:100vh;(用兴趣的朋友可以将宽度设置成100vw试试)。 补充: CSS3引入的”vw”和”vh”基于宽度/高度相对于窗口大小 ”vw”=”view width”“vh”=”view height” 注: 第二步中的属性,不可以加载出本地的图片,需要进行转码,方可使用。 到此,你的图片就可以适用于所有手机屏幕了。
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- @(概述)[基本概念|百分比|rem|vw/vh|响应式设计] 移动端web页面的开发,由于手机屏幕尺寸、分辨率不...
- 响应式布局的常用解决方案对比(媒体查询、百分比、rem和vw/vh) 本文介绍在布局中常用的单位,比如px、%、r...