0
0

Цвет обоих блоков зеленый, по последнему тегу. Как в коде сделать что бы цвета блоков были разные!?

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Урок HTML разметки</title>
<meta name="description" content="Урок HTML разметки">
<meta name="keywords" content="html, урок">
</head>
<body>
<div class="content">
<h1>Урок HTML разметки</h1>
<p>Первый параграф. Текст страницы урок <strong>Урок HTML</strong> разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
<p>Второй параграф. Текст страницы урок Урок HTML разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
</div>
<style type="text/css">

.content{background: red;}
</style>
<div class="content">
<h1>Урок HTML разметки</h1>
<p>Первый параграф. Текст страницы урок <strong>Урок HTML</strong> разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
<p>Второй параграф. Текст страницы урок Урок HTML разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
<strong></strong>
</div>
<style type="text/css">

.content{background: green;}
</style>
</body>
</html>

Спасибо


Алексей Быков
3 years ago






Сама сейчас час билась над этим вопросом и не знаю правильно ли я сделала, но получилось в итоге как надо. Я во втором блоке "content" заменила на  "block". Не только в начале, но и соответственно в низу, при задаче стиля. Пришла к этому наугад, просто лопатила гугл и смотрела чужие коды. Хочется комментарий преподавателя

Татьяна Сафронова
3 years ago

vot tvoy prablema bro chitay etot kod 

Цвет обоих блоков зеленый, по последнему тегу. Как в коде сделать что бы цвета блоков были разные!?

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Урок HTML разметки</title>
<meta name="description" content="Урок HTML разметки">
<meta name="keywords" content="html, урок">


</head>
<body>
<div class="text" style="background-color: red;">
<h1>Урок HTML разметки</h1>
<p>Первый параграф. Текст страницы урок <strong>Урок HTML</strong> разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
<p>Второй параграф. Текст страницы урок Урок HTML разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
</div>

<div class="text_text" style="background-color: green;">
<h1>Урок HTML разметки</h1>
<p>Первый параграф. Текст страницы урок <strong>Урок HTML</strong> разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
<p>Второй параграф. Текст страницы урок Урок HTML разметки. Показывает как работает тег параграф. Это очень полезный тег. Он отделяет текст и выводит текст с новой строки. Также тег параграф создает отступ от другого блочного элемента.</p>
<strong></strong>
</div>

</body>
</html>

Спасибо

Бабаджан Бекиев
3 years ago

.content - это название класса, чтобы назначить разные цвета блока, нужно задать разные классы, так как одному классу вы не можете назвачить 2 цвета фона одновременно,

поэтому первый класс пусть останется content, а второй назовите например content2 или content_green, как нравится ))

и для 1 класса определите красный цвет, для второго зеленый цвет фона.

блок стилей <style> можно писать в одном месте, например в конце документа, стили задаются не последовательно в коде, а разбираются сразу все перед началом формирования html-страницы. Поэтому, например, как в вашем коде, если вы назначили одному свойству сначала красный, а потом зеленый цвет, то в итоге при формировании html-страницы вы получите только последнее заданное значение, т.е. green. Поэтому и делаем разные классы для разных цветов.

Это в случае если мы хотим работать с классами, а не использовать прямое задание стилей для каждого блока, как в примере кода у Бабаджана, который тоже верно работает.

Михаил К
3 years ago

Спасибо всем за ответы!

Алексей Быков
3 years ago

4 ответов