您的选择器错误，

Question

这是我第一次在CSS中使用div。我知道还有其他线程在那里提出类似的问题 - 我已经读过这些，但他们没有帮助。

这是我的CSS：

.global {
    position: fixed;
    top: 0px;
    left: 5px;
    padding: 15px;
    background-color:#2C3539;
    border-color:#000000;
    border-width:1px;
    border-style: solid;
}

这是html：

 <div id="global">
    <h1>Global Element</h1>
    <ul>
        <li>Global 1</li>
        <li>Global 2</li>
        <li>Global 3</li>
        <li>Global 4</li>
        <li>Global 5</li>
    </ul>            
</div>

在html中，div嵌套在body中，但我尝试在主体内嵌入CSS中的div，但是没有用。我知道样式表正确地链接到html文件，因为当我将上面的css应用到body时它起作用了。我错过了非常简单的东西吗？感谢

Answer 1

如果您在HTML代码中使用 id ，则需要在css代码中使用＃。

<div id="global"></div>

#global { }

如果您在HTML代码中使用类，则需要在css代码中使用。。

<div class="global"></div>

.global { }

Answer 2

虽然其他人已经指出您的CSS和HTML不匹配，因为您的CSS中使用了类，并且HTML中使用了ID，因此了解何时使用它们非常重要。

当只有一个实例时，

在CSS / HTML中使用ID。 ID基本上类似于私有 CSS - 一个会有变化影响它且仅影响它。

ID在设计中占有一席之地，经过深思熟虑的结构应该利用ID。将ID视为安全。如果您更改ID的样式，它只会影响该特定区域，因此您不必担心会对您网站的其他各个部分产生影响的更改。

但是，如果你想要这个 - 许多人这样做，因为它减少了你需要做的编辑量 - 那么你就使用了类。类本质上类似于 public CSS，因此，对CSS类的更改将影响使用该类的任何HTML。正如您可能猜到的，由于此可重用性，通常会更广泛地使用类。您可以创建基本类并在整个站点上应用它们。

此实例的基本示例如下：

#logo {
  width: 150px;
  color: #000000;
}

.white {
  background-color: #ffffff;
}

此处，您的#logo是一个ID。这是站点顶部的静态元素，因此不会重复使用。 .white是一个类，它将白色背景应用于任何元素。这是可以重复使用的东西。

**请注意，这些是非常基本的例子

所以，你可以这样：

<div id="logo" class="white">MyLogo</div>

将您的白色类应用于您的徽标ID，使您的徽标具有白色背景。

在设计时，以这种方式考虑您的结构非常重要。值得花一些时间来确定是否以及如何重用代码。

Answer 3

您的选择器错误，

<div class="global"></div>

用途

.global {
}

使用.select和#select

有区别

<div id"global"></div>

用途

#global {

}

CSS样式不适用于div

3 个答案:

您的选择器错误，