当前位置: 首页 > article >正文

uniapp 兼容pc与手机的样式方法

在h5的开发中,做视窗的样式兼容和适配,大家肯定都知道移动端使用自适应单位rpx,pc端可以使用媒体查询的方法来适配,但是在uniapp 项目开发中,有时在移动端展示的样式会被在桌面端打开,渲染在浏览器,这时候你会发现,因为用的是移动端适配的rpx 导致在pc端查看样式显示非常小,这时候,就需要做相应的兼容了,其实uniapp 也是有相应的方法来做识适配的:

当页面最小宽度 375px, 页面宽度最大 800px 时显示
    <match-media :min-height="400" :orientation="landscape">
        <view>当页面高度不小于 400px 且屏幕方向为横向时展示这里</view>
</match-media>

在uniapp中,match-media可以很好的来判断兼容和适配


http://www.kler.cn/a/273066.html

相关文章:

  • Python网络爬虫:入门与实战
  • HTML5+css3(伪类,动态伪类,结构伪类,否定伪类,UI伪类,语言伪类,link,hover,active,visited,focus)
  • Linux curl命令下载显示时间/速度/大小
  • 浅谈UI自动化
  • 基于深度学习的数据安全与可追溯性增强
  • 【Python】【数据可视化】【商务智能方法与应用】课程 作业一 飞桨AI Studio
  • hcia复习总结9
  • Custom GPTs Are Here and Will Impact Everything AI
  • Milvus向量数据库检索
  • 【大数据面试题】 018 数据仓库的分层了解吗?说说你的理解
  • Python 小爬虫:爬取 bing 每日壁纸设为桌面壁纸
  • 最新WordPress网址导航设计师主题风格网站源码
  • 基于vue实现bilibili网页
  • Java面试题总结15之简述你对RPC,RMI的理解
  • 如何用 UDP 实现可靠传输?并以LabVIEW为例进行说明
  • springboot277流浪动物管理系统
  • python 直方图
  • js基础语法大全(时间戳,uuid,字符串转json)
  • 大模型—概念
  • 从零开始学HCIA之SDN04
  • HTML_CSS练习:HTML注释
  • 掘根宝典之C++RTTI和类型转换运算符
  • 【通信原理笔记】【二】随机信号分析——2.4 复随机过程
  • 提升地理空间分析效率,火山引擎ByteHouse上线GIS能力
  • 基于正点原子潘多拉STM32L496开发板的简易示波器
  • 【Unity】Transform、Rigidbody、CharacterController移动