亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

H5+css3春節賀卡之個人收獲

麻雀虽小,五脏俱全

虽然课程只是一个小小的移动端项目开发,但麻雀虽小,五脏俱全。
课程涉及到需求分析,切图,重构,优化等等知识!

一个好的项目,如果想要快速开发完成,知识储备肯定要充足!
html,html5,css,css3,javascript那肯定得会的!
都不会那得了解一番了!

HTML元素参考

html5指南

css&css3

javascript

代码会写了,编程工具得有一个好的哪!这能大大提高您的开发速度。当然,你十分厉害,用着记事本也能快乐的玩耍,这种大神,我只想说:“师傅,你收徒不?我能介绍个女同学您!”

前端开发工具技巧介绍—DW篇

前端开发工具技巧介绍—Sublime篇

WebStorm 有哪些过人之处?

开发工具很多,但最适合自己的才是最好的工具!

下面我们来进入项目开发过程!

项目分析
  • 由于项目面对的是移动端用户,并且主题是新春主题,所以表现形式得欢快活泼!
  • 项目涉及的特殊字体因为考虑到移动端并且有一定大小影响加载,所以采取图片代替
  • 图片方面尽可能压缩到无损最小值
  • 项目过小,用原生javascript代替其他框架.
  • 为了便于测试,使用WampServer为本地服务器测试环境
切图

切图的软件有Photoshop,Fireworks

前端工程师必备的PS技能——切图篇

重构涉及知识

前辈们分享的技巧我们得学习学习!避免进坑!

移动端页面开发资源总结

文章分享的包括!诸如:禁止缩放!宽度设置为设备宽度!禁止ios识别数字为电话号码等等!课程中的视口控制中的内容差不多都有一一讲到!并且也分享了很多老师没讲到的知识!

还有一本书里面的技巧也非常不错(推荐)!

HTML5移动Web开发实践

项目由于是三屏全屏结构!所以得设置html,body元素的高度为100%;
html,body{height:100%}

css3方面用到的是

CSS3 选择器——伪类选择器

Box-sizing

Animation

Transform

Background-size

Border-radius

vh

vw

rem

audio标签详细解析

audio

js方面

addEventListener()

TouchEvent

项目涉及的知识都了解了一番,那学习起来就不会一头雾水,云里云雾的了!跟着老师的脚步开发完成后,测试就是必不可少的了!这WampServer就发挥它的作用了!测试了一番后,bug方面解决了后,可以尝试把第三屏的对联动起来!这里有类似教程!

手淘年货节舞龙揭幕动画实战

总体来说,课程兼顾知识很多!也用了很多新特性!是一个非常棒的课程!

好了!这就是我看完整个课程所收获的东西!您的收获又是多少呢?欢迎大家一起探讨!

點擊查看更多內容
4人點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消