• 0
alek.xiv

Почему не работает наследственность в css

    Вопрос

    alek.xiv

    Привет! Дорогие коллеги, помогите, пожалуйста, новичку :)

    Есть код:
    <html lang="ru">
    <head>
        <meta charset="UTF-8">
        <title>Каждому мамонту — по лыжне!</title>
        <link rel="stylesheet" href="exmp.css">
    </head>
    <body>
        <h1>Пишется?</h1>
        <p>
            <div class="class">
                <div class="class2">
                    <span class="class3">
                        <s>
    Надпись!</s>
                    </span>
                </div>
            </div>
        </p>

        <h2>Как-то так</h2>
    </body>
    </html>

    Самый значимый фрагмент кода выделил красным.

    К HTML приделана CSS-ка, в которой написано следующее:

    p .class .class2 .class3 s {
        color:#f0f;
        }

    Однако цвет текста "Надпись!" (чего я изначально и добивался таким способом) не меняется! Вопрос к Вам, уважаемые знатоки: почему так? Ведь должно же! Экспериментальным способом установил, что косяк как-то связан с селектором p.

    Если пишу в CSS что-нибудь такое:
    html body .class .class3 s {
        color:#f0f;
        }

    Или такое:

    div .class2 span s {
        color:#f0f;
        }


    Всё работает превосходно, но стоит указать p, и красота моментально заканчивается, весь текст становится стандартного чёрного цвета. Почему так? :mellow:

    Изменено пользователем alek.xiv

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах

    2 ответа на этот вопрос

    Рекомендуемые сообщения

    • 0
    Vlad

    Внутрь <p> нельзя вкладывать элементы <div>. Браузер самостоятельно исправляет ошибки, закрывая <p> и ломая вашу структуру, из-за чего стили и перестают работать, поскольку вложенность элементов поменялась. Не делайте так, <p> только для текста, а не для <div>.

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах
    • 0
    wwt

    Добавлю, любой блочный элемент разорвет <p>  будучи вложенным в него непосредственно.

     

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах

    Создайте аккаунт или войдите в него для комментирования

    Вы должны быть пользователем, чтобы оставить комментарий

    Создать аккаунт

    Зарегистрируйтесь для получения аккаунта. Это просто!

    Зарегистрировать аккаунт

    Войти

    Уже зарегистрированы? Войдите здесь.

    Войти сейчас

    • Войти через Facebook
    • Войти через Twitter
    • Войти через Microsoft
    • Войти через LinkedIn
    • Войти через Google

    Карта разработчиков

    Карта участников

    Отметь себя на карте для поиска или предложения работы