移动端开发实战经验

原创 2016年09月02日 15:52:26

这是最近在移动端web-view中开发app时实际碰到的一些比较棘手显而易见的问题的小总结.

首先说说问题的表现形式.

有一天, 安卓开发人员拿来一部魅族手机, 给我展示了一下我写的html页面中出现比较奇怪的问题,
就是用highcharts画图画的图的高度变得十分诡异, 当时的表现是无限大. 然后也给我看了一些页面, 明明设计居中的元素并不居中了, 当下完全不知道是何原因, 一度怀疑是引入了rem造成了有些浏览器不兼容的原因, 也怀疑是不是highcharts不兼容, 对于第一个怀疑, 很快就排除了, 因为其他地方也有用rem做高度单位的, 但是并没有类似的问题, 对于第二个怀疑也很快排除了, highcharts是用纯js实现的插件, 一般不会有兼容问题, 那么是什么原因呢 . 于是 我开始在调用highcharts画图之前查看图像容器的高度, 发现是0, 可是明明设置了高度, 为什么还是0呢 ? 分别在css中和js中再次确认设置height后还是无效, 疑似某些安卓系统的web-view渲染 页面时不能识别height, 如何替代呢, 经过无数次的试验, 发现如果设置height无效, 还需设置min-height

同样发现margin-left 和 margin-right 也经常无效, 因为设置了这两个属性的值为auto后, 并不能使一个block元素居中, 而且更有甚者, 如果想用border-radius属性画圆, 则 margin-right的值会加到宽上, 导致画的圆都是椭圆, 不能居中的那一点, 现在想要的方案是设置一个外容器, 给它设置text-align: center 并让需要居中的容器本身的display设置为inline-block.

移动端的开发遇到了很多坑, 一个个发现再解决吧 .

移动端开发基本知识点总结

一. 使用rem作为单位 html { font-size: 100px; } @media(min-width: 320px) { html { font-size: 100px; } } @...
  • l583429595
  • l583429595
  • 2017年01月19日 19:28
  • 565

2017腾讯移动端开发暑期实习生面试总结(倒在二面)

2018届腾讯实习校招流程移动端开发岗的面试经验。在通过一面后不幸倒在了二面。...
  • tyc129
  • tyc129
  • 2017年04月24日 18:52
  • 746

移动端开发的一些技巧

开篇语 最近接手了一个移动端的项目。个人感觉是自己做得比较快而且比较健壮的一个。。。移动端最主要就是页面要适用不同的手机屏幕,ipad等。下面就分享一些技巧,让你不依赖任何框架高效地搭建自己的项...
  • binyao02123202
  • binyao02123202
  • 2016年06月10日 23:38
  • 4147

移动端开发

移动端开发目前我所了解到的三种方式:方式一:BootstrapBootstrap内置了一套响应式、移动设备优先的流式栅格系统,随着屏幕设备或视口(viewport)尺寸的增加,系统会自动分为最多12列...
  • qqewkkkw
  • qqewkkkw
  • 2015年07月28日 23:13
  • 195

MySQL实战(四)数据库事务

1、MySQL的隔离级别定义 MYSQL标准定义了4类隔离级别,用来限定事务内外的哪些改变是可见的,哪些是不可见的。隔离级别由低到高:Read Uncommitted < Read Committed...
  • chenwiehuang
  • chenwiehuang
  • 2016年10月11日 16:07
  • 344

移动端的基本概念与开发

设备独立像素 屏幕的大小、屏幕尺寸(别名叫点,是个单位) 获取:window.screen.width / window.screen.height  注意:1、横竖屏切换的时候。真机里的这个值...
  • Nancy_1990
  • Nancy_1990
  • 2017年06月28日 14:41
  • 95

实战经验

1.SQL外连接的连接条件不同,会影响查询结果。 2. 删除表得用 drop table tb1 ; 删除表中数据得用truncate table tb1; 删除表中行数据用delet...
  • W19960809
  • W19960809
  • 2017年07月12日 13:57
  • 136

移动端开发兼容性总结

每次h5开发,总会遇到一些兼容性bug,现在总结下,供大家参考。1)定位问题:ios 2)写背景图时最好加上top left 或者0 0 不然写运动效果时容易出现跳 3)防止手机中网页放大和缩小: 4...
  • xkweiguang
  • xkweiguang
  • 2017年02月07日 11:14
  • 2152

总结移动端页面开发时需要注意的一些问题

1、防止手机中网页放大和缩小,这点是最基本的,最为手机网站开发者来说应该都知道的,就是设置meta中的viewport 有些手机网站我们看到如下声明: DOCTYPE html PUBLI...
  • lz305263
  • lz305263
  • 2016年08月15日 15:48
  • 2916

响应式与移动端(一):万事俱备了吗?

“响应式的目标就是移动端”。这句话看似狭隘,但是狭隘是现实的产物。 一、现实是个什么玩意儿 选择移动优先还是PC优先,这样的争论是没有意义的,让哪个终端先行都无可厚非,我们会从以后的讨论中...
  • qq_32108839
  • qq_32108839
  • 2016年09月20日 17:45
  • 130
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:移动端开发实战经验
举报原因:
原因补充:

(最多只允许输入30个字)