黑马程序员技术交流社区
标题: 新人报道！前端学习心得！ [打印本页]
作者: yga150478 时间: 2018-9-13 22:37
标题: 新人报道！前端学习心得！
第一次接触前端，0基础基本不知道前端是做什么的？
我们一开始是了解HTML和CSS，这两个到底是怎么运用，才能做出一张静态页面。（基础班主要就是以静态页面为主）
国内外有很多的浏览器，每个浏览器的内核不同，呈现的效果都不一样，我们现在主要是以谷歌Chrome浏览器位主要来进行学习的。
说白了浏览器就是一个渲染器，我们做好HTML和CSS，最后的页面效果是由浏览器渲染呈现的。
当然一个完整的页面还需要JS（JavaScript）去做，JS就是页面的一些特效。所以一个网页的三大构成就是HTML，CSS，JS，我们基础班主要以HTML和CSS为主。
HTML是页面的结构，CSS是页面的样式，JS就是页面的特效，包括人机交互（JS是就业班的知识）。
先说说我在基础班的一些所学的知识和学习心得吧。
我们是以面授和视频结合的上课方式，视频为主，老师为辅。视频讲述大体内容，也有讲解。如果还是不懂，老师就会再解释一遍。
HTML
所谓HTML，是指超文本标记语言（Hyper Text Markup Language），是一种构成网页的一种语言。
其实就是一些标签，怎么让文字，图片，视频，链接等出现在页面。
这些标签都是英文为主（毕竟是一个外国工程师发明的），我们一开始使用的一些标签都是很好记的，当然没必要去死记硬背，至少在我看来这些标签只要你用熟悉了，自然而然的就会写出来，当然你要先知道它怎么用，理解他怎么用。
好多朋友都是在死记硬背单词而不去理解，我是感觉多用用，忘了再去查笔记，再不行就去问老师。
而且我们现在写网页，敲代码都是用sublime软件做的，这个软件都有智能输入的，就像输入法一样输入几个字母，有关单词就都有了，还是那句话没必要去死记硬背单词，那样会增加你的学习量。
HTML的标签就是 <标签名> 内容 </标签名> 比如<body> 我是文字 </body> 用两个尖括号写标签名 两个标签名中间写内容。但是结尾的单标签必须要有 / ，随着页面的复杂增加我们会在一个标签里再加标签，所谓的父子关系。
刚开始熟悉HTML标签的时候，都是一些简单的单词，我们要赶快熟悉运用，不能因为简单就无所谓，后面的会越来越复杂，越来越多，但是还是那句话，千万别去单独记单词，老师也会教怎么读，记得他怎么读，理解怎么用就足以，再多多练习就自然而然的敲出来。
HTML主要就是标签，而CSS就是要去修饰HTML的标签，相对复杂了。
CSS
个人觉得CSS比HTML更好玩，想把HTML做成什么样就做成什么样。
我们把CSS（Cascading Style Sheets）称为CSS样式表，主要用于设置HTML页面的文本内容（字体，大小，对齐方式等），图片的外形（宽高，边框样式，边距等）以及版面的布局和外观显示样式。
CSS有三种写法，1.行内式2.内嵌样式表3.外链式。行内式就是把CSS样式写在标签内，若果以后做一个大的项目，会有很多标签，写在标签内到后面找错误什么的会很麻烦，所以我们学的时候可以用用，以后尽量不会用。内部样式表呢，虽然是和HTML分开写了，但是还是在一个文件内，以后写了几千行的代码，找起来也很费劲，也不推荐用。外链式就是CSS有单独的文件，就是你同时要写HTML和CSS两个文件，要来回切换，但是改起东西会很方便。
写CSS的时候有时候会落下 ;，一定记住写完一个属性后结尾后面带个 ;，不然到时候明明自己写的是对的，还不知道自己错在哪里。CSS有几个属性样式是可以继承的，有朋友如果记不住的话就跟我一样，分别给他们写，也不是很麻烦。前期我刚接触CSS的时候，很多属性好多单词，我都不怎么会理解，怎么使用，所以为了加强对他们的印象，老师视频也放了也解释了之后，自己试着找别的网页看看，看别人大公司是怎么把这个用在网页上的，别局限老师给的小练习。找找别的网页看，试着去临摹，不会的话看源代码，自己慢慢理解，这样会加深印象。老师后面虽然会给我们以这个大的案列，但是等老师到时候给你的时候，可能前面的指示点都忘差不多了，所以不要局限于平时的单独的小测试（至少我是这样的，感觉老师讲解的是没问题，但是就还没自己动手做在整个网页中会更记得住）。
很多属性标签都是要自己动手尝试去结合做做，因为我们以后都是真枪实弹的做方案，感觉自己前面学的扎实了，完全可以课后自己找个淘宝，京东之类的网页做做，感觉实在理解不了，上网查查，问老师都可以。
就这样，马上上就业班了，我都是这么学的，看能不能帮到0基础对前端感兴趣的朋友。（前端真的在所以IT里面简单太多了，但是 前端涉及的面很广，就是说我们会学很多东西，但是都很好理解。）
| 欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |