零基础学习HTML和CSS前台知识

  • 时间:2019-01-14 22:11 作者:天天记 来源:天天记 阅读:152
  • 扫一扫,手机访问
摘要:小白自学最初的定义就是给大家带来学习分享,而小白曾经是技术出身,所以今后小白会分享更多的互联网技术,希望能给想学习的朋友带来一点引导。前段时间,在我们校友群里,有一个小学弟想学习前台开发,但是不知如何去学习,那么今天就从最基本的前台知识给大家整理一个学习思路基础既然是零基础,那咱们就从基础学起。现在

小白自学最初的定义就是给大家带来学习分享,而小白曾经是技术出身,所以今后小白会分享更多的互联网技术,希望能给想学习的朋友带来一点引导。

前段时间,在我们校友群里,有一个小学弟想学习前台开发,但是不知如何去学习,那么今天就从最基本的前台知识给大家整理一个学习思路

基础

既然是零基础,那咱们就从基础学起。

现在国内前台的确很热,所以相关性的学习资料很多,随时都能在网上找到很多相关的学习资源,但是没有人专门去梳理过正确的学习流程,所以有些初学者很迷茫。

零基础学习HTML和CSS前台知识

前台的学习基础无非分为三块:

HTML----通过代码实现控制内容

CSS------控制样式色彩体现

JS---------控制动态效果展示

基本上这三点就概括了前台的基础,接下来详细说下如何去学习这几个方面。

HTML、HTML5学习

教程中的所有标签,不需要每个都能一下就一律掌握,大概理解什么情况下使用什么标签即可以了。学习技术切记死记硬背,需要多多的练习,动手多了标签的使用和特性就能一律弄清楚了。

CSS、CSS3

CSS是重点,需要我们多学习,语法,类都要弄清楚使用方法,重点需要学习的是选择器的优先级和语法,一个高效的CSS重点在于选择器写的是不是完美。

学习DIV布局

在布局中,有很多标签都要用到,根据需求选择不同的标签,这里重点需要理解的是DIV的使用,熟习和练习常见的布局方式。

仿站:模仿PC和移动端

通过对前面的理解,布局和CSS已经可以支撑整个网页的基本制作了,而前面都是少量零散的学习,所以这个时候我们要把布局和CSS整合到一起,从头到尾练习一遍,熟习网站的基本组成和结合应用。

思考和尝试

HTML和CSS是如何组成整个页面的?如何通过精简代码做到同样的效果,优化结构是我们需要进阶的。

通过仿站我们要训练自己的布局意识和色彩感知度,从而做出一个漂亮的前台页面。

不过等等!是不是漏掉了JS呢?

其实在这三部分中,最重要的反而是JS,由于JS可以动态的控制所有的HTML和CSS呈现效果,所以JS才是前台最重要的一部分。但是JS再强大也要基于HTML和CSS去学习。

基础语法:所有的语法都可以到w3school中去学习,讲解案例都比较完整。

学习重点:学习JS就要学习实现交互的事件和DOM操作,这些是JS最基本也是最重要的,任何相关JS的扩展都是基于此来完善和升级的。

代码结构和习惯培养

JS要学习什么是函数,什么是对象,只有理解了这些,你才能更好的组织书写JS脚本,做到有条理、有顺序、无冗余,这才是JS要真正做到的水平。

学习进阶

开发调试工具:现在很多工具在开发中都能起到辅助作用,那么在这里小白个人比较推荐火狐浏览器中的FIREBUG 。HTML、JS/CSS都能实时调整和展示,所以调试很爽!

执行效率:最开始学习是为了能够理解和使用,随着对代码的熟习,应该要做到的是如何提高代码执行效率,性能的提升和优化是我们开发中要考虑的很重要的因素之一。

代码规范:平常使用中还有一点需要我们特别注意的是代码的规范化,代码的注释,习惯使用板块来打造整个代码布局,做到后续查找或者者修改更方便,让人看得更容易。

PS:最后我们要理解的就是服务器的开发,毕竟任何前台都要对接后台,所以假如有时间或者者有条件就理解下。对我们都会有很好的帮助。

每个人都有不同的看法和不同的见地,小白做为一个曾经学过技术的人,浅浅的给予朋友们一点学习的思路,希望有想学的人,可以来看一下,我接下来会继续分析很讨论技术相关内容。

  • 全部评论(0)
最新发布的资讯信息
【系统环境|】你是HTML 5的一员吗?(2019-08-15 11:58)
【系统环境|】Web前端基础怎么学?html、css、JavaScript 知识架构图(2019-08-14 17:55)
【系统环境|】零基础小白走Web前端之路是否可行?答案是yes!(2019-08-13 11:44)
【系统环境|】你知道Web前端与HTML5技术的区别吗?(2019-08-12 14:10)
【系统环境|】移动前端开发和web前端开发的区别(2019-08-11 16:49)
【系统环境|】给新手的锦囊:Web前端开发小白的学习建议和路线图(2019-08-10 16:34)
【系统环境|】都说web前端开发薪资高,入行就有上万月薪,转行难吗?(2019-08-09 14:55)
【系统环境|】干货教程 | Web前端开发学习入门指南(2019-08-08 18:27)
【系统环境|】前端开发:vue路由之前端路由的原理(2019-08-07 13:17)
【系统环境|】你不知道的web前端那些事(2019-08-06 12:29)
手机二维码手机访问领取大礼包
返回顶部