摘要: 许久没有写博客了,最近有个H5启动APP原生页面的需求,中间遇上一些坑,看了些网上的实现方案,特意来总结下 一、需要判断客户端的平台以及是否在微信浏览器中访问 1、客户端判断 在启动APP时,Android和IOS系统处理的方式是不一样的,Android这边由于开放,可以在浏览器中通过<a>标签以及 阅读全文
posted @ 2017-07-06 15:51 motian 阅读(768) 评论(0) 推荐(0) 编辑
摘要: 前端性能优化的方法? content方面 1,减少HTTP请求:合并文件、CSS精灵、inline Image 2,减少DNS查询:DNS查询完成之前浏览器不能从这个主机下载任何任何文件。方法:DNS缓存、将资源分布到恰当数量的主机名,平衡并行下载和DNS查询 3,避免重定向:多余的中间访问 4,使 阅读全文
posted @ 2017-07-06 15:47 motian 阅读(127) 评论(0) 推荐(0) 编辑
摘要: <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui" /> width: viewport 的宽度 (范围从 200 到 10,000 ,默认为 980 像素 阅读全文
posted @ 2017-07-06 15:45 motian 阅读(152) 评论(0) 推荐(0) 编辑
摘要: .如果你把transform真的掌握的和纯熟的话,就可以直接通过CSS做出很多很炫酷的效果,甚至.轮播图和选项卡都可以通过CSS来做,咱们明天就说如何运用CSS来做轮播图,大家记得看哦! 很好,话不多说,翠花'上代码': 1 <!DOCTYPE html> 2 <html> 3 <head> 4 < 阅读全文
posted @ 2017-07-06 15:44 motian 阅读(866) 评论(0) 推荐(0) 编辑
摘要: html5 audio标签在ios 微信浏览器中是无法自动播放的,最近在做一个小的项目遇到这个问题,安卓和pc都是正常的,唯独ios不行,查阅了很多资料,找到了以下方法,也许不是最好用的方法,如果有更方便的方法,尽请留言: html部分: <audio id="audio"><source src= 阅读全文
posted @ 2017-07-06 15:42 motian 阅读(976) 评论(0) 推荐(0) 编辑
摘要: 一、css顺序 首先声明,浏览器读取css的方式是从上到下的。我们一般书写css只要元素具备这些属性就会达到我们预期的效果,但是这会给以后的维护和浏览器的渲染效率带来一定的影响,那么该怎么书写css的顺序呢?有没有一定的规范呢? 首先我们知道css的属性按特性分为几类; 1.规定元素特性,如disp 阅读全文
posted @ 2017-07-06 15:40 motian 阅读(115) 评论(0) 推荐(0) 编辑
摘要: html5提供了一个<canvas>标签,结合javascript的canvas api接口可以用来绘制图形和动画。最近工作中涉及到画图的任务,下面来了解一下canvas的基础:canvas画布。 1 <style type="text/css"> 2 body {padding: 40px 0 0 阅读全文
posted @ 2017-07-06 15:38 motian 阅读(222) 评论(0) 推荐(0) 编辑
摘要: HTML5 DOM 为 <audio> 和 <video> 元素提供了方法、属性和事件。 这些方法、属性和事件允许您使用 JavaScript 来操作 <audio> 和 <video> 元素。 ·首先带大家熟悉一下video标签的属性方法,根据属性方法做一个小demo, HTML5支持的视频格式: 阅读全文
posted @ 2017-07-06 15:37 motian 阅读(3220) 评论(0) 推荐(0) 编辑
摘要: 前言 HTML5 中提供的文件API在前端中有着丰富的应用,上传、下载、读取内容等在日常的交互中很常见。而且在各个浏览器的兼容也比较好,包括移动端,除了 IE 只支持 IE10 以上的版本。想要更好地掌握好操作文件的功能,先要熟悉每个API。 原文作者:林鑫,作者博客:https://github. 阅读全文
posted @ 2017-07-06 15:36 motian 阅读(255) 评论(0) 推荐(0) 编辑
摘要: 首先介绍一下概念 devicePixelRatio其实指的是window.devicePixelRatio window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。 公式表示就是:window.devic 阅读全文
posted @ 2017-07-06 15:36 motian 阅读(11351) 评论(0) 推荐(2) 编辑