панель навигации стиля, CSS код не работает при использовании класса - PullRequest
0 голосов
/ 18 марта 2020

У меня есть этот действительно простой код. Я создаю панель навигации в коде CSS, когда я пытаюсь стилизовать панель навигации с помощью ключевого слова «nav», которое, кажется, работает, но если я создаю класс, предположим, что class = "nav-bar" и пытаюсь получить к нему доступ, используя .nav-bar в коде CSS и отформатируйте его оттуда, кажется, ничего не происходит.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
    <title></title>
  </head>
  <body>
    <nav class="nav-bar">
      <img src="tesla_logo_PNG16.png" alt="logo" class="logo">
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
        <li><a href="#">Log out</a></li>
      </ul>
    </nav>
  </body>
</html>

Вот CSS, который не работает

.nav-bar {
  width: 100%;
  height: 10%;
  color: red;
}

Вот CSS, который работает

nav {
  width: 100%;
  height: 10%;
  color: red;
}

1 Ответ

0 голосов
/ 18 марта 2020

.nav-bar {
  width: 100%;
  height: 10%;
  background-color : red;
}
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
    <title></title>
  </head>
  <body>
    <nav class="nav-bar">
      <img src="tesla_logo_PNG16.png" alt="logo" class="logo">
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
        <li><a href="#">Log out</a></li>
      </ul>
    </nav>
  </body>
</html>

Цвет работает только на текст

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...