Китегории

Как изменить отступы на веб-странице?

6 мая 2022
Internet Explorer Chrome Opera Safari Firefox Android iOS
4.0+ 1.0+ 4.0+ 1.0+ 1.0+ 1.0+ 1.0+

Задача

Убрать отступы на веб-странице добавляемые браузером по умолчанию.

Решение

Отступы на веб-странице хотя и не видны, но не позволяют содержимому плотно прилегать к краям окна браузера, чтобы обеспечивать комфортность чтения. Своё собственное значение отступов можно установить, изменяя значения свойства margin у селектора body.

Пример 1. Нулевые отступы на веб-странице

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Долой отступы!</title>
  <style>
   body {
    margin: 0; /* Убираем отступы */
   }
   h1 {
    background: #000080; /* Цвет фона блока */ 
    color: #ffe; /* Цвет текста */ 
    margin: 0; /* Нулевые отступы вокруг текста */ 
    padding: 10px; /* Поля вокруг текста */ 
   }
  </style>
 </head>
 <body>
   <h1>Заголовок</h1>
 </body>
</html>

Результат данного примера показан ниже.

Рис. 1. Вид веб-страницы без отступов


Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Статьи