☰

VS コードのバグ。CSS が要素をまったく取得しない

tag-icon • tag-icon html visual-studio-code css
VS コードのバグ。CSS が要素をまったく取得しない

何が問題なのかよくわかりませんし、他のどこにも答えが見つかりません。しかし、CSS の変更はブラウザーに読み込まれません。h1 タグの単純な色の変更でさえもです。ただし、他のプロジェクトでこれが当てはまるかどうかを確認したところ、問題なく動作しました。新しいプロジェクトを開始したときだけ発生するようです。私はエディターとして Visual Studio Code を使用しています。

(説明がおかしくてすみません。私は間違いなく初心者で、まだ専門用語を勉強中です)

単にこれを行うだけでは、変更はブラウザに読み込まれません。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>Hello</h1>
</body>
</html>

h1 {
    color: red;
}

何か助けて？

答え1

CSS宣言

h1 {
    color: red;
}

ファイル内に直接記述することもできます.htmlが、その場合は タグ内に記述する必要があり<style>、そのタグも タグ内に記述する必要があります<head>。

<head>
    <style>
        h1 {color: red;}
    </style>
</head>

完全なコードは

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        h1 {color:red;}
    </style>
</head>
<body>
    <h1>Hello</h1>
</body>
</html>

答え2

次のように、h1 タグにインライン CSS プロパティを適用してみることもできます。

<body>
    <h1 style="color:red;">Hello</h1>
</body>

または、次のようにタグ内にコードを配置することもできます。

<head>
    <style>
        h1 {color: red;}
    </style>
</head>

または、外部 CSS ファイルを使用して、それをヘッド セクションにリンクすることもできます。

関連情報