专栏首页编程前端零基础入门!前端真不难!

前端零基础入门!前端真不难!

现在互联网发展迅速,前端也成了很重要的岗位之一,许多人都往前端靠拢,可又无能为力,不知所措,首先我们说为什么在编程里,大家都倾向于往前端靠呢?原因很简单,那就是,在程序员的世界里,前端开发是最最简单的编程,甚至都不能叫做编程,因为它真的很简单很简单,下面呢,我们就开始一点一点的教大家如何开始前端知识的学习(小学生都能学会的语言)!

首先我们学习前端,要知道前端的三个大内容,HTML、CSS、JS,其中HTML和CSS是相互结合着学习,掌握了这两个了以后我们就算真正入门了,然后再深入学习JS等等。

一、首先我们要理解HTML,CSS,JS分别是什么?

HTML就相当于一个人,CSS相当于一个人穿着的衣服,JS相当于让这个人做什么动作,这样一形容呢,我们就很好理解了,这个人就是网站,需要有header头,body身体,footer脚……而网站所呈现给我们各种各样的样子就是我们写的CSS样式,网站里的动态效果就都是我们的JS去实现的。

二、零基础就能学会前端。

说到这里,可能大家看这么多的文字有点看不下去了,那我们废话不多说,只要你决定了要学习前端,那就跟我们的课程一点一点学习去设计制作属于你自己的网页吧!

我们用到的软件呢,对于入门级来说我们一般推荐大家用Dreamweaver,简称DW,新建一个HTML后,出现的界面是这样的,

看到这么多代码不要慌,对我们敲代码没啥影响,下面我们开始敲代码,我们可以看到这里有这样的代码,这个就是我们网页的身体,我们接下来要敲的内容都是在这中间输入的,这个括号表示的标签,标签都是一前一后的,成对儿出现的,除了一些特殊的标签,随后我们再一一给大家讲解。现在我们输入点内容,看看效果。

我们输入一个标签

,点击右上角的地球浏览一下,会发现弹出了一个空网页,什么也没有,那是因为我们现在只书写了HTML,还没有写CSS,简单来说就是,我们创建了一个东西在页面里,但是还没有设置这个东西长什么样子,现在我们在设置它的样子,

1、我们为了给这个div设置样式,所有先给它起个名字不然,电脑不知道我们要给谁加样式,class="aaa" 的意思是起名为aaa

2、在里写入这样一组标签这个style的意思就是CSS,我们整个网站要加的所有样式都是写在这个中间的。

3、我们在style里写样式,电脑首先要知道我们给谁加样式,所有我们写个.aaa 这个.(点)的意思是我要给aaa加样式,电脑会自动把.(点)后面的名字,跟下面body里的名字做一个匹配,这样电脑就知道,哦~原来你是要给这个div加样式呀,

4、然后我们把要给这个div加的样式写在大括号里,width:100px; 意思是这个div的宽是100像素,height:100px; 意思是高是100像素,background-color:#FF0000; 意思是背景颜色是#FF0000这个颜色,

注意:(1)这里我要给大家解释一下,大家别看这么多代码,这么多单词,其实软件有提示,像下面这样,直接输入第一个字母后面的单词就出现了,直接选中就行了,连单词都不用背,前端真的很简单,

输入w和输入h,会自动弹出单词框

(2)每一个单词都有提示,说到这里,不会英语的同学就不要给自己找借口说英语不好,学不会编程了,当然,这么简单是不是说大家都容易学会,那大家都会了,我们还有什么优势呢,其实不然,虽然说很简单,但是要想真真的把前端学好是需要下功夫的,主要就是要坚持,虽然很简单,但是能坚持下来的人很少,这也就是为什么我们给学生一直提倡要坚持,做任何事既然决定了,就要坚持,

下面我们继续,设置好了以后,我们就可以点右上角的“小地球”来浏览了,

如果你做出来了,跟我的效果一样,那么你就成功了,那我就可以恭喜你,你已经入门了,真的很简单!

到这里大家可能还会有疑虑:

1、可能会有同学觉的,前端好难,写了那么一大堆,才出了个这个。2、另外就是觉的这一下子蹦出来了这么多代码,这么多单词,记不住。3、对未来恐惧,感觉还不知道要有多少单词,多少代码要涉及。

在这里呢,我要给大家解释一下,前端呢,其实我们真正常用的单词也就20个左右,今天我们就已经用3个了,width、height、background,当然这3个也是最最常用的,是每次都要书写的。

另外就是像格式之类的,同学可能也会有疑问,这次的是div要起名字,style写在head里,div写在body,那还会有多少这样的写法,

这一点呢,我可以告诉大家,大家不用担心,因为这是每次我们写前端都要首先写的东西,可以说是固定格式,就类似于做数学应用题,我们首先要写个“解”字,一个道理。

最后呢,我想跟同学们说,不管我们以后选择做什么,一定都要坚持去做,世上没有难的事,只有放弃的事。

本文来自企鹅号 - 悟空也会玩编程媒体

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Web前端培训:怎样成长为一个优秀的Web 前端开发工程师?

    首先,前端工程师必须得掌握HTML、CSS和JavaScript。只懂其中一个或两个还不行,你必须对这三门语言都很熟悉。至少要能够运用它们完成大多数任务,而无需...

    企鹅号小编
  • 学web前端开发写给新手的建议,超实用!

    如今我们使用的互联网,客户端与服务器端的交互无时无刻不在发生。比如我们在浏览器打开网页,浏览器就是客户端,将网页数据发过来的也就是服务器。其实服务器,并没有什么...

    企鹅号小编
  • 代码也疯狂:diagram生成流程图

    在IT圈有这样一句(笑)话:任何一件需要重复两遍以上的事情,都有必要为它写一个脚本自动完成。话虽然夸张,但确实是这样的道理,事实上,在我们日常作业的许多方面其实...

    企鹅号小编
  • 前端零基础入门学习!前端真不难

    现在互联网发展迅速,前端也成了很重要的岗位之一,许多人都往前端靠拢,可又无能为力,不知所措,首先我们说为什么在编程里,大家都倾向于往前端靠呢?原因很简单,那就是...

    用户5827212
  • 腾讯专家工程师:2020年,前端发展关键词有哪些?

    导语 | 迅速发展的前端开发,在每一年,都为开发者带来了新的关键词。2019年已步入尾声,2020年,前端发展的关键词又将有哪些呢?云加社区特别邀请了腾讯TWe...

    尾尾
  • 数据结构与算法在前端领域的应用(主菜)

    这是一个我即将做的一个《数据结构与算法在前端领域的应用》主题演讲的一个主菜。如果你对这部分内容比较生疏,可以看我的数据结构和算法在前端领域的应用(前菜)

    lucifer210
  • Spring Cloud里的服务提供者如何与注册中心进行通信

    从这张图我们知道,无论是服务提供者还是服务的调用者,他们都需要与Eureka服务器进行通信。他们之间是如何进行消息传递的呢?通过wireshark抓包工具...

    良辰美景TT
  • Docker网络解决方案-Calico部署记录

    Calico简单简介 Calico是一个纯三层的协议,为OpenStack虚机和Docker容器提供多主机间通信。Calico不使用重叠网络比如flannel和...

    洗尽了浮华
  • ubuntu下查找脚本

    超级大猪
  • iOS performSelector 实现原理

    因为[self performSelector:@selector(test) withObject:nil afterDelay:.0]实际在runloop里...

    赵哥窟

扫码关注云+社区

领取腾讯云代金券