Почему не делает название магазина более жирным?

Question

Илья @Sinastra

HTML
CSS

Почему не делает название магазина более жирным?

Учусь делать сайт по уроку индуса. Столкнулся с тем, что текст магазина на главной странице, не делается жирным.
Перепроверил, ошибок не нашел (может немного слепой).

Вопрос задан более года назад
75 просмотров

8 комментариев

Подписаться 1 Простой 8 комментариев

Ankhena @Ankhena Куратор тега CSS

Хорошо было бы начать с правил сервиса.
Они запрещают выкладывать код скринами.
Т.е. либо кодом в спойлере либо в песочницу на codepen.io (так быстрее можно разобраться в чем дело).

Какой прекрасный селектор использует автор видео section header .logo {}. Не смотрите его больше.

Написано более года назад
Антон @Eridani

calss="logo"
Внимательно погляди

Написано более года назад
v3shin @v3shin

Вставьте код текстом.

Написано более года назад

Илья @Sinastra Автор вопроса

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Art Case Store</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>

    <section>
        <header>
            <div class="circle"></div>
            <div class="circles"></div>
            <a href="#" calss="logo">Art<span>Case</span><span>Store</span></a>
            <ul>
                <li><a href="#">Главная</a></li>
                <li><a href="#">Товары</a></li>
                <li><a href="#">Категории</a></li>
                <li><a href="#">Новости</a></li>
                <li><a href="#">Контакты</a></li>
            </ul>
            <p>Войти</p>
        </header>
    </section>
    
</body>
</html>

Написано более года назад

Илья @Sinastra Автор вопроса

v3shin,

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: sans-serif;
}

section{
    width: 100%;
    height: 100vh;
}

section header{
    display: flex;
    align-items: center;
    justify-content: space-around;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);    
}

section header .logo{
    font-size: 30px;
    color: black;
    text-decoration: none;
    font-weight: bold;
    margin: 15px 0;
}

Написано более года назад

Илья @Sinastra Автор вопроса

Ankhena, оставил код снизу

Написано более года назад
v3shin @v3shin

Sinastra, ну так в вопрос его добавьте вместо картинок.
А по теме: ага, вы опечатались в слове "calss".

Написано более года назад
Илья @Sinastra Автор вопроса

v3shin, благодарю)

Написано более года назад

Решения вопроса 1

Комментировать

Пригласить эксперта

Ответы на вопрос 1

3 комментария

Ivan Gavrilich @joseffie

Очень ужасное решение.

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

Во-вторых, у тегов заголовков вполне можно очень просто отключить жирное начетание случайно/намеренно, из-за чего "font-weight: 700' у элементов благополучно пропадёт.

Написано более года назад
bacon_off @bacon_off

Ivan Gavrilich, ну, я по его же аналогии описал) а почему бы под h1 не сделать название сайта?
я лишь предложил вариант, не ругайся :D

Написано более года назад
Ankhena @Ankhena Куратор тега CSS

Ivan Gavrilich,
Во-первых, семантически неверно размещать блочный тег внутри строчного

Семантика - это использование тегов в соответствии с их смыслом. И не имеет ничего общего с тем, что во что можно вкладывать.
Можно ли вкладывать один элемент в другой определяется категорией контента и спецификацией, но никак не блочностью и строчностью. MDN про категории контента
В частности, у ссылки она прозрачная и в неё можно вкладывать всё, что можно вкладывать в родителя ссылки.

для каждого пункта меню прописывать тег "h1", ибо на странице он может быть всего один.

Всего один он может быть только у SEOшников, но вообще нет, не обязательно один.
Хотя, конечно, хорошо, когда один. Но запрета нет.

Другое дело, что логотип действительно не является заголовком страницы. И использовать тег заголовка только ради жирности довольно странно.

Написано более года назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

HTML

Простой
Не могу задать ширину таблицы html?
- 1 подписчик
- вчера
- 63 просмотра
1

ответ
CSS

+1 ещё

Простой
Daysi UI — изменить цвет, icon навигационного меню?
- 1 подписчик
- вчера
- 42 просмотра
1

ответ
HTML

+1 ещё

Простой
Как сделать так, чтобы содержимое defs работало?
- 1 подписчик
- 06 мая
- 45 просмотров
0

ответов
CSS

Простой
Как удалить все префиксы из css?
- 1 подписчик
- 06 мая
- 79 просмотров
1

ответ
HTML

+1 ещё

Простой
Выровнить картинку по центру в тексте, чтобы не зависимости всегда была по центру?
- нет подписчиков
- 05 мая
- 89 просмотров
1

ответ
CSS

Простой
Как создать нормальный размер картинки на php?
- 1 подписчик
- 05 мая
- 67 просмотров
0

ответов
JavaScript

+1 ещё

Простой
Галерея через сборку строки JS не позиционируется?
- 1 подписчик
- 05 мая
- 111 просмотров
0

ответов
CSS

Простой
Как сверстать не стандартный макет?
- 1 подписчик
- 04 мая
- 103 просмотра
2

ответа
HTML

+1 ещё

Простой
Почему схлопываются внешние отступы соседних элементов?
- 1 подписчик
- 04 мая
- 77 просмотров
0

ответов
CSS

+3 ещё

Простой
Как увеличить QPushButton на 105% через stylesheet?
- 1 подписчик
- 04 мая
- 39 просмотров
1

ответ
Показать ещё Загружается…

Frontend-разработчик (React)

ДАЛЕЕ

от 140 000 ₽

Тестировщик-стажёр

ITooLabs • Тула

от 35 000 до 40 000 ₽

Fullstack PHP Developer

Smapse Education

от 40 000 до 65 000 ₽

Логотип для строительной компании

08 мая 2024, в 18:28

50000 руб./за проект

Исправить бота на Python

08 мая 2024, в 18:02

1500 руб./за проект

Доработка игры PacMan GYM ATARI PYTHON

08 мая 2024, в 17:54

1000 руб./за проект

Хорошо было бы начать с правил сервиса.
Они запрещают выкладывать код скринами.
Т.е. либо кодом в спойлере либо в песочницу на codepen.io (так быстрее можно разобраться в чем дело).

Какой прекрасный селектор использует автор видео section header .logo {}. Не смотрите его больше.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Art Case Store</title> <link rel="stylesheet" href="style.css"> </head> <body> <section> <header> <div class="circle"></div> <div class="circles"></div> <a href="#" calss="logo">Art<span>Case</span><span>Store</span></a> <ul> <li><a href="#">Главная</a></li> <li><a href="#">Товары</a></li> <li><a href="#">Категории</a></li> <li><a href="#">Новости</a></li> <li><a href="#">Контакты</a></li> </ul> <p>Войти</p> </header> </section> </body> </html>
v3shin,
*{ margin: 0; padding: 0; box-sizing: border-box; font-family: sans-serif; } section{ width: 100%; height: 100vh; } section header{ display: flex; align-items: center; justify-content: space-around; box-shadow: 0 0 20px rgba(0,0,0,0.3); } section header .logo{ font-size: 30px; color: black; text-decoration: none; font-weight: bold; margin: 15px 0; }
Sinastra, ну так в вопрос его добавьте вместо картинок.
А по теме: ага, вы опечатались в слове "calss".

Answer 1 · 2022-11-09 16:41:06

Стили не применяются, потому что вы неправильно написали атрибут "class" (у вас это "calss") у лого.

Просто исправьте

<a href="#" calss="logo">Art<span>Case</span><span>Store</span></a>

на

<a href="#" class="logo">Art<span>Case</span><span>Store</span></a>

И в следующий раз внимательнее проверяйте свой код, прежде чем написать вопрос.

Answer 2 · 2022-11-09 13:03:35

bacon_off @bacon_off

<a href='#' class logo><h1>ArtCaseStore</h1></a>

попробуй так оформить, у h1-h6 уже имеется жирное начертание

Ответ написан более года назад

3 комментария

Почему не делает название магазина более жирным?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт