前端入门有哪些技巧或经验分享？

黑马程序员官方

于 2023-06-07 15:26:37 发布

阅读量453

点赞数

分类专栏： 2023年前端—入门到精通文章标签：前端 css html

本文链接：https://blog.csdn.net/itcast_cn/article/details/131088619

版权

2023年前端—入门到精通专栏收录该内容

323 篇文章 232 订阅

订阅专栏

前端初学者入门有很多问题其实可以避免的，分三部分已经汇总好易出错的问题和前端学习技巧

第一部分：HTML的学习

其实HTML的话，重要的就是一个标记语言的学习，是前端入门最基础的一部分。这里也不是说背一背就解决问题的，选择IT，程序员这一方面，只要多练习，多敲代码感觉就好了，所以熟练的使用这些标记其实不是很大的问题。

容易出错的问题

1. 缺少结束标签：如果忘记了结束标签，浏览器将无法正确解析HTML代码。比如，如果忘记了在段落结尾处添加</p>标签，浏览器将无法正确显示段落。

2. 错误的嵌套：HTML标记没有正确嵌套，浏览器将无法正确解析你的代码。例如，如果在一个段落中嵌套了一个标题标记，浏览器将无法正确显示你的页面。

3. 大小写错误：HTML标记对大小写不敏感，但是为了可读性，建议使用小写字母。如果在标记中使用了大写字母，浏览器可能无法正确解析代码。

4. 属性错误：HTML标记中的属性没有正确设置，浏览器将无法正确解析代码。例如，如果在图像标记中忘记了设置src属性，浏览器将无法正确显示图像。

5. 忘记引号：如果你在HTML标记中使用属性，必须将属性值用引号括起来。如果忘记了引号，浏览器将无法正确解析代码。

学习资料》》》

2023新版前端Web开发HTML5+CSS3+移动web视频教程，前端web入门首选黑马程序员_哔哩哔哩_bilibilihttps://www.bilibili.com/video/BV1kM4y127Li/?spm_id_from=333.999.0.0

笔记整理：黑马程序员前端2023新版前端web入门：day01-HTML基础 >>day02-HTML进阶>>day03-CSS基础>>day04-CSS进阶>>day05-盒子模型 >>day06-Flex布局 >> day07-学成在线 >>day08-CSS高级 >>day09-小兔鲜儿 >>day10-小兔鲜儿项目完结
 移动 Web 第一天>>移动 Web 第二天

第二部分：CSS学习

CSS是更应该学好的一个模块。因为我们都知道，其实一个网站的WEB前端

，就是用HTML加CSS来写的，不是用之前的表格来写的，CSS是网页样式，一个网页的整体美感，在你确定了框架之后，就看你的CSS样式的添加了，所以CSS学好很重要。

下是一些常见的CSS错误和如何避免它们的例子：

1. 盒模型错误

当你设置元素的宽度和高度时，你需要考虑到元素的内边距和边框。如果你没有考虑到这些，你的元素可能会比你预期的更大或更小。为了避免这个问题，你可以使用box-sizing属性来指定元素的盒模型类型。

例如，如果你想要元素的宽度和高度包括内边距和边框，你可以这样写：

box-sizing: border-box;

2. 浮动错误

当你使用浮动来布局元素时，你需要小心处理。如果你没有清除浮动，你的布局可能会出现问题。为了避免这个问题，你可以使用clear属性来清除浮动。

例如，如果你想要一个元素在左侧浮动，而另一个元素在右侧浮动，你可以这样写：

.left {
  float: left;
  clear: both;
}

.right {
  float: right;
  clear: both;
}

3.选择器错误

当你使用选择器来选择元素时，你需要确保你的选择器是正确的。如果你的选择器不正确，你的样式将不会应用到你想要的元素上。为了避免这个问题，你可以使用浏览器的开发者工具来检查你的选择器是否正确。

例如，如果你想要选择所有的段落元素，你可以这样写：

p {
  /* styles */
}

希望这些示例能够帮助初学者们避免一些常见的CSS错误。

第三部分：重点学习JavaScript

JS是是很多人没办法很好接触的地方，初学者们像一些对属性的操作的标记之类，懂得怎么用，但是不是很熟悉，所以经常在操作的时候要去查手册。容易出错的地方是将数组中的元素按照一定的规则或者顺序添加到指定或对应的表格中，也是掌握不好的地方，JS可以理解成大量算法的集合，因为很多时候你都会用到函数，只是多了一些找元素和对元素绑定标记的过程，最重要的还是构造函数，调用函数的过程!