目录1. 定义2. 特点2.1. Progressive2.2. Responsive2.3. Connectivity Independent2.4. App-like2.5. Fresh2.6. Safe2.7. Discoverable2.8. Re-engageable2.9. Installable2.10. Linkable3. 历史4. 环境要求5. 核心概念5.1. application shell与content6. 关键技术6.1. service worker的角色6.2. service worker的生命周期6.3. 消息推送7. 案例体验7.1. 设计App Shell—由设计稿划分component组件7.2. 创建app shell对应的模版文件7.3. 完成相应逻辑-刷新天气，增加城市等7.4. 实现首次快速加载7.5. 使用service worker实现对app shell的预缓存（功能的离线使用）7.5.1. 注册service worker7.5.2. 缓存网页资源7.5.3. 通过缓存提供app shell的内容7.5.4. 测试离线情况7...阅读全文

解决 IE 中 placeholder 属性兼容问题2016-08-01 16:08
####本篇文章主要介绍了使用 jQuery 解决日常工作中的一些小问题。####
######你身为一名前端，或者你即将走向前端之路，如果你没有听过大名鼎鼎的 Jquery,那么你将是不合格的一名前端工程师，虽然现在前端领域各式各样的框架引人注目，甚至大部分人对 Jquery 嗤之以鼻，但是，纵观前端领域，优质的前端屈指可数；所以本文针对合适的人解决合理的事情。
###众所周知，IE 浏览器在 Web 开发过程中，对于前端工程师来说，无疑是噩梦，特别是IE9以下的版本，这个小节，我们将来讨论如何使用使用 jQuery 快速解决 input 中 placeholder 值在 IE 中无法支持的问题。需要的朋友可以过来参考下，希望对大家有所帮助。###
####首先先引入 Juery 文件，附上官网 http://jquery.com然后在针对表单控件写入相应的JS从而解决兼容问题。（注意JS加载的顺序）####
思路：为不支持 placeholder 的浏览器创建其属性或者对其浏览器做判断，...阅读全文

####如今将近十年过去了,移动互联网风光依旧，前端更是无处不在。####

###可是，招人真心难，招前端更难，招个好前端难上加难有木有~~
###主观意识&经验之谈
######然而说到招人，就不能不提到面试，说面试是一门玄学实不为过，特别是对于刚毕业的大学生，一般大厂和”当红”互联网公司都会走 笔试、面试、复试三个环节，然而开发工程师每轮面试时间一般为一小时左右，除非面试官对你没有兴趣，否则不会十几分钟就打发走你(我厂要求面试至少20分钟)。而且就在这差不多一小时，面试官要判断你是否符合招聘的岗位，这本身就是一件非常挑战的事情。正因为这样，所以面试官的决定都有一定的风险和主观意识，这不可避免。
###个人态度&职业素养
你还真别被互联网上的传言给忽悠了，所谓人云亦云，大家都常调侃，程序员的刻板印象，小平头，戴一眼镜，双肩包，格子衬衫，千年不换的牛仔裤，帆布鞋；完事儿，你也潜移默化的去把自己捯饬成这样，自认为只要是程序员都这样；也甭说穿西装打领带抹一小红嘴唇了，穿得简洁得体，至少让人感觉你重视这场面试。
面试的时候，记得带上纸质简历和作品（最好带上电脑，大牛除外），简...阅读全文

####当你满腔热情，一门心思只往前端事业发展时，如何成为一名优秀的前端工程师。
什么是前端工程师？总而言之,就是运用 HTML、CSS、JavaScript 等 Web 技术，在工作中配合UI设计师实现用户界面，和后端工程师进行数据对接，完成 Web 应用开发的职位。

先来个下马威
#####别害怕，没有人能把这些都学个遍，学好基础，拎一部分，满足工作中的业务需求就可以了。
梳理清楚知识体系框架学习一样东西，首先得先去了解它的定义，和大概的框架结构，梳理好思路，然后再一个萝卜一个坑，循序渐进的去丰富自己的知识体系。有人说，前端东西多而杂，你今天刚弄明白一框架，明天又出一新框架，其实大可不必去理这些花里胡哨的框架，毕竟在真正的工作环境中，你是一名业务驱动型的程序员。
好了，废话不多说，先上菜

是不是感觉前端东西不就这几样吗？？别急，这里面看似简单，每一门学精了，没个三年五载的，你都不好意思说你会。

万事开头难，一步一步来，如今充斥着各大前端框架理念。”MVVM”、”MVC”、”MV*“、”模块化”、”高性能”等等，您可别被这些迷住了眼，不都得先打基础，HTML...阅读全文

animation-name 规定需要绑定到选择器的 keyframe 名称。。animation-duration 规定完成动画所花费的时间，以秒或毫秒计。animation-timing-function 规定动画的速度曲线。animation-delay 规定在动画开始之前的延迟。animation-iteration-count 规定动画应该播放的次数。animation-direction 规定是否应该轮流反向播放动画。线性渐变背景一共7个动画，就把它们都放在一块儿，并成一排吧。
HTML<div class="container"><div class="sunny"></div><div class="cloudy"></div><div class="rainy"></div><div class="snowy"></div><div class="rainbow"></div><div class="starry"></div><div class="stormy"></div></div>首先，先让container这个垂直和水平居中，其次，7个晴雨表宽度为了保持...阅读全文