它是不好的做法,注释掉CSS的单一线,//?(Is it bad practice to comme

2019-06-18 01:18发布

使用我最近开始//以“评论”的CSS代码进行单行。 我明白,我没有实际注释掉线; 我只是打破它(我应该使用/* ... */ ),但它具有相同的效果。 线然后被终止; 和下面的代码工作正常。

我可以删除它,但往往我不喜欢的情况下,我希望把它背在后面或看到我一直在使用,如果我回来了。

例:

li{
    float:left;
    //list-style-type:none;
    text-indent:0px;
}

我可以逃脱这个,或者是它可能引起我的问​​题?

Answer 1:

首先:注释掉的代码是一个代码味道 ,应该避免。 我假设你正在使用像VCS 的Git ,它处理历史代码为您服务。

但如果你真的想要的工作是这样的:你不知道未来如何和/或外来的浏览器就会把非官方的黑客一样// ,让你更好地与相应的符号坚持:

li {
    float:left;
    text-indent:0px;
    /* list-style-type:none; */
}


Answer 2:

我看到有/有很多人抱怨这一点,因为这是一个老问题,有可能是阅读它想知道,如果它仍然是真实的,还是有很多人,如果真正有摆在首位的标准。 请允许我以清除空气。 以下是核心原因严格的CSS评论政策:

#1这不是标准

因为CSS 2.1至少规范化,评论仅被包裹在/**/ 。 虽然某些浏览器容忍// ,他们不应该,而且是从别人只有一英寸说:“哦,是的这是非标准”或“嘿,这是不规范的,解决它!” 然后你猜怎么着,你的CSS代码,这是工作,现在并不为成千上万的人(和可能已经不工作了数百人)。 我将添加<!---->被允许的,但只(我的意思是ONLY)当它们出现在HTML文档中,而不是在一个名为.css源文件。 如果你的浏览器是太旧,不能跳过<style>标签,它可能是时间,一个新的浏览器10年前。 即使山猫等文本浏览器不知道阅读他们,所以注释掉它只是非常孤立的情况下的硬件和软件都在其当前的工作状态内陆有用。

#2它不是(非常)跨平台友好

单线评论,其中的任何位置上开始一个符合// ,由“新行”,这是/不是跨平台的标准化字符(多个)终止。 更糟的是,有些人可能有一个换行符一个字符,或2 ... ...当这些平台搭配在一起,一个新行可能会丢失,而且有你去...终结和一些或所有代码现在被注释掉不应该是,你不必是一个天才知道的后果会是什么,尤其是如果你只通过CSS很多做控制你的网站的功能。

#3标准是友好和统一所有

/**/定界符总是要在每台计算机上相同的字符无论体系结构,操作系统,等等的

#4换行符空白字符

最后一个原因(是的,有一个),换行符(S)被认为是(在CSS和许多其他语言)是空白,和*/是不是空白是什么呢? 如果你在这一点上想想,应该是很清楚的,你不应该使用一个空格终止评论尤其是因为空格是,可以通过许多HTML / CSS解析器被剥离,或者没有你甚至不知道关于它重新格式化。

#5 CSS!= C / C ++

现在,如果你将要飞出你的座位,并冲我嚷嚷约“嘿嘿,不过C ++ ...”,请记住这些编译器和IDE都吨换行符检查和检测内置到他们,使他们能够接受它。 大多数编译器不会重新格式化您的代码,除非问,和许多IDE通常会问你是什么样的换行,如果它不能在自己的猜测您的文档使用。 如果我们这样做的每一个加载时间CSS网页为最终用户,想象它会试图绕过噩梦。 此外,C / C ++代码不是在运行时进行解析和编译,所以后来很多的时间,用户永远不会在第一时间有问题的文件。 源文件不被不断被整个世界上数以百计的平台和许多操作系统,以及一百万个不同的浏览器观看无论是。 这些评论剥离出来,他们曾经到达最终用户之前。 CSS来源是正确的用户的浏览器,必须是非常有弹性,不知道什么是对的另一边,所以需要注意的是,它必须做好一切准备的最终用户或确实,没有什么的开发者或拥有!

#6这是不方便

不,这是非常恼人不必输入额外的*/ ,但是这方面的指责主要是去CSS编辑软件的开发谁不提供自动完成。 如果你使用一个专门的编辑器,可以做到这一点,最好开箱即用,那么你会发现它就像使用一样方便// 。 获得打字的习惯/**/ ,然后退格2,它会帮你不要忘记,并使其更容易一些。 更妙的是,你可以设置一个热键,只是放下那些你。 Windows和Linux都具有强大的工具来实现此操作(KDE是针对非常好)。


我希望这有助于大家理解“为什么”背后的“如何做”,并记住只是因为一些对你的作品,并不意味着它是标准的,并且总结:

是的,是不好的做法,使用它,只是说NO的双斜线! 如果你需要一个视觉辅助,提醒你这个重要的事实,只是这映像刻录到你的心(感谢你们谁没有什么好做,但做出这样的图片):


PS:如果你真的想要什么可抱怨的那些制定/断CSS标准(W3C,肘),有人开始一个关于如何不必要的长和错误的关键词是讨论“重要!”! 但是,这是不是这个问题,所以我不会进入它的一部分。

参考

  • W3C:CSS 2.1工作草案:注释字符。
  • W3C:CSS语法模块级3:解析器至字符解释铁路图。
  • 堆栈溢出用几乎相同的主题,因为这一个不同的堆栈溢出的文章。
  • W3Schools的 :CSS语法3标准(其又引用W3C)。
  • sitepoint: 对“不使用双斜线” CSS语法标注。
  • Mozilla浏览器| MDN: 放松CSS 3处理使得输入文件中的双斜线。


Answer 3:

我最近看了这篇文章 ,其揭示了很多光对一行在CSS评论的做法。

CSS允许您使用//一种时尚了。 这不是很行发表评论,但下一个结构评论 。 也就是说,只要您使用// ,未来CSS结构-该声明或块-将“注释”。

因此,在你的代码片段list-style-type:none是下一个CSS结构,它被注释掉。

li {
    float:left;
    //list-style-type:none;
    text-indent:0px;
}

类似地,在下面的代码段

//@keyframes foo {
  from, to { width: 500px; }
  50% { width: 400px; }
}
@keyframes bar {
  from, to { height: 500px; }
  50% { height: 400px; }
}

//将注释掉第一@keyframes声明。

如果您尝试使用//只是为了写评论到样式表,你必须要小心-原始文本不是CSS结构,所以它会看过去那种在你的页面注释掉下一个结构。 因此,在下面的代码片段

// Do some stuff.
.foo { animation: bar 1s infinite; }

这将注释掉.foo块。

你可以通过在开始提到的链接文章的详细信息。



Answer 4:

根据工作草案 ,没有什么能像一个单行注释。



Answer 5:

是的,我认为在当前状态使用单行注释是不好的做法。

对于初学者来说,如果你是一个团队环境中工作,那么代码的可维护性/可读性是非常重要的,即使你单独工作,编写维护的代码仍然是很好的做法,否则疯狂将接踵而至。

当你开始使用单行注释既可维护性和可读性不畅,编辑中的语法荧光笔不会突出你的评论,它会变得难以从规则区分评论。

此外,单和多行注释不包含性互换的,比如你不能在不使用黑客使用原始文本的意见,而你只能注释掉结构//.foo {...}或规则.foo {//height:10px}

Uninterchangeable实例:

ul.images {
    padding: 0;
    //static height value
    height: 270px;
    margin: 0 auto;
}
ul.images {
    padding: 0;
    /*static height value
    height: 270px;*/
    margin: 0 auto;
}

现在互换(由于空的构造黑客 ):

ul.images {
    padding: 0;
    //static height value{};
    height: 270px;
    margin: 0 auto;
}
ul.images {
    padding: 0;
    /*static height value*/
    height: 270px;
    margin: 0 auto;
}

当使用构造{}; 作为后缀将工作,但它打败IMO使用它,因为你会使用多个字符的目的; 一多行注释使用四个字符, /**/ ,而与所述劈一个单行注释使用五个字符, //{};

其中尚未提及的单行注释最后需要注意的是, Chrome的开发者工具将隐藏注释的规则,而不是让你切换他们。

Chrome开发者工具(多行注释):

Chrome开发者工具(单行注释):

一个良好的使用情况下,国际海事组织,对于单行注释是当你需要注释掉整个构造,这是很长的(例子中没有)。

注释掉整个构造

//ul.images {
    padding: 0;
    height: 270px;
    margin: 0 auto;
}

/*ul.images {
    padding: 0;
    height: 270px;
    margin: 0 auto;
}*/

最后,如果你正在尝试调试开发过程中的东西,我没有看到被注释掉与单行注释构造淘汰错误的危害。 如果您正在调试,然后它会是暂时的。 这就是说,我没有看到原始文本的使用情况,所以我绝对不会使用它们有主张。



Answer 6:

我建议在不需要的时候不注释掉CSS这样。 删除你不需要它承诺你的SVN或Git仓库的东西。 让它做其工作,并跟踪历史的为您服务。 像这样成为克鲁夫特积累的意见,使你的代码难以阅读和理解。



Answer 7:

我用//为“注释”的.css文件行所有的时间。 因为它绑定到一个快捷方式Vim的 ,我总是忘记我的编辑。 在JavaScript中这是非常方便注释掉的代码块,再次测试代码,这个代码块“在评论”(快捷键,是的)。

但是,当我整理我的运.css文件,我用下面的构造进出的范围更容易移动的声明:

.pin {
    /*
    position: absolute;
    background: url(buttons-3x3.png);
    background-color: red;
    */
    height:50px;
    width:150px;
    position: relative;
}


.shadow {
    margin-top: 25px;
    margin-left: 25px;
    margin-left: 60px;
    width:50px;
    height:50px;
    background: url(playground.png) -400px -100px;
    position: relative;
    position: absolute;
}

.pin我可以删除一行,并把它添加到评论区,反之亦然。 在.shadow我只是重新声明不同的值相同的属性。

这是一个痛苦。

!重要



Answer 8:

正如其他人所说,使用双斜杠不符合标准的,但如果你真的想使用它,并希望成为标准,并且您已经安装了GCC,你可以运行通过你的CSS cpp -P剥离所有双斜线和从CSS / * ... * /注释。 作为奖励,你可以使用宏,包括和条件,和评论没有得到浏览器(小的性能提升)下载。

唯一的主要问题是使用独立的ID标签(即#para { ... }其中CPP barfs。 溶液有双倍的#(以##),并通过sed的传递输出,如下所示:

cpp -P site.cssin | sed -e 's/^##/#/' >site.css

我敢肯定有更好的面向CSS-预处理器,但是这为我工作。



Answer 9:

对于内联CSS的意见 ,我使用:

.myDiv {
    @width:750px;  
}

或者你想要的任何字符(即*@!ZZ )所以,物业变得未知,而不是由CSS可读。



Answer 10:

注释在HTML:

<!--........................-->
<!--  <input type="text" name="lastname">-->

评论在JavaScript:

单行注释:

两条斜线“//”,在前面的代码:

//document.write("Try this");

多行注释:

<script type="text/javascript">
    <!--

    /* document.write("try this!");

    document.write("try this"); */
    //-->

</script>

在CSS注释代码:

/*
.tblemp {
color:red; }

*/

更多细节



Answer 11:

我想补充一些进一步的信息,并确认“唯一使用/ *注释”规则。 谁有权访问该网站文件夹中的客户只是通过自己选择使用这个注释掉一行:

//*  comment here   *//

其实铬和Safari浏览器会忽略任何遵循这条线; 我把它叫做“CSS杀手”。



文章来源: Is it bad practice to comment out single lines of CSS with //?