当前位置:首页 > 技术文章 > 正文内容

web前端入门:css+html5+javascript同时学可以吗?

HTML+CSS+JS是前端基础核心知识,肯定是都要学的。在web前端中,HTML是结构标准,CSS是样式标准,JS是行为标准,三者缺一不可。说的直白点,HTML就是骨架,CSS就是皮肤,JS就是灵魂。

虽说三者的重要性很难分出高下,但在不同的领域里三者有不同的侧重,比如侧重结构布局时,HTML独占优势,侧重样式表现时CSS功能强大,侧重逻辑与交互时,便离不开JavaScript。这么说,可能新手还是一脸懵逼,那我到底应该先学哪个再学哪个最后学哪个呢,还是说三者同时进行?三者之间有没有关联? 哪种是需要着重侧重的,或者是三点都要进行侧重?在学习的时间安排又应该如何掌握?

用户通过在浏览器输入HTML页面网址,使浏览器向服务器发出请求,服务器收到请求后返回相应的HTML文件,这就是HTML页面加载和解析过程。我们先用一个例子来理解一下:

从上图看出,这三者是可以同时搭配使用的。首先HTML是基础,也相对简单,小白很容易入门,但一般需要配合CSS和JavaScript来使用,否则展示效果和交互体验都不够好;CSS一般是不能脱离HTML的,因为它的作用就是给HTML元素设置展示样式;JavaScript是可以脱离HTML和CSS独立出来的,并且可以操作HTML和CSS。

很多新手小白最拿不准的是web前端的核心是CSS还是JavaScript。

CSS作为负责调样式的初级前端,则CSS的应用占比大过于JS,这其中有很多的技术。比如:游戏动画效果,CSS3中新增的Canvas、SVG和WebGL,如果你能把CSS学精学透还能深入研究浏览器的实现原理,其实是很了不起的事,并不是像很多人说的那样CSS就是调调颜色和宽高,不属于核心技能;

JavaScript是一种计算机脚本语言,通过嵌入在HTML文档中来实现控制网页的效果。使用JavaScript可以通过实现网页和用户之间的交互来提高用户体验。ES6更是把JavaScript带到了一个更大的舞台,使得前端也能像后端那样开发复杂的程序,大大提高了前端开发工程师的生产力。如果要进阶高级前端工程师,JavaScript是你需要花大量时间研究学习的。另外对于入门者和初级前端开发,深入的学习一种或几种JS框架技术也是大势所趋,比如React, Vue等。

鉴于我所在的是IT教育行业,以我的经验给想入门的小白们一个参考的学习线路和时间安排如下:

HTML-3天左右(重点掌握超链接、列表、表单);

CSS -10天左右(重点掌握选择器、背景、继承、优先级、盒子模型);

JavaScript基础 -12天左右(重点掌握函数、数组、对象、DOM、BOM);

以上是入门必备,当然只会这些你还无法胜任Web工程师的工作,还需要学习Web高级进阶,MySql数据库,Node.js,Webpack模块加载器和打包工具,MVVM架构,React等等。


为感谢您对我们的认可,特意准备了一些IT入门和进阶的干货

包括:Java、UI设计、H5前端、Python+人工智能、软件测试和新媒体运营六大学科视频资料。以及IT就业大礼包。

线上视频、音频,随时学习观看

关注我们并私信“资料”即可获取。

相关文章

Linux 发行版介绍 Zenwalk Linux(linux发行版2021)

Zenwalk Linux是基于Slackware的GNU/Linux发行版, 100%兼容Slackware。 致力于精简和快捷的图形桌面及多媒体使用。包含整套编程环境和运行库,还提供了常用服务器套...

linux发行版-openSUSE Agama 15安装程序发布:带来多项可用性升级

openSUSE旗下仍在开发中的全新Linux安装工具Agama,于近日推出v15版本,带来了界面增强、实用新功能等一系列改进,为用户带来更顺畅的系统安装体验!界面优化:细节之处见用心新版本在本地化设...

细数5款国外热门Linux发行版(linux发行版排名网站)

Linux系统已经与我们的生活息息相关,当你用Android手机浏览这篇文章时,你就已经在使用Linux系统。当然作为编程开发最热门的系统,他还有很多专注于开发使用的版本。Fedora热门入门推荐,一...

Vue3 如何实现父子组件传值?(vue父子组件传值props)

在Vue 3中,要实现父子组件传值效果主要通过props和emit两种机制来实现,下面我们就来详细介绍一下这两种机制。父组件向子组件传值propsprops是Vue组件的一种机制,主要的作用就是实现从...

Vue3 中,父子组件如何传递参数?(vue父子组件传递数据方法)

在 Vue3 中,组件化开发是非常重要的特征,那么组件之间传值就是开发中常见的需求了。组件之间的传值三种方式:父传子、子传父、非父子组件传值。一、父传子( defineProps )父组件主要通过使用...

Vue3开发极简入门(14):组件间通信之props、ref&defineExpose

组件间的关系可以分为:父子关系。以前文的代码为例,最典型的就是App.vue与Car.vue这种,APP是父,Car是子。祖孙关系。如果Car再引入一个子组件,这个子组件与App就是祖孙关系。其他。比...