Почему селектор ul не работает в связанном файле CSS? - PullRequest
0 голосов
/ 05 июня 2018

Я хотел создать панель навигации, используя следующий код.

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body class="background">
<ul>
<li>Home</li>
<li>News</li>
<li>Contact</li>
<li>About</li>
</ul>
</body>
</html>

И использовал следующий код в styles.css документе.

body.background {
  background-color: #333333;
}
ul {
  list-style-type: none;
}

Хотя класс background работает отлично, селектор ul вообще не работает.Это меняется, когда я помещаю код CSS в <style></style>.Я ожидал, что пули исчезнут из списка.Теперь это выглядит так.

  • Главная
  • Новости
  • Контакт
  • О

Ответы [ 2 ]

0 голосов
/ 05 июня 2018
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <style>
        .background{
            background:#333;
        }
        ul{
            list-style-type: none;
            color:white;
        }
    </style>
</head>
<body class="background">
    <ul>
        <li>Home</li>
        <li>News</li>
        <li>Contact</li>
        <li>About</li>
    </ul>
</body>
</html>
0 голосов
/ 05 июня 2018

Попробуйте это:

.background {
  background-color: #eee;
}
ul {
  list-style-type: none;
}
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body class="background">
<ul>
  <li>Home</li>
  <li>News</li>
  <li>Contact</li>
  <li>About</li>
</ul>
</body>
</html>

Я не уверен, что вы ожидаете ... но я едва вижу элементы списка на темном фоне.Кажется, что работает нормально (без пуль).

ИЛИ

Вы можете оставить свой цвет фона прежним, просто изменив цвет ul на белый, чтобы его было легче увидеть.

.background {
  background-color: #333333;
}
ul {
  list-style-type: none;
  color: white;
}
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body class="background">
<ul>
  <li>Home</li>
  <li>News</li>
  <li>Contact</li>
  <li>About</li>
</ul>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...