2

HTML スタイルにコメントを追加しようとしていますが、コメントを追加するとスタイルが機能しなくなります。

以下は問題なく動作します。アイコンとテキストは灰色で表示されます。

<html lang="en">
    <head>
        <title>test</title>
        <link href="/gtd/media/css/font-awesome.css" rel="stylesheet">
    </head>
    <body>
        <style>

            .action-star {
                color: gray;
            }
        </style>
        <div class="container-fluid">
            <span class="action-star"><i class="icon-star icon-large"></i> Test Icon</span>
        </div><!--/container-->
    </body>
</html>

ただし、以下は機能しません。アイコンとテキストは黒で表示されます。

<html lang="en">
    <head>
        <title>test</title>
        <link href="/gtd/media/css/font-awesome.css" rel="stylesheet">
    </head>
    <body>
        <style>
            <!-- Comment -->
            .action-star {
                color: gray;
            }
        </style>
        <div class="container-fluid">
            <span class="action-star"><i class="icon-star icon-large"></i> Test Icon</span>
        </div><!--/container-->
    </body>
</html>

私が追加したのは次の行だけでした：

<!-- Comment -->

明らかな何かが欠けているに違いありません。. .

4

5 に答える 5

4

CSS でコメントを作成する/* Comment */には、HTML<!-- Comment -->構文ではなく を使用します。それがあなたのCSSを壊しているものです。

ヒントとして、構文の強調表示をサポートするエディターで作業している場合、通常はコメントに特定の色が付けられます。私が見たコメントの最も一般的な色は、灰色、濃い青、または濃い緑です。もちろん、これはエディターによって異なる可能性がありますが、カラーリングの変更は、コメントに適切な構文を使用していることを示す良い指標です。

<!--/container-->コード サンプルでコメントがどのようにグレーに変わったかを見てください<!-- Comment -->。ご存知のように、適切な構文を使用していなかったために、これは起こりませんでした。

乾杯！

于 2012-08-15T17:05:29.993 に答える
3

ブロック内に入ったら<style>、CSS 構文を使用する必要があります。コメントの場合、これは使用することを意味します/* Comment */

于 2012-08-15T17:06:58.777 に答える
3

CSS コメントは作成されますが/* like this */、作成されません<!-- like this -->。

于 2012-08-15T17:05:56.220 に答える
1

CSSでは、コメントは/ *で始まり、*/で終わります。コメントは複数行にまたがることができますが、ネストすることはできません。

/* This is a single-line comment */

/* This is a comment that
   spans multiple lines */

CSS2仕様によると、トークン間に表示されるコメントは、スタイルのレンダリングに影響を与えません。ただし、実際には、特定の状況で一部の古いブラウザでエラーを引き起こすコメントが見つかります。

//C++で使用されるコメント構文は許可されていません。1つの状況を除いて、フォームをとるSGMLコメントもありません<!-- … -->。CSSステートメントをHTML4より前のユーザーエージェントから隠すために、内部スタイルシート（タグを使用してHTMLソース内に配置されたスタイルシート）に表示される場合があります。ただし、このコメントの使用は冗長になり、無視できます。

于 2012-08-15T17:10:06.660 に答える
1

これは HTML コメントのスタイルです。/* comment */

于 2012-08-15T17:05:56.047 に答える