Мой html не связан с моим css на chrome os

Мой код не связывается с моим css

<!DOCTYPE html>
<html>
<head>
    <link href = "main.css" rel = "slylesheet" text = "text/css">
<title></title>
</head>
<body>
    <header>
        <div class = "container">
            <img src = "beens.jpg" alt = "logo" class = "logo">
            <nav>
                <ul>
                    <li><a href = "#">about</a></li>
                    <li><a href = "#">games</a></li>
                    <li><a href = "#">contact</a></li>
                    <li><a href = "#">blog</a></li>
                </ul>
            </nav>
        </div>
        
    </header>
</body>
</html>

У меня на флешке работало, но не локально

.container {
    width: 80%;
    margin: 0 auto;
}
.header {
    background: rgb(51, 146, 153);
}
li {
  color: rgb(142, 15, 15);
}

Мой фон все еще белый, помогите, пожалуйста

Я попытался переписать свой код ссылки и проверить здесь

Можете ли вы предоставить скриншот вашей структуры каталогов для этого проекта?

Mohammed Shahed 21.11.2022 08:20
Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
Начала с розового дизайна
Начала с розового дизайна
Pink Design - это система дизайна Appwrite с открытым исходным кодом для создания последовательных и многократно используемых пользовательских...
Учебник по Javascript
Учебник по Javascript
JavaScript - это язык программирования, который обычно используется для добавления интерактивности и других динамических функций на веб-сайты. Он...
Анимация SVG-узоров без единой строки CSS
Анимация SVG-узоров без единой строки CSS
Недавно я работал над веб-проектом, который позволил мне поэкспериментировать с шаблонами SVG. С SVG очень приятно работать, как только вы получите...
5 распространенных ошибок, которых следует избегать при начале работы с HTML
5 распространенных ошибок, которых следует избегать при начале работы с HTML
Приветствую вас, изучающие HTML! Я составил список распространенных ошибок, которые часто допускают студенты, начинающие изучать HTML. Пожалуйста,...
Неделя 1 - Карточки с временной шкалой
Неделя 1 - Карточки с временной шкалой
Поскольку это была первая неделя, я решил начать с простого. Предполагалось, что у меня будет временная шкала с несколькими карточками, которые можно...
0
1
61
5
Перейти к ответу Данный вопрос помечен как решенный

Ответы 5

Попробуй так,

.container {
    width: 80%;
    margin: 0 auto;
}
header {
    background: rgb(51, 146, 153);
}
li {
  color: rgb(142, 15, 15);
}
<!DOCTYPE html>
<html>
<head>
    <link href = "main.css" rel = "slylesheet" text = "text/css">
<title></title>
</head>
<body>
    <header>
        <div class = "container">
            <img src = "beens.jpg" alt = "logo" class = "logo">
            <nav>
                <ul>
                    <li><a href = "#">about</a></li>
                    <li><a href = "#">games</a></li>
                    <li><a href = "#">contact</a></li>
                    <li><a href = "#">blog</a></li>
                </ul>
            </nav>
        </div>
        
    </header>
</body>
</html>
 
Ответ принят как подходящий

У вас тут опечатка: <link href = "main.css" rel = "slylesheet" text = "text/css">

Так и должно быть stylesheet

Также вы называете свой заголовок классом .header Но поскольку вы не дали ему класс и хотите вызвать тег, вам нужно установить его на

header {
    background: rgb(51, 146, 153);
}

Это стандартный код:

li a {
  color: RGB(142, 15, 15);}

Это должен быть ваш HTML:

<!DOCTYPE html>
<html>
<head>
<link rel = "stylesheet" href = "main.css">
<title></title>

</head>
<body>
    <header>
        <div class = "header">
            <img src = "beens.jpg" alt = "logo" class = "logo">
            <nav>
                <ul class = "li">
                    <li><a href = "#">about</a></li>
                    <li><a href = "#">games</a></li>
                    <li><a href = "#">contact</a></li>
                    <li><a href = "#">blog</a></li>
                </ul>
            </nav>
        </div>
        
    </header>
</body>
</html>

У вас опечатка в "rel = "slylesheet"" так и должно быть rel = "stylesheet"

Также класс в <ul должен быть указан так <ul class = "li"

Это должен быть ваш css:

.container {
    width: 80%;
    margin: 0 auto;
}
.header {
    background: #1abc9c;
}
.li {
  color: rgb(142, 15, 15);
}

Просто замените цвет

.header {
        background: #1abc9c;

С нашим цветом.

Можете ли вы указать свои изменения и оставить краткий комментарий о том, почему эти изменения решат проблему?

Alex Berger 23.11.2022 08:16

Вы можете попробовать это c

Если это не работает, проблема заключается в коде ниже

Ваш ответ может быть улучшен с помощью дополнительной вспомогательной информации. Пожалуйста, отредактируйте , чтобы добавить дополнительные сведения, такие как цитаты или документация, чтобы другие могли подтвердить правильность вашего ответа. Вы можете найти больше информации о том, как писать хорошие ответы в справочном центре.

Community 24.11.2022 06:07

Другие вопросы по теме