如何学习html

说实话,学习HTML的时候,刚入门却发现基础不扎实,后来确实很难。
根据我走过的弯路,我告诉你如何学习不走弯路。

第一步是从基础开始。
我记得当我第一次接触 HTML 时,我不知道 DOM 树是什么。
光看标签我就感到困惑。
后来我意识到我首先要了解如何保存文件,如何使用浏览器,然后什么是HTTP协议。
有一个具体的例子。
我当时连localhost都不懂。
结果,在创建页面时,我一直想知道为什么我可以在本地查看它们,但不能上传它们。
所以,熟悉文件管理、了解如何使用浏览器开发工具、理解请求头的含义比直接咀嚼标签重要得多。

第二步是寻找可靠的资源。
W3 Schools 确实不错。
我用它来开始。
那个在线编辑器救了我很多次。
但仅仅看理论是不够的,你必须采取行动。
我有一个朋友连续观看视频,最后却写错了标签。
然后他开始使用W3 Schools的例子来修改代码,然后逐渐开始。
特别需要强调的是
和不要混淆。
一个应用作容器,另一个应用作内联元素。
我在这一点上遇到了麻烦。
还有一些您必须知道的常见标签,例如 和 。

第三步,学习一些“偷窃技巧”。
第一次用开发者工具扫描淘宝页面,发现它们的结构非常规范。
页眉、导航、内容区、页脚,每个模块都有固定的书写风格。
有一个细节特别有趣,比如京东的产品列表。
你会看到他们在 中使用 的方式非常标准,这直接影响到后面写CSS的容易程度。
我只是跟着他们,网站运行得非常顺利。

第四步是改变命运的工具。
我已经使用 VSCode 5 年了,HTMLSnippets 插件确实可以节省时间。
记得有一次写表单的时候,我用了Emmet的缩写<form>+Tab,瞬间就创建了一堆输入框,效率极高。
但最重要的是W3 C验证器。
当我刚开始编码时,错误率高达 3 0%。
使用验证器后,它下降到 5 % 以下。
有一些数据。
在我持续使用验证器三个月后,我的标签书写准确率提高了 7 0%。

第五步,创建项目。
不要只看说明,你必须自己做。
我的第一个项目是为同学写一份简历,但我意识到我什至没有考虑过验证表格。
后来,在做一个电子商务网站的时候,我意识到为什么这个结构应该这样划分——因为这就是搜索引擎爬虫收集数据的方式。
LiveServer插件非常强大。
自动刷新功能节省了我多次返回浏览器的次数。
实施 GitHubPages 后,一位朋友称赞我的网站速度,这让我明白实践确实可以改变看法。

如果你想进阶,我建议先学习 CSS 预处理器。
例如,Sass 只需一行代码就可以生成一堆 HTML,效率极高。
我承担了翻新网站的任务。
使用Sass重构后,代码量减少了一半。
然后是 JavaScript。
虽然不属于HTML范畴,但只懂HTML的工作还是很难找到的。
我有一个只会HTML的同事,但他已经失业半年了。
然后他学习了 JS,然后转向全栈。

学习HTML的关键就是三个字:多练习。
那时候我一直在修复bug,后来我什至弄清楚了浏览器的显示顺序。
这里有一个小建议:每次写完代码时,将其与别人的网站进行比较。
你会发现你可以学到很多细节。
比如网易的评论区,如果你看源码,你会发现他们使用了
标签来处理折叠效果。
你可以复制这种令人惊奇的活动。

HTML注释标签的语法规则

2 02 3 年,朋友问我如何编写HTML注释语法。
我向他解释说 HTML 注释以 <!-- 开头,以 --> 结尾。
内容写在中间,可以是任意文本。
例如:

这是一个标题

<!-
这是解释上面标题的注释 -->

这是一个段落。


她还问我如何用 CSS 和 JavaScript 编写它,我告诉了她。
CSS 以 / 开头并以 / 结尾,JavaScript 以 // 开头,后面是注释。
她看起来很明白。

然后她又问,说浏览器里不会显示评论吧?我说是的,浏览器会忽略注释,所以我们可以安全地在代码中添加注释。

最后她还表示,这样使用注释可以提高代码的可读性和可维护性。
我同意,评论是一个非常好的工具。
她看起来很高兴,并表示以后会更多地使用注释来编写代码。
算了,她应该能明白的。

HTML注释的基本语法

结论: 此类注释是自定义 HTML 注释,用于在页面加载期间显示动态信息。
时间:不确定 位置:在 HTML 源代码中 第一个数字:无 吐槽:这种注释看起来像CSS或JS中的注释,但没有HTML效果。
示例:请参阅 HTML 中的注释“<!-- This page was returned on January 1 , 2 000-->”。
Fovea:但是,请注意此类注释表达式可以在 HTML 中执行。