如何使用类和 ID

如何使用类和 ID

作者:Jason Eustache,网站开发人员

介绍

嗨,我的名字是 Jason Eustache,我是一名网站开发人员。创建网站是我觉得非常令人兴奋的事情,但有时它可能非常具有挑战性。我的目标是鼓励所有初学者像我一样对代码产生同样的热爱和欣赏。当谈到学习新事物时,人们往往会在遇到问题时放弃。在我的文章中,我将为你们提供有关如何成为最好的网站开发人员和编码员的各种提示和技巧。

今天我将谈论分类和ID。在为网站上的任何项目设置样式时,类和 ID 非常重要。如果没有这些,您的 html 将在视口中显示为无聊的普通文本和异常大小的图片。现在告诉我,有谁会想使用一个无聊的网站。这些属性将允许您保持您网站的代码井井有条。他们还将帮助您调试代码。最后,它们将帮助您在创建 CSS 文件时使用特异性。

#1 组织

组织是创建网站的重要组成部分。如果您的代码没有组织,那么您将无法及时完成您的项

开始时,您应该清楚地了解您想象的网站外观。确定在网站页面的每个区域中使用哪些元素非常重要。一旦您为您的网站创建了大纲,就可以使用类和 ID。当您使用这些尝试将它们添加到 div 时,这将在您设置样式时为您提供更大的灵活性。在命名你的类和 ID 时,给他们一些与你想要设置样式的项目名称相关的东西是很重要的。

例如,如果我想在页面的第一部分命名一个列表,我会使用

.一个代表我的列表所在的部分,该列表代表我要设置样式的项目。以这种方式标记是合乎逻辑的,当您继续进行样式设置时,您不会用随机名称猜测谁,因为演示文稿将清晰易读。

#2 调试

创建有组织的 html 文档后,您现在可以转到 CSS 文件。事情对您来说应该很清楚,并且您应该可以毫无问题地返回 html 并找到要设置样式的项目。可悲的是,作为网站开发人员,我们往往会在工作中犯错误或进行大量更正。我认为可以肯定地说我们是完美主义者。如果我们不能满足给 T 的标准,那么我们必须回去修改我们的工作,直到事情变得准确为止。

现在你的 CSS 已经完成了,你现在必须修复一个错误,这样你才能达到你的标准。您可能想知道应该从哪里开始。让我们回到您对网站外观的想法。如果您不记得,那么我建议您绘制视觉模型。作为网络开发人员,我们是艺术家,通过绘制我们的网站,我们正在将我们的想法重新创建为视觉表示。

谁知道我们可能会改变一些事情。您想要查找在视口中创建的不一致。我建议您自上而下搜索以进行更正,这将防止您在页面上跳转和遗漏问题。一旦你发现你的问题,你应该不会花时间在 html 上找到你的类或 id 并在你的 CSS 上调整它们。

#3 组合器

使用类和 ID 时,了解 CSS 特异性法则很重要。如果你不遵循这个特定法则,那么你的 CSS 将无法正常工作,你将留下一个不完整的项目,永远无法发挥其潜力。不仅如此,了解这项法律还有助于减少您创建网站的时间。在调试时,您可能会遇到一个问题,即您为分类容器设置样式,但什么也没发生。发生这种情况时,在 CSS 文件中为类添加额外的描述很重要。

通过描述,我的意思是组合器。组合器告诉文件两个选择器之间的关系。有许多不同类型的组合器,但今天我只关注一种,它是指定的元素选择器。此选择器使用全局属性来进一步描述您要设置样式的目标。例如,假设我有一个包装标题 h3 的 div 类。当我选择我的 div 来更改文本的颜色时,什么也没发生。

为了解决这个语法错误,我会在我的 div 类之后添加 h3 以更具体。您还可以在一个类中设置多个项目的样式。例如,假设我想为同一部分中的 3 个项目或同一部分中的 3 个组设置样式。我可以给他们上同一堂课。通过这样做,我将针对具有相同类的所有项目或组来获得相同的样式。在我看来,我认为这是 CSS 提供的一个非常酷的特性。

总体而言,在学习类和 Id 时,重要的是要注意,您需要对 html 和 CSS 组织、调试和特殊性有很好的理解,才能成为最好的 Web 开发人员。如果您有任何问题或意见,请随时与我联系!!!

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明

本文链接:https://www.qanswer.top/32142/03001300

posted @ 2022-09-13 00:03  哈哈哈来了啊啊啊  阅读(12)  评论(0编辑  收藏  举报