Отступы и поля
Между заголовком и основным текстом слишком большой отступ, как его уменьшить?
К абзацу (тег
) и заголовку (тег ) автоматически добавляется верхний и нижний отступы, которые в сумме и дают большое расстояние между заголовком и текстом. Чтобы уменьшить величину отступа надо явно добавить свойство margin-bottom к селектору H1 . Причем можно установить положительное, нулевое или отрицательное значение. Таким способом легко задавать желаемое значение отступа.
Как мне для каждого абзаца добавить отступ первой строки?
Когда требуется установить абзацный отступ, лучше всего использовать стилевое свойство text-indent . Его значение определяет насколько сдвинуть текст первой строки вправо от исходного положения. Ширина текстового блока при этом не меняется и остается исходно заданной. Величину отступа можно указывать в пикселах, процентах или других доступных единицах (пример 1).
Как убрать отступы и поля у всех элементов на странице?
Чтобы обнулить отступы и поля у всех элементов на странице, используйте стилевые свойства margin и padding с нулевыми значениями, добавляя их к универсальному селектору * .
Как изменить расстояние между абзацами текста?
При использовании тега
автоматически добавляются отступы сверху и снизу от текстового абзаца. Это сделано для того, чтобы визуально отделить один блок текста от следующего. Понятно, что значения отступов, которые заданы по умолчанию, устраивают не всегда, поэтому иногда их приходится уменьшать или увеличивать. Для этого можно использовать универсальное свойство margin , оно определяет отступы со всех сторон абзаца или margin-top для отступа сверху и margin-bottom — для отступа снизу.
Как убрать отступы вокруг формы?
При добавлении формы через тег вокруг нее сверху и снизу автоматически добавляются отступы. Чтобы их убрать, используйте стилевое свойство margin с нулевым значением, добавляя его к селектору FORM .
Как изменить отступы на веб-странице?
Отступы на веб-странице хотя и не видны, но не позволяют содержимому плотно прилегать к краям окна браузера, чтобы обеспечивать комфортность чтения. Свое собственное значение отступов можно установить, изменяя значения свойства margin у селектора body .
Как убрать отступы вокруг формы?
Убрать отступы вокруг формы добавляемые браузером по умолчанию.
Решение
При добавлении формы через тег вокруг неё сверху и снизу автоматически добавляются отступы. Чтобы их убрать, используйте стилевое свойство margin с нулевым значением, добавляя его к селектору form , как показано в примере 1.
Пример 1. Нулевые отступы вокруг формы
HTML5 CSS 2.1 IE Cr Op Sa Fx
Отступы вокруг формы
Отступы заметны в тех случаях, когда форма располагается внутри других элементов страницы и влияет на их положение.
HTML по теме
CSS по теме
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.
Популярные рецепты
- Как добавить картинку на веб-страницу?
Как добавить иконку сайта в адресную строку браузера?
Как добавить фоновый рисунок на веб-страницу?
Как сделать обтекание картинки текстом?- Как растянуть фон на всю ширину окна?
- Как выровнять фотографию по центру веб-страницы?
Как разместить элементы списка горизонтально?
Как убрать подчеркивание у ссылок?
Как убрать маркеры в маркированном списке?
Как изменить расстояние между строками текста?
Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?- Как открыть ссылку в новом окне?
Как убрать отступы по краям?
Здравствуйте. Я новичок в html и css. Никак не могу понять как убрать лишние отступы сверху и по бокам. Нужно чтобы верхняя панель была полностью по ширине сайта и сверху не было пространства. И еще вопрос: Размер текста лучше указывать в пикселях? Чтобы было всё адаптивно на любом браузере. Вот мой код:
1 2 3 4 5 6 7 8 9 10 11 12 13
html> head> title>Мой первый сайт/title> meta charset="utf-8"> link rel="stylesheet" href="css\style.css"> /head> body> div> header class="welcome-header">h1>Добро пожаловать на сайт!/h1>/header> /div> /body> /html>
1 2 3 4 5 6 7
.welcome-header { margin: 0px; background-color: rgb(11, 79, 146); font-size: 20px; text-align: center; color: rgb(110, 190, 255); }
Лучшие ответы ( 2 )
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:
Как сделать отступы по краям страницы
Как отображающийся документ не растягивать по всей ширине? По краям должны остаться пустоты. Я уже.
Как использовать сетку Бутстрапа,чтоб по краям были пропорциональные отступы?
Есть задача сверстать страницу адаптивно с помощью сетки бутстрапа. Но возникла проблема — При.
Отступы по краям картинки
Помогите начинающему! Появились отступы по бокам картинки.<!doctype html> <html> <head> <meta.
Отступы по краям у Grid layout
Приветствую Вас, господа прохожие и мастера))) На днях решил сверстать навигационное меню на.
2586 / 1677 / 732
Регистрация: 13.03.2010
Сообщений: 5,634
Сообщение было отмечено Daniil4k как решение
Решение
html,body{margin:0;padding:0;}
Регистрация: 25.09.2019
Сообщений: 208
gogolik, слева и справа нормально стало, а сверху не убралось.
2586 / 1677 / 732
Регистрация: 13.03.2010
Сообщений: 5,634
Сообщение было отмечено Daniil4k как решение
Решение
h1{margin:0;}
Регистрация: 25.09.2019
Сообщений: 208
gogolik, Спасибо
Заблокирован
gogolik, а можно так главному заголовку делать? Прижимать его к остальной чуши?
Добавлено через 1 минуту
Сообщение от Daniil4k 
за что спасибо? За то, что верхний блок наехал на заголовок?
Регистрация: 25.09.2019
Сообщений: 208
Verolomstvo, Что не так? Говори конкретно.
1 2 3 4 5 6 7 8 9 10 11 12 13
html> head> title>Мой первый сайт/title> meta charset="utf-8"> link rel="stylesheet" href="css\style.css"> /head> body> div> header>h1 class="welcome-header">Добро пожаловать на сайт!/h1>/header> /div> /body> /html>
1 2 3 4 5 6 7 8 9 10 11 12 13
body {margin:0;} .welcome-header { height: 50px; padding: 0px; margin: 0px; background-color: rgb(25, 64, 112); font-size: 35px; font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; font-style: italic; text-align: center; color: whitesmoke; }
2586 / 1677 / 732
Регистрация: 13.03.2010
Сообщений: 5,634
Verolomstvo, можно. Отступ просто задать внешнему блоку.
А спасибо за то, что сделал так, как хотел ТС.
Заблокирован
gogolik, и как сео воспримет зажатый главный заголовок? Он его увидит, как полноценный h1?
Добавлено через 7 минут
Сообщение от Daniil4k
Что не так? Говори конкретно
Раз: header — блочный, зачем его в div? Теперь загугли h1 блочный или строчный и нужно ли заголовок помещать в заголовок.
Добавлено через 6 минут
Daniil4k,
ты просто где-то увидел шаблон вида
header
main
footer
и теперь следуешь ему
2586 / 1677 / 732
Регистрация: 13.03.2010
Сообщений: 5,634
Verolomstvo, я думаю, что человек только учится и не нужно ему голову сходу забивать всякими seo-причудами. А вообще, да, увидит как полноценный заголовок. Главное, чтобы он был на «первом экране».
С точки зрения семантики нет ошибки в конструкции div>header. Потому что может быть общий контейнер, в который обёрнут контент. А уж в конструкции header>h1 вообще нет ошибки.
Заблокирован
Сообщение от gogolik
header>h1 вообще нет ошибки
ну если только это не базовый шаблон, определяющий всего лишь где что находится примерно
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
Помогаю со студенческими работами здесь
Появляются отступы по краям страницы
Имеется несколько страниц html и один css файл все страницы кроме index.html отображаются на весь.
Как убрать отступы
Как можно убрать отступы справа и слева? ссылка на сайт
Как убрать отступы тега br?
как убрать стандартное отступы которые дает тег br
Как убрать непонятные отступы?
Доброго всем времени суток. Возникла такая проблема, появился непонятный отступ снизу, суть в том.
Как убрать отступы слайдера
Есть стандартный слайдер шаблона Helix II, так вот у него есть отступы как по ширине так и по.
Как убрать лишние отступы
Здравствуйте, подскажите пожалуйста почему как убрать лишние отступы. Скриншот и архив прилагается.
Как убрать отступы HTML-элемента
Как убрать отступы HTML-элемента, которые браузеры устанавливают по умолчанию? Подобный вопрос часто возникает у начинающих верстальщиков, которые хотят убрать подобные отступы у таких элементов, как , HTML-таблицы (тег ) и их ячейки и т.д. На самом деле нет ничего проще, но сначала давайте разберемся, а отступы ли вы имеете в виду, когда ищете ответ на этот вопрос?
В CSS есть два типа свойств, которые отвечают за отступы (CSS padding) и поля (CSS margin) элементов. Их расположение показано на следующем изображении:
Так вот, когда многие новички говорят о том, что хотят убрать у элемента отступы, то на самом деле они имеют в виду его поля, так как именно их обычно добавляют браузеры к некоторым элементам. Нет, отступы, конечно, тоже добавляются, но таких элементов очень мало, например, у тегов и браузеры устанавливают ненулевые отступы, чтобы текст на кнопках не прилегал к рамке вплотную.
Немного иначе обстоит дело у HTML-таблиц, так как у них есть еще два параметра — это свойство CSS border-spacing, изменяющее расстояние между границами или рамками ячеек (которое тоже можно назвать отступами) и CSS border-collapse, которое вообще убирает это расстояние и делает границы общими. На изображении ниже показано размещение всех этих полей и отступов у таблицы.
Ну что ж, а теперь, когда вы все это знаете — рассмотрим несколько примеров.
Как убрать отступы по краям HTML-страницы
Пример HTML и CSS: убираем отступы у тега BODY
seodon.ru - Убираем отступы по краям страницы Содержимое страницы.