首页 > 其他分享 >h5 自适应页面背景图无法自动适应的问题

h5 自适应页面背景图无法自动适应的问题

时间:2024-04-18 14:12:27浏览次数:22  
标签:scale h5 适应 width 视口 背景图 属性

 

有时候制作好自适应页面,上面用的是背景图,发现在手机中,宽度会出现不能100%显示的问题,虽然样式中我们使用了 width为100%。

加入以下语句

<html>
<head>
<meta name="viewport" content="width=1200px">

  

当只设置width属性值,而不指定initial-scale属性值时,大多数浏览器会自动缩放。

  如果width属性值大于理想视口宽度,则视觉视口放大为width的值,计算得到scale小于1.0;

      如果width属性值小于理想视口宽度,则视觉视口缩小为width的值,计算得到scale大于1.0;

标签:scale,h5,适应,width,视口,背景图,属性
From: https://www.cnblogs.com/fogwang/p/18143385

相关文章

  • 在pycharm里边怎么设置代码背景图的?
    大家好,我是Python进阶者。一、前言前几天在Python白银交流群【Kim】问了一个Python问题,然后他发出来的代码如下图所示:可以看到代码中有背景图,是不是看上去蛮高大上的?那么这个背景图是怎么加上去的呢?这里给大家介绍一下方法。二、实现过程这里【Kim】说到,这个是我vsode使用的......
  • 圈子社交系统--在线了解前后端,APP小程序H5,三端源码交付-多重玩法,新奇有趣。
    圈子论坛社区系统,含完整的后台PHP系统。功能:小程序授权登陆,H5和APP,手机号登陆,发帖,建圈子、发活动。圈主可置顶推荐帖子,关注、点赞、评论、交流等。可作为圈子贴吧等自媒体。一款全开源支持免费商用的圈子社区论坛系统;系统基于TP6+Uni-app框架开发;客户移动端采用uni-app开发,管理......
  • uniapp踩坑:编译H5解决浏览器跨域问题
    uniapp编译到app是不存在跨域问题的,但是编译到H5就会有跨域问题。记录一下工作中遇到跨域及解决跨域方法方法一:直接编译Hbuilder内置浏览器,能解决跨域,但是内置浏览器调试没有谷歌爽方法二:在manifest.json文件中配置跨域,该方法类似vue.config.js中的devServer 步骤一"......
  • 构建动态交互式H5导航栏:滑动高亮、吸顶和锚点导航技巧详解
    功能描述产品要求在h5页面实现集锚点、吸顶及滑动高亮为一体的功能,如下图展示的一样。当页面滑动时,内容区域对应的选项卡高亮。当点击选项卡时,内容区域自动滑动到选项卡正下方。布局设计css布局为了更清晰的描述各功能实现的方式,将页面布局进行了如下的拆分。★最外层的元......
  • CH582/CH592_EVT中RF_Device(主机)例程详解_底层自动跳频管理_支持一对七通讯
    目标程序路径: 与RF_Device程序相比,RF_Host主要讲解三个地方,其他接口与RF_Device一致,查看这篇博客:CH582/CH592_EVT中RF_Device(从机)例程详解_底层自动跳频管理_支持一对七通讯1、Host配对绑定逻辑:程序中默认逻辑为上电后前三秒钟允许配对绑定新设备,超过三秒钟则从flash中取出......
  • H5播放m3u8视频
    最近用爬虫爬取视频文件的时候,遇到了m3u8文件,按照正常的直接爬取mp4文件方式来直接爬取,只爬取了一个很小文件2K左右,我就觉得很奇怪,最后打开了文件看了下:还要将一段段的ts文件爬下来才可以正常的用h5来播放。最后爬取下来了m3u8文件和对应的ts文件,这时要用h5播放了,如果直......
  • Oracle 实现多语言(即根据用户登录的环境自适应本地语言)
    CREATEORREPLACEPACKAGEBODYOADBA.db_globalIS--設定參數值PROCEDUREset_value(parameterVARCHAR2,valVARCHAR2)ISBEGINDBMS_SESSION.set_context('db_context',parameter,val);ENDset_value;--取得參數值FUNCTION......
  • echarts折线图 x 轴 y 轴不展示 背景图为网格 鼠标划上样式修改等
    :header-cell-style="{backgroundColor:'#F6F8F9',color:'#333',textAlign:'center'}" 要求1、折线为渐变色2、折线区域渐变色3、x轴y轴不展示 4、折线图背景为网格   5、鼠标划上样式修改 constoption={title:{......
  • CH592 CH582 CH573从机例子添加RSSI信息获取
    以CH582HID_Mouse为例,新增RSSI获取和打印步骤如下 LIB库已经提供了回调接口,只需要在程序中定义函数体实现   连接成功后启动任务   代码编译 烧录到CH582种运行代码 连接成功后打印RSSI和handle值 ......
  • CH582/CH592_EVT中RF_Device(从机)例程详解
    依旧以CH582例程做讲解,CH592与CH582接口部分一致,其他地方大同小异。RF_Device例程路径: 1、main函数初始化配置 2、RF参数初始化 3、上电后启动绑定回连任务  4、RF_DMA初始化  5、RF绑定回调任务  6、数据发送接口 7、定时器测试发送数据到对......