前言:
入园第一天,想分享一点儿前端基础html css 的学习方法和一些经验给热爱前端,但是不知道从哪儿开始,依旧有些迷茫的新手朋友们。当然,适合每个人的学习方式不同,以下所讲的仅供参考。
一、关于基础语法
对于基础语法,此处不做讲解,有需要的同学可以在w3cschool、w3school、慕课网等等进行学习。如果是刚开始接触前端,不建议通过书籍进行学习,第一是因为书籍里面有的知识可能过于陈旧,已经在新版本中被废弃,第二是因为书籍里面知识体系十分全面,很多知识可能比较难理解,且平时做项目会很少用到,如果从头到尾把一本书啃完,需要消耗的时间成本会很大,关于前端,知识的更新迭代很快,因此,快速学习是一项首要需要培养的能力。
现在,html5和css3早已经很火,但是,刚开始一定是要先学习html4.0版本和css2.0版本,此时,关于在新版本中废弃的标签和语法就不要去使用了,等基础OK了,再学习html5和css3时,主要学习新增的部分,即关注差异即可。
二、关于编辑器
编辑器是为了提高开发效率的,用着习惯即可,当然,dreamweaver就不推荐使用了,初学者可以使用一些比较小巧的编辑器,Notepad++,EditPlus,sublime,HBulider等都是不错的选择。Webstorm 应该是目前最优秀的一款编译器,也是使用人数最多的,当然体积也比较庞大,适合后期开始做项目的时候使用。
HBulider是不支持插件安装的,所有的功能都是集成好了的,它的代码提示功能很完善,对于前期的学习使用完全是够用的。sublime 是需要自己安装插件的,网上也有很多教程,此处不再赘述,需要说明的是,大家在下载编辑器的时候,一定要去官网下载,不要直接用别人已经安装好插件的编辑器,虽然说编辑器只是作为工具,不应该花费比研究代码更多的时间去研究一款工具,关于安装插件,网上很多教程都解释地很清晰,但是,当你自己去做的时候,很可能会遇到各种各样的问题,所以有些坑必须要自己踩过,你才能有更深刻的认知。
三、关于代码规范
代码写得好不好,最终的结果实现仅仅是一小部分,编程过程中的代码的规范性及语义化尤为重要,如果自己写的代码第二天自己就看不懂写的是什么了,那么对于需求更改和代码维护将是一个灾难,同时,由于代码结构不清晰,编码不规范,也很容易导致错误,而且又不容易查找。所以,从一开始就应该养成良好的编码习惯,注重细节,一定可以帮助你在学习编程的路上更加顺畅。
在编码的过程中,应当尽量遵循xhtml的规范,它是一个标准更严格的html版本。
四、关于练习
基础语法学习过后,就可以按照自己想实现的页面动手制作了,只有多练习,才能踩更多的坑,然后通过查阅资料解决问题,才能对所学的进一步地理解,从而更加地融汇贯通。当然,善于总结也是很重要的。
如果暂时没有找到合适的页面进行练习,可以先模仿一些大的网站的其中一小模块,通过F12,可以打开控制台,查看到网页的源码,当然,也可以下载一些psd设计稿,进行页面还原。
五、关于切图
切图主要涉及到Photoshop的切图工具,画切片,然后存储为web所用格式即可。其他的细节,在使用过程中逐步学习即可。
六、关于基础阶段需要掌握的知识点
任何一门技术不是要等到你全部弄懂原理,完全精通了,才可以去做项目,都是需要在有一定的基础上,然后多做项目练习,逐步去深入的,所以,特别是知识储备阶段,一定是快速过基础,然后不断在项目练习中积累经验。
下面简单列一下基础阶段需要掌握的知识模块,以便于有一个整体的把握:
- 文件编码
- 路径
- 标签
- 属性
- 选择器、伪类选择器
- CSS样式
- 盒模型
- margin塌陷
- 块元素、行内元素、行内块及相互之间的转换
- 浮动、清除浮动
- 定位:相对定位、绝对定位、固定定位、定位层级
- 表单控件
- 单元格
- CSS Hack处理
结语:
吾生也有涯,而知也无涯,以热爱和敬畏的态度,不断地扩展知识的深度和广度,并在工作和生活中进行实践运用,大抵是幸福的一种诠释,你看世界,世界看你的!