68

私は最近//、CSS コードの 1 行を「コメント」アウトするために使い始めました。私は実際に行をコメントアウトしていないことを理解しています。私はそれを壊しているだけです(使用する必要があります/* ... */)が、同じ効果があります。その後、行は で終了し;、次のコードは正常に機能します。

削除することもできますが、後で元に戻したい場合や、戻ってきたときに使用していたものを確認したい場合に備えて、削除したくないことがよくあります.

例:

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

これを回避できますか、それとも問題を引き起こす可能性がありますか?

4

11 に答える 11

84

これについて不平を言う人がたくさんいる/いることがわかりました. 空気をきれいにさせてください。以下は、厳格な CSS コメント ポリシーの主な理由です。

#1 標準ではない

少なくとも CSS 2.1 以降は標準化されており、コメントは と でのみ囲む必要が/*あり*/ます。一部のブラウザは//. それから、何千人もの人々にとって機能していなかったあなたの CSS コードが、今では機能していないことを推測してください (そして、他の何百人もの人々にとってはすでに機能していない可能性があります)。私はそれを追加し<!---->許可されますが、.css ソース ファイルではなく、HTML ドキュメント内に表示される場合にのみ (という意味でのみ) 許可されます。お使いのブラウザーが古すぎてタグをスキップできない場合は<style>、おそらく 10 年前に新しいブラウザーを使用する時期です。オオヤマネコでさえ他のテキスト ブラウザはそれらを読み取らないことを知っているため、コメント アウトは、ハードウェアとソフトウェアが現在の動作状態で固定されている非常に孤立した状況でのみ役立ちます。

#2(あまり)クロスプラットフォームフレンドリーではない

で始まる行のどこかで始まる単一行のコメント//は、クロスプラットフォームで標準化された文字である/そうでない「改行」で終了します。さらに悪いことに、改行に 1 文字または 2 文字を使用するものもあります。これらのプラットフォームが混在すると、改行が失われる可能性があり、ターミネータが使用されます。また、コードの一部またはすべてがコメント アウトされています。特に多くの人が行っているように、CSS だけでサイトの機能を制御している場合はなおさらです。

#3 標準 IS は親しみやすく、すべての人に統一されています

/*および区切り文字は、アーキテクチャ、オペレーティング システムなどに関係なく、すべての*/コンピューターで常に同じ文字になります。

#4 改行は空白です

最後の理由 (はい、もう 1 つあります)、改行文字は (CSS および他の多くの言語で) 空白と見なされますが、空白で*/はありませんか? この時点で考えると、特に空白は多くの HTML/CSS パーサーによって取り除かれたり、知らないうちに再フォーマットされたりする可能性があるため、コメントを終了するために空白を使用してはならないことは明らかです。

#5 CSS != C/C++

席を飛び立って「やあ、でも C++...」と怒鳴ろうとしているなら、これらのコンパイラと IDE には大量の改行チェックと検出機能が組み込まれていることを思い出してください。ほとんどのコンパイラは、尋ねられない限りコードを再フォーマットしません。また、多くの IDE は通常、ドキュメントが独自に推測できない場合、ドキュメントが使用している改行の種類を尋ねます。エンドユーザー向けの CSS ページがロードされるたびにこれを行ったとしたら、悪夢のように回避しようとすることを想像してみてください。さらに、C/C++ コードは実行時に解析されずにコンパイルされるため、多くの場合、ユーザーは最初から問題のドキュメントを取得することはありません。ソース ファイルは、世界中の何百ものプラットフォームや多くのオペレーティング システム、さらには 100 万もの異なるブラウザーで絶えず表示されているわけではありません。コメントは、エンド ユーザーに届く前に削除されます。CSS ソースはユーザーのブラウザーに直接届き、反対側に何があるかを知らずに非常に弾力性がなければなりません。

#6 不便です

いいえ、余分な を入力しなければならないのは非常に面倒です*/が、これの主な責任は、オートコンプリートを提供しない CSS 編集ソフトウェアの開発者にあります。それを行うことができる専用のエディターを使用する場合、できればすぐに使用できるエディターを使用すると、//. 入力してからバックスペース 2 を押す習慣を身につけ/**/てください。忘れないようにし、少し楽になります。さらに良いことに、ホットキーを設定して、それらを配置することができます. Windows と Linux の両方に、これを可能にする強力なツールがあります (KDE はこれに非常に適しています)。


これが「方法」の背後にある「理由」を理解するのに役立つことを願っています。

はい、それを使用するのは悪い習慣です。二重スラッシュに「いいえ」と言ってください!!! この重要な事実を思い出すために視覚的な補助が必要な場合は、このイメージを頭に焼き付けてください (このような写真を作成する以外に何もすることがない人に感謝します)。

二重スラッシュなし


PS: CSS 標準 (W3C、エルボー) を作ったり壊したりしている人たちに文句を言いたいなら、誰かが「!important」キーワードがいかに不必要に長くて間違っているかについて議論を始めます! しかし、それはこの質問の一部ではないので、私はそれに立ち入りません.

参考文献

  • W3C : CSS 2.1 ワーキング ドラフト: コメント文字。
  • W3C : CSS 構文モジュール レベル 3: パーサーから文字への解釈の鉄道図。
  • スタック オーバーフロー:これと実質的に同じテーマのさまざまなスタック オーバーフローの記事。
  • w3schools : CSS 3 構文標準 (W3C を参照)。
  • sitepoint : 「ダブルスラッシュを使用しない」に関する CSS 構文注釈。
  • mozilla|mdn :緩和された CSS 3 処理により、入力ファイルでダブル スラッシュが許可されます。
于 2013-11-25T12:05:19.767 に答える
49

将来のブラウザーやエキゾチックなブラウザーが のような非公式のハックをどのように解釈するかはわかりません//。したがって、適切な表記法に固執したいと思います。

li {
    float:left;
    text-indent:0px;
    /* list-style-type:none; */
}
于 2012-09-06T11:26:08.873 に答える
4

Working Draft によると、 1 行のコメントのようなものはありません。

于 2012-09-06T11:25:11.327 に答える
3

私は//常に .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、同じプロパティを別の値で再宣言するだけです。

痛いです。

!重要

于 2013-12-29T12:42:45.060 に答える
2

不要な場合は、このような CSS をコメントアウトしないことをお勧めします。不要なものを削除し、SVN または GIT リポジトリにコミットします。その仕事をさせて、あなたのために歴史を追跡してください。このようなコメントが蓄積されると下品になり、コードが読みにくく、理解しにくくなります。

于 2012-09-06T11:25:25.207 に答える
1

インライン CSS コメントには、次を使用します。

.myDiv {
    @width:750px;  
}

または必要な任意の文字 (つまり*@!ZZ) したがって、プロパティは不明になり、css で読み取れなくなります。

于 2014-05-13T20:30:11.217 に答える
1

他の人が言ったように、二重スラッシュの使用は標準に準拠していませんが、本当にそれを使用し、標準に準拠し、gcc がインストールされている場合は、CSS を実行cpp -Pしてすべての二重スラッシュと /* を取り除くことができます。 .. */ CSS からのコメント。おまけとして、マクロ、インクルード、および条件を使用でき、コメントはブラウザーによってダウンロードされません (マイナーなパフォーマンスの向上)。

唯一の大きな問題は#para { ... }、cpp barfs. ソリューションには、# を (## に) 2 倍にして、次のように sed を介して出力を渡します。

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

より優れた CSS 指向のプリプロセッサがあると確信していますが、これは私にとってはうまくいきました。

于 2013-12-23T06:09:14.840 に答える
0

HTML でコメント:

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

JavaScript でコメントする:

1 行コメント:

コードの前の 2 つのスラッシュ「//」:

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

複数行コメント:

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

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

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

</script>

CSS のコメント コード:

/*
.tblemp {
color:red; }

*/

詳細

于 2015-10-21T18:23:56.863 に答える