添加网站本身提供的附加样式层

RAHIM104

这就是我们最终看到的。（注意：通常还有附加的 JavaScript 层，但它超出了本文的范围。） CSS代表级联样式表 — 它用于扩展 HTML，使文档具有自定义外观和感觉变得更加容易。样式表是一个文档，它通过基于标签、类、ID 和其他选择器设置规则来告诉 HTML 元素应该是什么样子（以及它们应该如何定位）。级联是指在不可避免的规则冲突事件中确定工作表中哪些规则优先的方法。 “‘级联’意味着样式可以从一个样式表落入（或级联）到另一个样式表，从而可以在一个 HTML 文档上使用多个样式表。” —级联 — Max Design CSS 经常名声不佳——在有大量样式表的网站中，它很快就会变得笨拙，特别是如果没有记录、使用一致的方法（稍后会详细介绍）——但如果您以有组织的方式使用它并遵循所有规则最佳实践，CSS 可以成为你最好的朋友。特别是现在大多数现代浏览器都提供了布局功能，CSS 不再像以前那样需要破解和战斗。

了一本很棒的指南，《如何学习 CSS》 ——开始之前最好了解 特殊数据 的事情之一是： “你不需要记住每个 CSS 属性和值。” — 雷切尔·安德鲁 相反，学习基础知识更为重要——选择器、继承、盒模型，最重要的是，如何调试 CSS代码（提示：您将需要浏览器开发人员工具）。 不必担心记住属性的语法background，也不必担心忘记如何在 Flexbox 中精确对齐内容（CSS Tricks Guide to Flexbox可能是我访问量最大的 10 个页面之一！） ; 在 CSS 属性和值方面，Google 和 Stack Overflow 是您的朋友。 例如，某些代码编辑器甚至具有内置自动完成功能，因此您甚至不需要在网络上搜索即可找出边框的所有可能属性。 Firefox 70 中我最喜欢的新功能之一是非活动 CSS 规则指示器。这将节省您数小时的时间来尝试找出未应用样式的原因。 现在的孩子们真是太容易了！（大预览） 语义让我们从语义代码开始。语义是指单词的含义，语义代码是指任何给定语言中的标记都有意义的想法。 语义如此重要的原因有很多。



果我能总结一下这一点，我会说，如果你学习并使用语义代码，它会让你的生活变得更加轻松，因为你将免费获得很多东西 - 谁不喜欢免费的东西？ 有关语义代码的更完整介绍，请参阅Paul Boag 关于该主题的简短博客文章。 语义给你带来很多好处： 默认样式 例如，<h1>为文档标题使用标题标签将使其从文档的其余内容中脱颖而出，就像标题一样。 可访问的内容 默认情况下，您的代码将是可访问的，这意味着它可以与屏幕阅读器一起使用，并且可以更轻松地使用键盘进行导航。 SEO 的好处 语义标记更容易被机器阅读，这使得搜索引擎更容易访问。 性能优势干净的 HTML 是高性能网站的 基础。干净的 HTML 也可能会导致更干净的 CSS，这意味着整体代码更少，从而使您的网站或应用程序更快。