微信小程序如何获取屏幕宽度
微信小程序如何获取屏幕宽度
方法1:
imageLoad: function () {
this.setData({
imageWidth: wx.getSystemInfoSync().windowWidth
})
}
方法2:
.imgClass{
width: 100vw;
}
CSS3引入的”vw”和”vh”基于宽度/高度相对于窗口大小
”vw”=”view width”“vh”=”view height”
以上我们称为视窗单位允许我们更接近浏览器窗口来定义大小。
.demo {
width: 100vw;
font-size: 10vw; /* 宽度为窗口100%, 字体大小为窗口的10% */
}
.demo1 {
width: 80vw;
font-size: 8vw; /* 宽度为窗口80%, 字体大小为窗口的8% */
}
.demo2 {
width: 50vw;
font-size: 5vw; /* 宽度为窗口50%, 字体大小为窗口的5% */
}
.demo3 {
width: 10vw;
height: 50vh; /* 宽度为窗口10%, 容器高度为窗口的50% */
}
转:https://blog.csdn.net/kerryqpw/article/details/78802023
微信小程序如何获取屏幕宽度的更多相关文章
- 微信小程序开发技巧及填坑记录
以下是自己在开发过程中遇到的坑和小技巧,记录以下: 1.出现了 page[pages/XXX/XXX] not found.May be caused by :1. Forgot to add pag ...
- 来自于微信小程序的一封简讯
9月21晚间,微信向部分公众号发出公众平台-微信应用号(小程序)的内测邀请,向来较为低调的微信在这一晚没人再忽视它了. 来自个人博客:Damonare的个人博客 一夜之间火了的微信应用号你真的知道吗? ...
- 微信小程序的认识和开发适用性
来源:三节课课堂笔记 小程序认知 初识小程序. 目前微信小程序包括各类公众号接口的情况: 那么微信拥有的功能产品和对应的互联网产品有哪些: 小程序相当于AppStore应用分发市场: ...
- 不一样的角度 解读微信小程序
不一样的角度 解读微信小程序 七月在夏天· 2 天前 前段时间看完了雨果奖中短篇获奖小说<北京折叠>.很有意思的是,张小龙最近也要把应用折叠到微信里,这些应用被他称为:小程序. 含着金钥匙 ...
- 为苹果ATS和微信小程序搭建 Nginx + HTTPS 服务
昨天测试开发微信小程序,才发现微信也要求用HTTPS加密数据,想来是由于之前苹果的ATS审核政策的缘故吧,微信想在苹果上开放小程序必然也只能要求开发者必须使用HTTPS了,于是在服务器上测试安装Ngi ...
- 微信小程序入门之构建一个简单TODOS应用
最近开始了解微信小程序,虽然小程序已经出了很久了,刚出的那段时间很火,看到很多关于小程序的技术文章,不过现在似乎没那么火了,anyway,我们还是可以学习下的. 一.了解微信小程序 1.理念:小程序开 ...
- 线下市场,选择微信小程序从未显得如此重要
2017 年 1 月 9 日,小程序正式上线,到今日,3 月 8 号,这个新产品面世刚好满两个月.小程序刚推出便受到全球关注,腾讯股价当天即创逾一个月高位,但关注度先是急速上涨,不久便迅速降温,甚至在 ...
- 微信小程序怎么用?线下商家最适合玩小程序
随着微信小程序不断地释放新功能,许多行业越来越关注小程序,目前已经有不少餐饮和线下传统零售企业开始谋划利用好小程序.但是,线下商业有着复杂的场景,如何针对自己行业的特点和需求开发出属于自己的小程序,是 ...
- 从“跳一跳”来看微信小程序的未来
从“跳一跳”来看微信小程序的未来 相信大家这两天都被微信新推出的小程序跳一跳刷爆了朋友圈,为了方便用户在使用过程中切换小程序,微信在这次6.6.1版本中加入了下拉可快速切换小程序的功能,而“跳一跳 ...
随机推荐
- SQL Server从BAK文件还原新的数据库
同一个数据库多个副本 很多时候,比如为了方便测试,排查问题,我们常常会拿到问题系统的数据库备份来开发环境下debug,这个时候就会出现同一个数据库的多个副本. 还原法 还原到一个新建的空数据库,在选项 ...
- PHP如何发送邮件
例如使用163邮箱 SMTP,Simple Mail Transfer Protocol,简单邮件传输协议 保证我们的邮件服务器开启了SMTP服务 设置授权码 使用PHPMailer类发送邮件 1 ...
- CentOS yum时出现"Could not retrieve mirrorlist"
问题描述: CentOS 6.x minimal(最小化) 安装, CentOS yum install net-tools 时出现"Could not retrieve mirrorlis ...
- idea 配置svn
1.情景展示 idea安装好后,如何配置svn? 2.分析 由于没有针对idea的svn插件,因此只能选择安装svn的客户端. 3.解决方案 第一步:下载小乌龟SVN客户端: 官网地址:htt ...
- UI Automation的两个成熟的框架(QTP 和Selenium)
自己在google code中开源了自己一直以来做的两个自动化的框架,一个是针对QTP的一个是针对Selenium的,显而易见,一个是商业的UI automation工具,一个是开源的自动化工具. 只 ...
- python模块之HTMLParser之穆雪峰的案例(理解其用法原理)
# -*- coding: utf-8 -*- #python 27 #xiaodeng #python模块之HTMLParser之穆雪峰的案例(理解其用法原理) #http://www.cnblog ...
- MBTiles 1.2 规范翻译
MBTiles 1.2 可以参考超图的文档MBTiles扩展 具体实现可以参考浅谈利用SQLite存储离散瓦片的思路和实现方法 mapbox提供了一个简单实现测试代码,github地址在这里https ...
- 9273:PKU2506Tiling
9273:PKU2506Tiling 来源:http://noi.openjudge.cn/ch0202/9273/ 总时间限制:2000ms 单个测试点时间限制:1000ms内存限制:131072 ...
- 菜鸟云打印接入Demo
菜鸟云打印接入Demo 0. 接入流程图 1. 连接打印客户端 首先要打开打印客户端,然后使用下面的方法,连接客户端(WebSocket协议): 地址 : 连接打印客户端 function doCo ...
- T550 HiDPI Ubuntu 16.04安装流水帐
U盘安装 需要用Win32DiskImager刻录iso到U盘 输入法 安装时选择的是英文, 所以默认没有中文的输入法, 但是浏览中文网页是没问题的, 而且字体都正常. 在System Setting ...