当我添加 <!DOCTYPE html> 时，部分样式不起作用答案

【问题标题】：A part of styles didnt work when i add <!DOCTYPE html>当我添加 <!DOCTYPE html> 时，部分样式不起作用
【发布时间】：2022-07-06 03:15:48
【问题描述】：

当我添加 !DOCTYPE html 时，y“Tweet”按钮的样式消失了。

Tweet with style

Style gone

Css part

<!DOCTYPE html>
<html>
    <head>
        <title>Buttons</title>
        <link rel="stylesheet" href="styles/buttons.css">
    </head>
    <body>    
        <button class="buttonYT">SUBSCRIBE</button>
        <button class="JOIN">JOIN</button>
        <button class="Tweetb">Tweet</button>
    </body>

</html>

button.css 中 Tweet 按钮的 css 部分

.tweetb {
    background-color: rgb(29, 155, 240);
    color: white;
    border: none;
    height: 36px;
    width: 74px;
    border-radius: 20px;
    font-weight: bold;
    font-size: 15px;
    cursor: pointer;
    margin-left: 8px;
    transition: box-shadow 0.15s;
    vertical-align: top;
}

.tweetb:hover {
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);
}

【问题讨论】：

How do I ask a good question? -- How to create a Minimal, Reproducible Example -- 请不要包含代码图像..我们无法用图像重现您的问题！ -- 另外，问题似乎是您的班级名称中的拼写错误Tweetb

标签： html css

【解决方案1】：

从你的截图类名推文按钮是TweetBT.，而在你butttons.css它是.tweetBT，应该是.TweetBT。由于类名不匹配，因此未应用 CSS，这不是 !DOCType Html 的问题。这是因为类名选择器不匹配。

【讨论】：

天啊。谢谢伙计，非常愚蠢的错误）