Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
219 views
in Technique[技术] by (71.8m points)

css - VS Code - Why vscode doesn't display html tag attributes

I use VS Code for HTML editing, but when I enter the tag, it does not display its attributes and even when I add the attribute I want, it does not recognize it. I did the following, but none of them worked:

1-I installed the relevant extensions(HTML CSS Support , HTML Snippets , HTML Boilerplates , etc). 2-After I added a tag, press Ctrl+Space. 3-restart my machine. 4-reinstall VS code.

(I entered the css, html code below and the name of my css file is "style post.css" and it is in the folder where my HTML file is located).

I did everything I could, I would be happy if someone could guide me.

h2.head1{
    color:red ;
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Post</title>
    <link rel="stylesheet" href="style_post.css">
</head>
<body>
    <h1> Scrambled Eggs </h1>
    <p>
    eggs are one of my favorite foods.here is recipe for deliciously rich scrambled eggs.<br>
    </p>
    <h2 class:"head1">Ingredients</h2>
    
    <ul>
        <li>
        2eggs
        </li><li>
        1 tbs butter
        </li><li>
        2 tbs cream
        </li>
    </ul>
    
    <h2>Method</h2>
    
    <ol>
        <li>
        Melt butter in a frying pan over a medium heat.
        </li><li>
        Gently mix the eggs and cream in the bowl.
        </li><li>
        once bottle has melt add cream and eggs.
        </li><li>
        Using the spatula fold the eggs from the edge of the pan to the center every 20 secend(as if you are making an omelette)
        </li><li>
        When the eggs are still moist remove from the heat(it will continue to cook on the plate until served)
        </li>
    </ol>
</body>
</html>
question from:https://stackoverflow.com/questions/65918112/vs-code-why-vscode-doesnt-display-html-tag-attributes

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You either have a typo or you have to look up on how to set attributes in HTML: You do this with this syntax: attribute="value" and not with :

So in your case you should have used class="head1"

h2.head1{
    color:red ;
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Post</title>
    <link rel="stylesheet" href="style_post.css">
</head>
<body>
    <h1> Scrambled Eggs </h1>
    <p>
    eggs are one of my favorite foods.here is recipe for deliciously rich scrambled eggs.<br>
    </p>
    <h2 class="head1">Ingredients</h2>
    
    <ul>
        <li>
        2eggs
        </li><li>
        1 tbs butter
        </li><li>
        2 tbs cream
        </li>
    </ul>
    
    <h2>Method</h2>
    
    <ol>
        <li>
        Melt butter in a frying pan over a medium heat.
        </li><li>
        Gently mix the eggs and cream in the bowl.
        </li><li>
        once bottle has melt add cream and eggs.
        </li><li>
        Using the spatula fold the eggs from the edge of the pan to the center every 20 secend(as if you are making an omelette)
        </li><li>
        When the eggs are still moist remove from the heat(it will continue to cook on the plate until served)
        </li>
    </ol>
</body>
</html>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...