自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的

CSS称之为样式表,HTML为标记语言。是前端web开发必须掌握的知识之二,再就是Javascript是前端Web开发也必须掌握的编程语言。

我先用一个网站【千图网】的源码分析来了解CSS、HTML、Javascript各自的作用

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图1上图是千图网首页的布局,我先通过Google Chrome来调试看看这个网站的首页(点击鼠标右键选择查看就可以看到如下图所示)

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图2

左边显示的是HTML的主要内容,右边显示的是CSS的内容

CSS是什么呢?其作用又是什么?

打开昵图网首页,我们可以看到整体布局非常美观。那如果没有CSS会怎么样呢?我们可以查看这个首页的的源码,可以看到是有引用css样式表文件。

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图3

我现在将css引用给删掉

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图4

我们再来看下首页的效果

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图5

css的主要作用就是用于网页的排版布局和美化,能够让我们开发出来的网页更好看

HTML是什么?其作用是什么?

一个网页是有很多个部件组成的,有文字显示、有输入栏、有列表、有图片、有视频、有跳转到新的页面的链接。我还是用上面网站的首页结合检查功能来说明。

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图6上图中红色框标出来了,各种类型的部件。

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图2

上图中左侧显示了部分的Html的内容。更多的html的内容,可以到

***.cn/index.html

进行了解。非常详细自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图8

HTML标记语言的作用就是告诉浏览器,在加载的时候显示的是什么控件,再结合css就能够显示出非常漂亮美观的静态页面了。那如果要做一些动态的页面和数据交互,就需要用到Javascript,你在这里没有提到,我就不做具体的说明了。可以自行查阅相关文档及说明!

为什么看了视频还是看不懂?要如何学习?

对于初学者来说,其实我是不在建议直接看视频来学习。个人的的建议是前期购买专业的web前端开发书或者通过我上面讲到的w3school网站进行学习,将相关的基础识知点完全掌握,并跟着书上或者网站上的代码进行实际的敲打一篇或者多篇。一直到脑子里有印象和概念,看到一个网页,能够知道这个网页的布局是什么样子的,用到了哪些部件,这个部件对应的html标签是什么?可能用到了什么样的css样式?

只有做了这一步后,你再看视频教程。更多的是建议看一些项目实战的视频,采取第一次将视频看完,然后实际编写一次。如果遇到有不记得的地方,回看视频的,对照视频进行编写巩固。通过这样子的方式 不断的加深记忆以及理解html和css的作用。

多敲代码、多敲代码、多敲代码。编译运行查看实际效果,反复的这个过程中,我相信你现在提到的,最终就不是问题了。

如你自己本身自学能力不足,还有一个建议就是去专门的IT教育机构进行系统的专业的学习。

如果你选择IT教育机构培训,一定要注意的就是机构的选择,这里面也有比较多的坑。

我不是专门的web前端开发,但由于平时的工作原因,有时也需要自己写了些web页面。可以关注我私信沟通交流!

Html和css都是前端必须掌握的技术知识,也是很多编程入门课程。

自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图9自己看了下前端的,感觉好懵,CSS和HTML是什么看到还是不懂,你们是怎么学的图10

既然是入门必学,从我理解开始,它们学起来相对简单,容易上手。

既然必须掌握,那么它们的重要性不言而喻,尤其对前端童鞋们来说。

我一个搞后端的,我当时就是从html学起,学完后紧接着就是css。

Html是超文本标记语言,它有一系列的html标签或者说指令。通过这些指令将一些文字,图片,视频,超链接啊等资源进行整合通过浏览器渲染出来。

Html更像是盖房子的骨架。像什么钢筋水泥,混凝土,砖头等可以理解为它的标签。

其实我觉得当初发明这种语言的应该是类比人来说的吧。

Html的结构有head title script style body footer等组成。

下面是它的大致结构。

<!DOCTYPE html><html lang=”en”><head> <meta charset=”UTF-8″> <title>Title</title>

</head>

<body>

</body>

</html>

这些基本上就是一个空壳子,就跟房子的骨架一样。我们大多都是往它的body里面添加内容,浏览器上看到的文本,图片,视频大多数都是body的东西。标题和网页的图标是在浏览器的选项卡那能看到。

而css就是用来给房子装修,或者说我们人化妆穿衣打扮。目的就一个,让html更好看一些。吸引用户的眼球。但是它只能让html穿上衣服,就跟画画上色一样,都是静态的。

如果让美美的外衣动起来,画出的内容更加炫酷。就用到了Javascript,也就是js。

切不可把js和Java混淆了。

css,js都是为html服务的。前者使它文静的美,后者让它动感的炫!

说了这么多,到底怎么学?

看视频看不懂?

对于初学者来说,看视频肯定学不会或者说学不好的。

为什么?

因为这些html和css标签都让你看的眼花缭乱。这些js方法都够你头大的。

那么问题出在哪呢?

那就是学习方法!

学技术,绝不是纯粹的靠看视频就能学会的。它更重要的在于六个字:多练,多练,多练!

只有看视频的同时,多拿笔或者多动手敲,才有效果。

而且这个效果非常明显!

我可以告诉你的是,这些看似很多的标签,一个都不用刻意的去死记硬背!

而且背是没什么用的,因为今天可能这个版本有这个标签,可能明天就废弃了。技术更新迭代的很快,只有掌握了核心的思想,就可以以不变应万变!

我当初学习就这样,自己动手跟着视频一个字母一个字母敲。

敲得多了,自然就记住了。慢慢的去尝试做一些网页,结合实际的项目,日积月累。各种布局,各种页面样式,各种交互,看的多了练的多了。基本功练扎实了,以后回过头你就发现,哇好简单。

看到一个好的网站,你脑海中就能立马展现出可能别人是怎么布局的,怎么配色的,哪些动画用可能用到了哪些方法。甚至你能一眼看出他前端用到了什么框架。

OK,说到这里我想你一定知道怎么去学,怎么有效的学,怎么学的更快更扎实了吧。

原创文章,作者:普尔小编,如若转载,请注明出处:http://www.puerpx.cn/pxwd/6761.html

(0)
上一篇 2023-01-17 上午10:45
下一篇 2023-01-17 上午11:31

相关推荐