Post by account_disabled on Dec 4, 2023 5:39:08 GMT
下载 PDF 格式的文章 关闭 当您开始进行网页设计时，确保一切正常运行并按照您想要的方式显示的关键元素是 CSS。它代表层叠样式表，允许您根据需要设置HTML 元素的样式。 虽然您可以通过多种方式（最常见的是内联）试验 CSS，但还有更好的方法。这符合您应该始终遵循的一系列最佳实践，以确保您的代码功能正常、没有不必要的混乱并且组织良好。 今天我们将重点介绍适合初学者的 14 个 CSS 最佳实践，但即使是最有经验的专业人士也应该时不时地温习一下基础知识。 观看我们的CSS 初学者最佳实践视频指南 组织样式表 应用 CSS 最佳实践时要做的第一件事是组织样式表。如何实现这一点取决于您的项目，但作为一般规则，您应该遵守以下组织原则： 始终如一 无论您决定如何组织 CSS，请务必在整个样式表和网站中保持您的选择一致。 从类命名到行缩进再到注释结构，保持一致性将帮助您更轻松地跟踪您的工作。
此外它还允许您稍后进行更改而不会出现问题。为您的下一个项目添加书签！ 点击发推文 自由使用 电话号码清单 换行符 虽然 CSS 即使看起来很丑也能工作，但如果您使用大量换行符来保持每个代码片段独立且可读，那么对您和将使用您的代码的其他开发人员来说会更好。 通常，最好将每个属性和值对放在一个新行上。 来自 的 CSS 代码屏幕截图，显示了 CSS 在结构化时的可读性，以便属性和值对存在于各自的行中。 CSS代码 在需要的地方创建新部分 同样，如何设置样式表很大程度上取决于您正在处理的网站的类型。但是，作为一般规则，最好为将要使用的样式创建部分。因此，一个用于文本样式的部分，一个用于列表和列，一个用于导航和链接，等等。您还可以为特定页面创建部分，这些部分的样式可能与其他页面不同，例如商店或常见问题解答。
评论你的代码 即使只有您看到 CSS，完整的注释仍然是个好主意。评论将如下所示 这样可以更容易一目了然地理解每个部分所指的内容，而无需稍后分析每一行。 注释可以帮助您定义各个部分，但它们也可以用来深入了解您所做的决定，特别是当您认为以后可能会忘记它们时。 对较大的项目使用单独的样式表 并非所有网站都如此，但如果您有一个需要大量特定 CSS 的大型网站，那么使用多个样式表是个好主意。没有人，包括您在内，必须花费很长时间来尝试找到您需要的一行代码。 避免麻烦并为网站的不同部分创建单独的样式表，特别是当它们具有完全不同的样式时。 例如，您可以为全局样式创建一个样式表，为您的在线商店创建另一个样式表，其中包含专用于产品描述、标题或定价的样式。内联CSS vs 内联CSS 外部 CSS 对比 内部CSS 构建网站并设置其样式时可以使用三种不同类型的 CSS。让我们来谈谈每一个的含义和用途，然后尝试找出您应该在项目中使用哪一个。
此外它还允许您稍后进行更改而不会出现问题。为您的下一个项目添加书签！ 点击发推文 自由使用 电话号码清单 换行符 虽然 CSS 即使看起来很丑也能工作，但如果您使用大量换行符来保持每个代码片段独立且可读，那么对您和将使用您的代码的其他开发人员来说会更好。 通常，最好将每个属性和值对放在一个新行上。 来自 的 CSS 代码屏幕截图，显示了 CSS 在结构化时的可读性，以便属性和值对存在于各自的行中。 CSS代码 在需要的地方创建新部分 同样，如何设置样式表很大程度上取决于您正在处理的网站的类型。但是，作为一般规则，最好为将要使用的样式创建部分。因此，一个用于文本样式的部分，一个用于列表和列，一个用于导航和链接，等等。您还可以为特定页面创建部分，这些部分的样式可能与其他页面不同，例如商店或常见问题解答。
评论你的代码 即使只有您看到 CSS，完整的注释仍然是个好主意。评论将如下所示 这样可以更容易一目了然地理解每个部分所指的内容，而无需稍后分析每一行。 注释可以帮助您定义各个部分，但它们也可以用来深入了解您所做的决定，特别是当您认为以后可能会忘记它们时。 对较大的项目使用单独的样式表 并非所有网站都如此，但如果您有一个需要大量特定 CSS 的大型网站，那么使用多个样式表是个好主意。没有人，包括您在内，必须花费很长时间来尝试找到您需要的一行代码。 避免麻烦并为网站的不同部分创建单独的样式表，特别是当它们具有完全不同的样式时。 例如，您可以为全局样式创建一个样式表，为您的在线商店创建另一个样式表，其中包含专用于产品描述、标题或定价的样式。内联CSS vs 内联CSS 外部 CSS 对比 内部CSS 构建网站并设置其样式时可以使用三种不同类型的 CSS。让我们来谈谈每一个的含义和用途，然后尝试找出您应该在项目中使用哪一个。