Принцип наследования в html/css
Почему в таком html-файле:
<body>
<div class="intro">
</div>
</body>
Такой CSS-файл убирает отступы "фонового цвета"
body {
margin: 0;
}
.intro {
height: 596px;
width: 100%;
background-color: #87509C;
}
А другой — нет
.intro {
height: 596px;
width: 100%;
margin: 0;
background-color: #87509C;
}
Ответы (1 шт):
Автор решения: Sergey Glazirin
→ Ссылка
В данном случае, вы убираете отступы у body, который изначально имеет отступы по-умолчанию в 8px. А блок .intro занимает всю ширину body, но не выходит за его пределы
body {
margin: 0;
}
.intro {
height: 596px;
width: 100%;
background-color: #87509C;
}
Во втором кейсе, меняются отступы у .intro, а у body остаются стандартные 8px. Блок .intro' занимает весь блок body`, но не выходит за его пределы, поэтому остаются отступы на "заднем фоне"
.intro {
height: 596px;
width: 100%;
margin: 0;
background-color: #87509C;
}
Для сброса стандартных стилей для тегов body и html можно использовать что-то подобное:
html,
body {
margin: 0;
padding: 0;
}