VS Code - 为什么 vscode 不显示 html 标签属性答案

【问题标题】：VS Code - Why vscode doesn't display html tag attributesVS Code - 为什么 vscode 不显示 html 标签属性
【发布时间】：2021-01-27 11:22:33
【问题描述】：

我使用 VS Code 进行 HTML 编辑，但是当我输入标签时，它不显示它的属性，甚至当我添加我想要的属性时，它也无法识别它。我做了以下，但没有一个工作：

1-我安装了相关的扩展（HTML CSS Support、HTML Snippets、HTML Boilerplates 等）。 2-添加标签后，按 Ctrl+Space。 3-重新启动我的机器。 4-重新安装VS代码。

（我在下面输入了css、html代码，我的css文件名为“style post.css”，在我的HTML文件所在的文件夹中）。

我尽我所能，如果有人可以指导我，我会很高兴。

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>

【问题讨论】：

标签： html css visual-studio-code vscode-settings

【解决方案1】：

您要么有错字，要么必须查看如何在 HTML 中设置属性：您可以使用以下语法：attribute="value" 而不是 :

所以在你的情况下你应该使用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>

【讨论】：

非常感谢。你是对的，我应该使用“=”。但是你不知道为什么它本身不显示属性？
也许可以提出一个后续问题？我不知道你对doesn't display attribute itself 的意思是什么......属性没有显示，这不是属性的用途。那你什么意思？
我不明白您所说的“这不是属性的用途”是什么意思。什么？例如，“class”、“id”是“h1”标签的属性，您必须在编写标签然后输入空格时显示这些属性。对不起，如果我解释得不好，我是 html 新手。什么是“跟进”？
跟进意味着一个新的问题，让更多的人可以尝试帮助你:) 我还是不知道你想在哪里显示这些属性？在浏览器中？别的地方？属性不会在浏览器中呈现，它们只是用于样式和功能。
我正在学习html。比如我要从h1标签中选择一个特定的标签，并在css代码中改变它的颜色，比如

【解决方案2】：

感谢用户：克隆我能够找到问题第二部分的答案，即“为什么 vscode 不会自动打开一些带有属性名称的标签”。

我说也许有人和我有类似的问题，可以帮助他/她:)

根据图中，我们要在页面右下角选择html，而我的问题是语言是django html。

【讨论】：