关闭
> css教程 > css基础教程 >

CSS注释的写法教程|CSS注释语法

CSS注释语法

一个样式表创建完成后,再过几个星期、几个月,甚至几年后,再回过头来进行修改时,你可能怎么也想不明白以前为什么要创建这个样式,以及它到底有什么作用。对于任何项目,都是如此。

因此,在构建网站时,应该提示自己做了什么,以及这么做的原因。庆幸的是,可以通过CSS注释,把这些提示信息嵌入到式表中。

CSS注释,只不过是用“/*”和“*/”包围起来的内容。注释的内容不会被浏览器读取或执行,而它确为你提供了有益的提示。假如你创建了下面的样式,来解决IE的双边距bug:

    * html .fl {
        display: inline;
    }

在编写这个样式的时候,你很清楚它的作用,但 3 个月后,你还记得清楚吗?添加注释,让你或者需要在这个网站上工作的其他人,了解该样式的作用及创建它的原因。如:

/* 修复IE双边距bug */
* html .fl {
    display: inline;
}

注释可以是单行的,如果注释的内容很长,也可以跨越多行。注释可以独占一行,也可以放在声明块或声明语句中。注释可以出现在CSS代码的任何位置,但是,不能把注释放在另一个注释里面,即注释不能嵌套。以下都是合法的注释:

/* reset */
body, p, img, ul, ol {
    margin: 0;
    padding: 0;
}
body {
/* width: 90%;
   height: 100%; */
  font-size: 14px  /* 62.5% */;  /* 16px * 62.5% = 10px */
  background: #ccc;
}

如果CSS文件非常长,那么寻找特定的样式会很困难。一种改进方法是使用大的注释块,来把CSS文件分隔成多个逻辑部分,并在注释块的头部添加一个标志。这样,搜索这个标志和注释头中的前几个字母,就可以立即找到要寻找的部分。

/*------------ @ reset ------------*/
/*------------ @ general ----------*/
/*------------ @ hack -------------*/

并非所有东西都能够很自然的非常明确的块,这需要开发人员进行判断。总之,代码分隔得越细致、越合理,就越容易理解,而且能够更快地找到要寻找的规则,日后维护起来也越轻松。

评论

  • 随机获取
点击刷新
精彩评论