Question

.navbar和.navbar之间有什么区别

   .navbar {
        overflow: hidden;
        background-color: #333;
        font-family: Arial;
    }


    .navbar a {
        float: left;
        font-size: 16px;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
    }

我无法找到它们之间的区别。请不要生气，我是网络技术的小伙子

Answer 1

如果您有以下HTML

<div class="navbar">
     <p>Hello World>
     <a href="#"> Hello World</a>
</div>

.navbar将应用于您的div，然后应用于其中的所有内容

.navbar a只会被<a>

应用于div中的class=navbar标记

Answer 2

要解释它，请考虑以下HTML代码：

<div class = "navbar">
    <a></a>
</div>

第一个div将应用以下样式：

overflow: hidden;
background-color: #333;
font-family: Arial;

但是<a></a>将应用以下样式：

    float: left;
    font-size: 16px;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;

对于<a>代码，您无需添加任何class属性。它会在您定义样式.navbar a

时自动应用样式

Answer 3

在这种情况下.navbar是一个css类，主要引用超链接所在的父元素（即HTML文件中的<a>）。它可以是div或某个容器元素，取决于您的HTML。

虽然.navbar a引用任何<a>，它是容器元素中的子元素。不属于.navbar元素子元素的超链接不会受到影响。例如，让我们看一下这个html块：

<div class="navbar">
  <a href="https://stackoverflow.com">Click here!</a>
</div>

让我们说上面的内容是你的index.html文件的一部分。在你的css文件中：

.navbar {
  /*all css style here will affect your div class="navbar"*/
}
.navbar a {
  /*put something here to style all hyperlinks that are child to .navbar elements*/
}

请告诉我们。您可以查看this等网站并阅读和阅读很多内容，通过练习和阅读，您的技能将大大提高。

CSS中.navbar和.navbar a之间的区别

3 个答案: