如何插入CSS评论

在你的CSS代码中包含注释非常有用并且强烈推荐。

每个网站都由结构元素(由HTML指定)以及该网站的视觉风格或“外观和感觉”组成。 级联样式表(CSS)用于规定网站的外观。 这些样式与HTML结构保持分离,以便于更新和遵守Web标准。

由于今天很多网站的复杂程度很大,样式表可能会很快变得非常冗长,并且非常繁琐。 当您开始为媒体查询添加响应式网站样式时,尤其如此。 这些媒体查询本身可以为CSS文档添加大量新的样式,使其更难处理。 这是CSS评论可以在网站上成为宝贵帮助的地方。

将评论添加到网站的CSS文件是为正在审阅文档的人类阅读者添加代码片段结构的好方法。 这也是一种非常棒的方法,可以为将来可能需要在网站上工作的网络专业人员解释这些风格 - 包括您自己!

最后,巧妙地添加CSS注释将使样式表更易于处理。 这确实对于由团队编辑的样式表非常重要。 评论可用于将样式表的重要方面传达给不熟悉代码的不同团队成员。 这些评论对于那些曾经在网站上工作过的人,如果他们在离开一段时间之后回到代码中,也会非常有帮助。 我经常不得不编辑一个我创建几个月甚至几年前的网站,并在HTML和CSS中格式化好的评论非常受欢迎! 请记住,仅仅因为你建立了一个网站并不意味着你会记得为什么你做了你在将来返回该网站时所做的事情! 评论可以让你的意图在事情发生之前就清除并消除任何误解。

了解CSS注释的一点是,当页面在Web浏览器中呈现时,它们不会显示。 这些评论只是信息性的,就像HTML注释一样(尽管两者的语法不同)。 这些CSS注释不会以任何方式影响站点的可视化显示,并且仅存在于代码本身中。

添加CSS注释

添加CSS评论非常简单。 您只需使用正确的开始和结束评论标签来评论您的评论:

这两个标签之间出现的任何内容都将成为评论的内容,仅在代码中可见,而不会被浏览器呈现。

CSS注释可以是单行,也可以占多行。 这是一个单行的例子:

div#border_red {border:薄实红色; } / *红色边框示例* /

还有一个多行的例子:

/ *************************** ********************** ******代码文本的样式**************************** ************ *************** /

打破节

我经常使用CSS评论的方法之一是将我的样式表组织成更小,更容易理解的块。 我希望以后能仔细阅读这些部分。 要做到这一点,我经常添加带有大量连字符的注释,以便在页面中提供大而明显的中断,因为我快速滚动代码时很容易看到中断。 这里是一个例子:

/ * -----------------------标题样式----------------------- ------- * /

当我在代码中看到这些注释中的一个时,我知道这是该文档新部分的开始,使我可以更轻松地处理和使用代码。

"评论Out" 码

注释标签在编码和调试页面的实际过程中也很有用。 可以使用注释“注释掉”或“关闭”该代码的区域,以查看如果该部分不是页面的一部分会发生什么情况。

那么这是如何工作的? 那么,因为评论标签告诉浏览器忽略它们之间的所有内容,所以你可以使用它们临时禁用CSS代码的某些部分。 这在调试时或调整网页格式时可能非常方便。

要做到这一点,您只需在要开始禁用代码的位置添加开始注释标记,然后将结束标记放置在希望禁用部分结束的地方。 这些标签之间的所有内容都不会影响站点的可视化显示,允许您调试CSS以查看可能发生问题的位置。 然后,您可以进入并修复该问题并从代码中删除注释。

CSS评论技巧

作为一个回顾,下面是在CSS中使用注释的一些提示:

  1. 评论可以跨越多行。
  2. 评论可以包含您不想由浏览器呈现但不想完全删除的CSS元素。 这是调试网站样式表的好方法 - 只要确定在网站上不需要它们,请务必删除未使用的样式(而不要将它们留下注释)
  3. 每当您编写复杂的CSS时都要使用注释来添加说明,并通知未来的开发人员或将来您自己应该知道的重要内容。 这将为所有相关人员节省将来的开发时间。
  4. 评论还可以包括元信息,如:
    • 作者
    • 创建日期
    • 版权信息

性能

评论当然可以有帮助,但请注意,您添加到样式表中的评论越多,它会变得越大,这将影响网站的下载速度和性能。 这是一个真正令人担忧的问题,但您应该毫不犹豫地添加有用的和合法的评论,因为担心性能会受到影响。 CSS行不会增加文档的大小。 您需要添加多行注释以对CSS文件的大小产生重大影响。 在你的CSS中添加一些有用的评论不应该给你对页面速度带来负面影响。

最后,你会希望找到有用的评论和太多的评论之间的平衡,以获得你的CSS文档中的好处。

Jennifer Krynin的原创文章。 17/5/17由Jeremy Girard编辑