以简单有效的方式学习 HTML 的 7 个最佳网站

已发表: 2021-07-22

如果您对学习 HTML 感兴趣，这里列出了 7 个最适合轻松学习 HTML 的网站。

鉴于在所有元素中，学习使用 HTML 构建网站并不难，最终，您最多需要 30 个。然而，如果您是 Web 开发领域的新手，您可能不会像大一新生看论文那样理解它。

当您在论文写作方面需要帮助时，您可以在谷歌上搜索更多信息，就像互联网上的任何东西一样，找到无穷无尽的选项列表。哪一个是可信的？哪一个不会浪费您的时间并提供有价值的信息？简单的解释在哪里，哪些资源会让您大吃一惊？

继续阅读以查找可简化您的教育过程的最佳资源列表。

Study HTML

用于学习 HTML 的基于理论的网站：

当您打开该网站时，它看起来像是在阅读大量内容，而且确实如此。除非您有时间浏览整个目录，否则建议您从第 3 节和第 4 节开始了解这些元素。

当您能够构建一个简单的网页时，您可能想要添加功能，改进您的代码。这将是通读整个手册的时候了。此外，在使用 HTML 创建页面时，您肯定会遇到一些额外的问题，因此这份高度结构化的指南会很有帮助。

其优点包括但不限于：

该网站还存储在 PDF、开发人员、单页和多页版本中。开发者版是根据对您可能没用的额外信息进行提炼的，至少在开始时是这样。

该网站非常易于使用，并且具有用户友好的界面。它相当简约——与列表中的前一点相比。

主页提供了一个带有过滤器的有用表格，供初学者立即检查他们正在处理的元素：

随着您进一步移动，指南将内容分成几组元素。它们中的每一个都提供了关于标签属性的简明解释、简单示例和结构准确的提示。

在许多方面，本网站结合了其他指南中单独存在的几个功能。在那里你可以找到：

关于过时标签的部分更加有用。初学者在寻找答案时总是在论坛上寻找一些技巧。很多时候，后者并不新鲜。因此，结果应用了过时的方法。这部分就像一本 HTML 历史书，它将解释为什么你永远不应该使用 2012 年论坛上提到的那个标签。

MDN Web Docs 包含各种技术的指南，HTML 就是其中之一。该指南更加详细，一开始可能看起来很混乱。然而，导航非常直观。文章中有许多超链接，就像在维基百科中一样。

您还可以在页面左侧查看目录、返回承载子主题的初始页面以及相关主题的方式。就像 DevDocs 一样，该网站包含有关浏览器中元素和过时元素兼容性的信息。此外，实验和非标准的都标有不言自明的图标。

HTML guide

理论材料总是一个很好的基础，但没有实践你就不会使用它们。因此，请确保您至少使用下面列出的平台之一轮流阅读和编码。

此 gem 提供了一个窗口，您可以在其中使用同一选项卡中的后续输出进行编码。这是一种更容易习惯 HTML 语法并且不会因在编辑器和浏览器之间切换而分心的方法。随着您的进步，您可以选择许多其他练习。

该平台提供提示、结构化说明和简单的界面。它包含 7,000 多个教程，您可以从名称中猜到，所有这些教程都可以免费访问。

与上述资源相比，CodePen 允许在一个选项卡中组合多种技术。当您选择“试用编辑器”时，将出现三个窗口：

您不需要全部使用它们，只需使用您需要的那些。您可以从 HTML 开始，如果您有足够的好奇心尝试一些简单的功能，可以添加设计或脚本。

该编辑器对于可以在此处测试的开源代码也非常有用，然后再将其上传并应用到您自己的网站。 CodePen 通常内置在其他提供示例的资源中。其中之一是免费前端，如果需要，您可以在其中搜索 HTML 代码示例。

最后，代码验证器会教你不要乱用 HTML5 及其标准。即使您一开始没有在基本的代码编辑器中练习，迟早您也必须使用它。尽管可用扩展的数量很多，比如在 VS Code 上，但代码编辑器在跟踪代码是否符合 HTML5 编写方面仍然可能滞后。所以，你需要这个网站。

当您插入代码时，验证器开始逐行检查它。当它看到错误时，它会报告错误，但不会深入代码树。因此，除非您在存储其余代码的标签中修复该错误，否则验证器不会让您查看其他错误的报告。这可以为您节省大量时间和精力。

互联网资源的数量是无穷无尽的，所以这个列表可以继续下去。上面介绍的学习 HTML 的网站并不是 HTML 学习者的必读之物，但它们中的每一个都绝对是必须尝试的。

每个资源都提供了独特的信息结构和呈现方式。如果一个网站不适合您，您可以尝试另一个网站以找到最佳方法。