请选择 进入手机版 | 继续访问电脑版

喝彩资源网

查看: 826|回复: 0

微信公众号开发常见问题

[复制链接]

56

主题

60

帖子

318

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
318
发表于 2017-6-10 23:22:16 | 显示全部楼层 |阅读模式
1. 关于字体大小、图片大小、块元素大小的确定,目前一种方法,使用rem,rem的计算方式
document.documentElement.style.fontSize = document.documentElement.clientWidth / 10.8 + 'px';
其中10.8是设计图的大小除以100,这样就可以直接用设计图中的大小除以100的值。
a. px是相对于显示器屏幕分辨率而言的。
b. em是相对于对象内文本的字体尺寸,如果当前行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸,默认的是16px。以最近的有设置字体大小的父级为准。如果遇到一个代码块里有很多字体的,这种方式就会有局限性,比如
attachments-2017-03-fbH1zlBU58bce7b8b4ae5.png
中,child001中字体的大小就比span中的大很多,它是根据父级来的,但是父级也有父级,这样它的字体大小就是1.2*1.2*1.2*10, 而span就是1.2*10,所以em是有局限性的,对于复杂的嵌套关系会变得更加复杂。
c. rem是css3新增的一个相对单位,它和em的区别是它只相对于根元素,这里的根元素指的是html,如果适应不同的分辨率的话,需要知道一个基准的分辨率,如图片是根据1080来做的
对于是1080还是10.8这个自己定就行了,因为这个决定内部的font-size和height等的值的大小。
iphone中的分辨率,pt和px,pt是指逻辑分辨率,国际单位,px是物理分辨率,像素点为单位,是2倍和3倍的关系,微信的小程序用rpx其实和我们项目中rem的计算类似,以iphone6的750px为标准
而小程序中的css中的px是指逻辑分辨率
当元素设置这个属性后,content-box表示设置的width和height就是内容的width和height,不包括padding,border。border-box表示设置的width和height包括content padding border。
4. display:inline-block问题,会有上下左右间隙问题,需要子集设置float, 还有vertical-align:top,然后父级清除浮动,父级设置字体font-size:0
attachments-2017-03-Y2eRZ7EC58bce862b7e88.png
attachments-2017-03-VuSCY22u58bce8a0f1213.png
attachments-2017-03-RJRVa1Hc58bce8e61aa22.png
9.上传图片的展示,即预览
文件流
attachments-2017-03-sTHExfqf58bce927bd95b.png attachments-2017-03-xXRWDzen58bce94c41ceb.png




11.嵌入app端的html页面的跳转,需要协商怎么实现,目前是ios和android不同,android是直接使用的方法,ios用href地址或是trigger a 的click事件。a如果没有click事件,则不能trigger
13. 这个不是算移动端的,对于登录、注册、忘记密码中chrome如果记住密码了,则注册和忘记密码时也会有自动填充,如果避免的话,需要设置一个高度为0的密码框,并且不能是hidden的密码框
这样就可以了
attachments-2017-03-giL1TqYn58bcea08b5502.png
17.按钮透明度的问题,如果有disabled属性,则会根据父级的透明度来展示,无论按钮本身是否设置了不透明,所以这个需要改变方式,不用disabled属性
attachments-2017-03-ESw1DVOd58bcea6d442fc.png
//display: -webkit-box; 必须结合的属性 ,将对象作为弹性伸缩盒子模型显示 。
//-webkit-box-orient 必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式 。
//text-overflow: ellipsis;,可以用来多行文本的情况下,用省略号“…”隐藏超出范围的文本 。
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|喝彩资源网 ( 豫ICP备15004678号  

GMT+8, 2018-8-20 11:11 , Processed in 0.584758 second(s), 34 queries .

技术支持:喝彩资源网  豫ICP备15004678号

Powered by hecaikeji X3.2 © 2016-2018 hecai Inc.

快速回复 返回顶部 返回列表