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

отступы | htmlbook.ru

Аня написала следующий код (пример 1) и получила страницу, показанную на рис. 1. Но Ане нужно, чтобы не было отступов между блоками, а также справа и слева от блоков. Какие изменения в код для этого требуется внести?

К абзацу (тег <p>) и заголовку (тег <h2>) автоматически добавляется верхний и нижний отступы, которые в сумме и дают большое расстояние между заголовком и текстом. Чтобы уменьшить величину отступа надо явно добавить свойство margin-bottom к селектору h2. Причем можно установить положительное, нулевое или отрицательное значение. Таким способом легко задавать желаемое значение отступа.

Когда требуется установить абзацный отступ, лучше всего использовать стилевое свойство text-indent. Его значение определяет насколько сдвинуть текст первой строки вправо от исходного положения. Ширина текстового блока при этом не меняется и остается исходно заданной. Величину отступа можно указывать в пикселах, процентах или других доступных единицах (пример 1).

При использовании тега <p> автоматически добавляются отступы сверху и снизу от текстового абзаца. Это сделано для того, чтобы визуально отделить один блок текста от следующего. Понятно, что значения отступов, которые заданы по умолчанию, устраивают не всегда, поэтому иногда их приходится уменьшать или увеличивать. Для этого можно использовать универсальное свойство margin, оно определяет отступы со всех сторон абзаца или margin-top для отступа сверху и margin-bottom — для отступа снизу.

При добавлении формы через тег <form> вокруг нее сверху и снизу автоматически добавляются отступы. Чтобы их убрать, используйте стилевое свойство margin с нулевым значением, добавляя его к селектору FORM.

Используйте стилевое свойство margin-top (отступ сверху) и margin-bottom (отступ снизу) для селектора UL или OL, в зависимости от типа списка. Также можно воспользоваться универсальным свойством margin.

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

О сайте

Помощь

Копирование материалов

Борьба с ошибками

Технологии

Поисковый плагин

Основные разделы

Статьи

Блог

Практикум

Цифровые книги

Форум

HTML

Самоучитель HTML

XHTML

Справочник по HTML

HTML5

CSS

Самоучитель CSS

Справочник по CSS

Рецепты CSS

CSS3

Сайт

Вёрстка

Макеты

Веб-сервер

© 2002–2021 Влад Мержевич, по всем вопросам пишите по адресу [email protected]

Подпишитесь на материалы сайта по RSS

Как в html сделать отступ текста?

Здравствуйте, дорогие друзья!

Рассмотрим несколько способов как сделать отступ текста в HTML.

Навигация по статье:

Отступ текста в HTML при помощи margin

Когда вы размещаете текст на сайте он находится в каком-то теге. Это может быть тег блока <div>, тег таблицы <table>, абзаца <p>, секции <section> и так далее.

Мы можем задать отступ для тега в котором находится текст при помощи CSS свойства margin.

Делается это так:

<div style=”margin-left:20px;”> Текст блока HTML </div>

Здесь мы воспользовались атрибутом style и в нём указали нужное CSS свойство, задав тексту отступ слева 20px. Так же мы можем задать для нашего блока или другого тега класс и потом в отдельном CSS файле дописать для него стили.

HTML:

<div> Текст блока </div>

CSS:

.

При помощи этого свойства мы можем задать разные отступы тексту в HTML:

• margin-left — расстояние слева
• margin-right — расстояние справа
• margin-top — расстояние сверху
• margin-bottom — расстояние снизу

Так же можно одновременно в одной строке задать одинаковые или разные отступы со всех сторон:

• margin: 10px; — делаем отступ текста 10px со всех сторон
• margin: 15px 30px; — задаём отступ срерху и снизу по 15px, а справа и слева по 30px
• margin: 15px 25px 35px 45px; — отступ сверху 15px, слева – 25px, снизу – 30px, справа – 45px

Вместо пикселей вы так же можете задавать %, em, rem и другие единицы.

Обратите внимание, если вы задаёте верхний или нижний отступ для тега <a>, <span>, <b> — то, скорее всего, он не сработает. Это связано с тем что верхний и нижний

Отступ текста в HTML при помощи padding

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

<div style=”paddint-top:20px;”> Текст блока </div>

Так же можно присвоить класс в HTML коде или воспользоваться уже существующим и дописать это свойство ему:

CSS:

. text-block { padding: 20px 10px 15px 20px; }

С его помощью так же можно задать разные отступы текста в HTML:

• padding-left — слева
• padding-right — справа
• padding-top — сверху
• padding-bottom — расстояние снизу
• padding: 25px; — отступ со всех сторон.

Отступ текста html при помощи неразрывного пробела

Сразу скажу что я этот способ не люблю и не рекомендую, но иногда он может понадобится. Суть его заключается в том что в HTML есть специальный тег, который позволяет добавлять неразрывный пробел  

• Если вы поставите этот тег в тексте между слов или вначале строки то он создаст отступ равный по ширине 1 пробелу. Поставив несколько   вы можете увеличить расстояние между словами.
• Если поставить   между строк то он создаст вертикальный отступ равный по высоте одной строке. Дописав несколько   (каждый с новой строки) можно увеличить это расстояние.

HTML:

<p>Задаём &nbsp; в HTML</p>

Отступ текста в HTML при помощи text-indent

Если вам нужно задать отступ в HTML не для всего текста на странице, а лишь только для первой строчки одного или нескольких абзацев, то это можно сделать при помощи свойства text-indent

HTML:

<div> Здесь текст HTML блока</div>

Что делать если отступ не появляются?

Бывают ситуации, когда вы задаёте отступ текста HTML одним из предложенных способов, а он не применяется.
Причин здесь может быть несколько. Наиболее распространённые описаны в этой статье: «Почему не работают CSS-стили?»

Успехов вам в оформлении ваших сайтов и не только!

С уважением Юлия Гусарь

Красная строка.Оформляем отступ в HTML

При оформлении тех или иных текстов или даже таблиц веб-мастерам приходится сталкиваться с такой проблемой, как оформление красных строк, отступов в тексте. Казалось бы, все довольно просто — скопировать текст в нужное поле, и отступы будут оформлены автоматически. Но, к сожалению, не все так просто. Поэтому давайте разберемся, как правильно отформатировать текст, чтобы он смотрелся красиво и эффектно, и узнаем, как можно оформить отступ в HTML.

Способ первый

Начнем с наиболее простого, но в тоже время трудоемкого оформления отступов. Для решения данной проблемы используем код пробела — &nbsp;. Использовав его в начале абзаца несколько раз, вы получите нужный вам отступ.

Преимущества данного способа в том, что данный код читается любым браузером. Недостаток один — придется долго и нудно вставлять пробелы в выбранный вами текст. Такой способ подходит тем, кто только начинает свое знакомство с HTML. Отступы в таблице также можно сделать таким способом.

Способ второй

Второй способ — оформить отступ с помощью парного тэга <blockquote. Для этого нужно заключить текст, который вам нужно отформатировать, между открывающим и закрывающим тэгом.

Легче, чем в первом случае. Но вот беда, данный тэг делает отступ только на 40 пикселей, кроме того, при его использовании отступ задается не только слева, но и справа, сверху и даже снизу. Для текста не всегда красиво, для таблицы такой способ сделать отступ в HTML будет намного эффективнее.

Если хотите красиво выделить блок информации — данный тэг подойдет, если же нет — советуем воспользоваться первым способом или же посмотреть оставшиеся два.

Способ третий

Подставляем слово, буквы которого имеют одинаковый цвет с фоном, то есть в начале каждого абзаца вставляем слово-невидимку. Таким образом легко сделать отступ. HTML позволяет написать один раз специальный код и вставлять его в начале каждого абзаца.

Да, решение неплохое, но что, если ваш сайт имеет фоновый рисунок или картинку? Такой способ тут не подойдет. Да и к тому же при выделении данное слово будет видно. А еще вспомним о том, что данный код будет доступен всем пользователям Интернета. В таком случае, просмотрев исходный код вашей страницы, пользователи могут остаться в недоумении. Поэтому все же советуем использовать специальные тэги для оформления отступов. Также отметим, что такой вариант оформления не совсем подойдет для таблиц, хотя и может быть использован для форматирования текста.

Способ четвертый

И, наконец, последний способов сделать отступ текста. В HTML это можно осуществить с помощью двух простых тэгов. И наиболее простой способ сделать абзац — использовать связку из двух тэгов — < br > < dd >.

Первый тэг переносит текст на новую строку, формируя абзац. Второй же служит табулятором, то есть выставляет красную строку. Как видите, все довольно просто и понятно. К тому же такая запись будет понятна большинству пользователей, заглянувших на ваш сайт и заинтересовавшихся его кодом.

Использовать данное сочетание легко, хотя и его придется вставлять в начало каждого абзаца вручную. Но что поделать, далеко не все редакторы обладают способностью красиво и правильно оформлять текст.

Нужен ли тэг абзаца?

Напоследок поговорим немного о тэге < p >. Обычно он употребляется для того, чтобы определить в тексте начало нового абзаца. Правда, при использовании данного тэга не сохраняется красная строка в абзаце, но зато появляется отступ между абзацами.

В большинстве европейских стран данное оформление является общепринятым, но устраивает ли оно нас? Все мы привыкли к наличию красных строк и довольно часто задаемся вопросом о том, как оформить отступ в HTML, к тому же не всегда удобно читать текст, отформатированный таким образом.

Если вы хотите сделать текст более привычным и легким для восприятия, советуем отказаться от тэга < p >, и заменить его на связку < br > < dd >. Поверьте, это будет намного красивее и изящнее, чем наличие пустых строк между абзацами. Да и так вы сможете сэкономить место на экране.

Выводы

Итак, мы с вами научились оформлять отступы. Как оказалось, это не так сложно. Главное – знать несколько полезных тэгов и кодов, а также иметь запас терпения и свободное время для того, чтобы расставить их.

Сделать отступ в HTML можно несколькими способами. Мы с вами разобрали каждый из них, выделили их преимущества и недостатки. Также поговорили о том, что тэг < p > далеко не всегда так полезен, как нам бы хотелось.

Использование отступов

Вы можете использовать параграфы с отступом во всех выходных форматах Help & Manual — программа будет конвертировать их в устойчивые структуры HTML, когда Вы компилируете в HTML-основанные форматы. Однако, Вы должны избегать использования табуляторов и пробелов самостоятельно для создания эффектов выравнивания, потому что они не будут работать в HTML-основанных выводах. Вы должны всегда использовать функции выравнивания параграфа, описанные ниже.

Больше базовой информации см. Табуляция, отступы и HTML в секции Справочной информации.

Как создать параграф с отступом:

·	Выберите инструмент (Увеличить отступ) в Инструментальной панели. Вы можете уменьшить отступ выбором инструмента .

ИЛИ:

ИЛИ:

Как создать параграф с выступом:

Вы можете также использовать выступы в HTML-основанном выводе, и Вы можете использовать единственный табулятор в вашем выступе. Этот единственный табулятор будет преобразован в структуру таблицы в HTML.

Это - единственное место, где Вы должны использовать табулятор для HTML-основанного вывода. Кроме того, использование больше чем одного табулятора и комбинация пробелов с табуляцией приведет к ошибкам.

ИЛИ:

См. Табуляция, отступы и HTML в секции Справочной информации для получения дополнительной информации о выступах, и как они преобразуются в HTML-основанном выводе.

Выступы со «слишком длинным» текстом слева:

Часто Вы будете хотеть использовать выступы, чтобы создать параграфы с некоторым текстом слева по отношению к основной части текста справа, как этот пример:

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

Проблема здесь состоит в том, что иногда текст слева является слишком длинным, и не соответствует пространству, доступному между левым полем и основной частью параграфа, как это:

Это показывает параграф со
слишком длинным текстом в редакторе Help & Manual.

Однако, ничего страшного, если только Вы выводите в HTML-основанные форматы (Справка HTML, HTML на основе броузера, eBook и Справка Visual Studio). Help & Manual автоматически преобразовывает параграф с выступом в таблицу, и текст слева потом перенесется правильно, как это:

Это показывает вывод в Справку HTML
или Броузерную справку.

Не используйте эту уловку для формата PDF, печатных руководств или Word RTF!

Вы не можете использовать эту уловку, если Вы также выводите в формат PDF, печатное руководство или Word RTF. Это работает только в HTML-основанном выводе!

См. также:

Табуляция, отступы и HTML

Отступы css. Управление отступами в html на css Отступы в html css

Веб-ресурс оценивается пользователями по его внешней привлекательности. Поэтому даже информационно полезный текст может быть не прочитан из-за того, что он некачественно оформлен. Вывод — нужно тщательно и внимательно подходить не только к смысловому содержанию страниц сайта, но и к его визуальному представлению. Появление технологии CSS расширило возможности создания привлекательных статей. Одно из свойств, предназначенных для облегчения восприятия написанного — отступ текста CSS.

Поля и отступы: в чём разница?

Прежде чем начинать форматировать текст, следует разобраться, что такое поля и отступы. Несмотря на то что эти элементы разметки в ряде случаев выглядят для пользователя одинаково, между ними существуют принципиальные различия:

• поле задаётся свойством padding , отступ — margin ;
• поле определяется промежутком между содержимым и границей блока, отступ — между границами соседних блоков;
• поля могут как учитываться в размерах элемента (ширине и высоте), так и нет.

Свойство margin

Итак, чтобы задать горизонтальный или вертикальный отступ текста CSS, используют конструкцию margin . Данное свойство применяется к тегу задающего абзац документа. В самом простом случае оно записывается как:

margin: 12px.

Такая строчка означает, что вокруг блока текста (или любого другого блока) со всех сторон будет сделан отступ в 12 пикселей. Чтобы увеличить промежуток, например, в три раза, достаточно записать:

margin: 36px.

Но что делать, если интервал между блоками должен быть разный с каждой стороны? Разработчики веб-страниц используют несколько форм записи:

1. margin: 11px 22px.
2. margin: 11px 22px 33px.
3. margin: 11px 22px 33px 44px.

В первом примере от нижней и верхней границ блока будут сделаны отступы по 11 пикселей, по бокам блока — по 22 пикселя. Согласно второй форме записи, между верхним краем блока и контентом будет 11 пикселей, между нижним — 33 пикселя, по бокам — по 22 пикселя. В третьем случае отступ будет иметь значение 11 пикселей сверху, 22 пикселя справа, 33 пикселя снизу и 44 пикселя слева.

Также доступна возможность записи расстояния до границы блока только с одной стороны: margin-top, margin-bottom, margin-left, margin-right . Переведя названия свойств на русский язык, несложно догадаться об их назначении. Например, следующая запись говорит о том, что отступ справа будет равен 22 пикселя:

margin-right: 22рх.

Для остальных сторон расстояния вокруг блока принимаются равными значению элемента-родителя.

Свойство margin имеет особенность, которую должен помнить разработчик, когда использует отступ текста CSS по вертикали. Интервалы соседних элементов не суммируются, а налагаются друг на друга. Например, пусть один из блоков имеет margin-bottom: 15px , а примыкающий к нему снизу блок margin-top: 35px . Школьная арифметика и здравый смысл подсказывают, что общий отступ между ними будет 50 пикселей. На практике это не так. Блок с большим значением свойства margin «поглотит» своего соседа. В итоге интервал между элементами будет 35 пикселей.

«Красная» строка

Оформляя документ в текстовом редакторе, пользователи предпочитают задавать каждый новый абзац с помощью «красной» строки. С помощью CSS отступ текста слева несложно сделать — используется конструкция text-indent . Записывается она так:

text-indent: 11px.

То есть первая строка абзаца будет сдвинута относительного левого края на 11 пикселей. Чтобы текст на веб-странице больше походил на документ в редакторе, следует дополнительно установить то есть записать:

text-indent: 11px;

text-align: justify.

Помимо пикселей, при описании разметки допускается использование других единиц — дюймов, пунктов, процентов. Пусть блок имеет отступ текста CSS, равный 10%. При ширине блока, равной 500 пикселям, красная строка будет составлять 50 пикселей (10% от 500).

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

text-indent: inherit.

Удивительно, но может принимать и отрицательные значения! В этом случае формируются так называемые выступы, то есть основной текст остаётся на месте, а первая строка смещается влево на 22 пикселя:

text-indent: -22px.

Чтобы буквы не перешли за левую границу браузера, дополнительно к text-indent нужно использовать конструкцию для задания поля:

padding-left: 22px.

Основные свойства CSS для рассмотрены. А закрепить их поможет практика. Вот несколько заключительных советов, как применять изученный материал при разработке веб-сайтов:

• красная строка и отступ текста — разные понятия, и для их указания используются разные свойства;
• для вертикальных отступов правила математики не действуют — интервалы накладываются, «побеждает» элемент с большим значением;
• отрицательный абзацный отступ используют, чтобы указать первую строку абзаца с помощью изображения.

С появлением свойств управления отступами на css у web разработчиков появились огромные возможности по управлению интерфейсом и дизайном страниц сайтов. До этого отступами управляли при помощи таблиц, что являлось значительно более сложным и объемным.

Рассмотрим основные свойства управления отсутпами.

Управление внешними отсупами в HTML на CSS при помощи свойства margin

Свойство css margin позволяет управлять именно внешними отступами . Допустим имеется изображение, для которого нужно указать внешние отсупы: 30 пикселей сверху, 20 слева, 10 справа и 5 снизу.

Для задания отсупа сверху мы пропишем: margin-top: 30px

Для задания отступа слева: margin-left: 30px

Отступ справа: margin-right: 10px

И снизу: margin-bottom: 5px

Можно все объединить, прописав следующее: margin: 30px 10px 5px 20px;

Например зададим эти отступы для изображения. Получаем следующий html код:

На видно как изображение сместилось относительно родительского элемента.

Если же прописать margin: 30px, то отступы css будут одинаковые со всех четырех сторон и будут равны 30 пикселям.

Есть варианты указания двух и трех значений в спецификации: margin:10px 20px;. Данный параметр сделает так, что появятся внешние отступы на css сверху и снизу 10px, слева и справа 20px;

Часто для начинающих верстальщиков не всегда получается сразу запомнить все возможные комбинации, поэтому на начальных этапах можно использовать параметры: margin-top, margin-right, margin-left и margin-bottom. Top — вверх, right-право, left-лево, bottom-снизу.

Задача

Убрать отступы вокруг маркированного или нумерованного списка.

Решение

Используйте стилевое свойство margin и padding с нулевым значением для селектора UL или OL , в зависимости от типа списка, как показано в примере 1.

Пример 1. Отступы в списке

HTML5 CSS 2.1 IE Cr Op Sa Fx

• Чебурашка
• Крокодил Гена
• Шапокляк

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

Рис. 1. Список без вертикальных и горизонтальных отступов

Обратите внимание, что исчезают маркеры списка, которые оказываются за левым краем веб-страницы. Чтобы убрать только верхний и нижний отступ, не сдвигая при этом список влево, используйте свойства margin-top и margin-bottom (пример 2).

Пример 2. Отступы в списке

HTML5 CSS 2.1 IE Cr Op Sa Fx

• Чебурашка
• Крокодил Гена
• Шапокляк

Блочная верстка частенько используется при создании сайта или блога. Как следствие этого — часто требуется делать отступы у блоков. По этой причине о том, как сделать отступы в CSS подробно описано в данном уроке. Для браузера каждый тег является контейнером, у которого есть содержимое, внутренний отступ, внешние поля, а также рамка. В данном уроке мы научимся делать внутренние и внешние отступы, рассмотрим основные их параметры.

На рисунке ниже наглядно представлены параметры отступов блоков:

Как видно, отступы можно делать в четырех направлениях: верхний отступ (top), нижний отступ (bottom), левый отступ (left) и правый отступ (right). В качестве единиц измерения могут быть пиксели, проценты и другие единицы CSS — подробнее о них . В уроке используются пиксели.

Внутренние отступы блоков

За внутренние отступы в CSS отвечает свойство padding . Итак, давайте рассмотрим пример задания внутренних отступов у блока:

padding-top: 5px; /*верхний внутренний отступ*/ padding-left: 8px; /*левый внутренний отступ*/ padding-right: 8px; /*правый внутренний отступ*/ padding-bottom: 5px; /*нижний внутренний отступ*/

В данном примере внутренние отступы задаются отдельно для каждой стороны блока. Кроме этого, существует несколько способов задания отступов в CSS:

margin: 5px 8px 5px 8px; /*верхний, правый, нижний, левый внешние отступы*/ margin: 5px 8px 5px; /*описывает верхний, левый и правый, нижний отступы*/ margin: 5px 8px; /*описывает верхний и нижний, правый и левый отступы*/ margin: 7px; /*описывает все внутренние отступы по 7px*/

Запомнить проще первый и последний способы. В первом случае отступы ставятся по часовой стрелке (верхний, правый, нижний, левый) — величину отступа мы можем указать любую, в последнем случае отступы со всех сторон будут одинаковые.

Внешние отступы блоков

За внешние отступы в CSS отвечает свойство margin . Примеры внешних отступов в CSS:

margin-top: 5px; /*верхний внешний отступ*/ margin-left: 10px; /*левый внешний отступ*/ margin-right: 10px; /*правый внешний отступ*/ margin-bottom: 5px; /*нижний внешний отступ*/

padding: 5px 10px 5px 10px; /*верхний, правый, нижний, левый внешние отступы*/ padding: 5px 10px 5px; /*описывает верхний, левый и правый, нижний отступы*/ padding: 5px 10px; /*описывает верхний и нижний, правый и левый отступы*/ padding: 7px; /*описывает все внешние отступы по 7px*/

Таким образом, как сделать отступы в CSS — вопрос не сложный, но весьма актуальный. Чтобы лучше усвоить описанную выше информацию следует запомнить, что существует два свойства: padding — внутренние отступы и margin — внешние отступы. Также, как вы уже знаете, способов задания отступов существует несколько, можно их использовать.

Свойство определяет, сколько горизонтальный текст пространство следует перенести перед началом первой строки текстового элемента. Интервал вычисляется из начального от края элемента и контейнера для уровня блока.

Так как большая часть содержимого веб страницы представлена в виде текста, способность стилизовать этот текст как привлекательный, так и эффективный, это важный навык, который может стать веб дизайнером. Для создание отступа описание и абзаца наиболее часто используемым и рекомендуемым методом будет использование CSS. Здесь будут вам предоставлены различные примеры того, как CSS можно использовать для текста и элемента отступа.

Задать внешний отступ сверху на CSS

Чтоб создать верхние отступы используется, то безусловно без CSS свойств не обойтись, потому нам нужно margin-top, это значение что можно по-разному задавать, как в px и стандартно на пикселях, em, % и так далее, что все происходит в CSS стилистике в единицах измерение.

Пример использования:

Margin-block{
margin-top:50px;
}

Что можно посмотреть на изображение:

Также можно задействовать, чтоб выронить блоки, то здесь можете задействовать свойство под названием margin-left также margin-right и margin-bottom . Где просто указываем свойство margin, где под него есть возможность изначально задать 4 параметра, здесь рассмотрим по часовой стрелке для понятие, где начнем с верхней стороны с продолжением под каждую из сторон.

margin: 20px 50px 30px 50px;

Также есть внутренний отступ сверху на CSS

Бывает такое, что нужно выровнять элемент контента по вертикали, это относительно родительского блока, здесь есть возможность задействовать уже другие свойства, как padding-top, что делает, а точнее по умолчанию задает внутренний отступ по вверх. Если говорить про аналогичные свойства, что также можно прописать и задать по аналогу, то здесь идет margin в px, em, % и других единицах.

Пример:

Padding-block{
padding-top: 47px;
}

Теперь можно рассмотреть аналог свойству margin и padding , который задействован под задание отступов с других сторон элемента блока, но уже идет по отдельности: padding-left , padding-right , padding-bottom . Где сразу можно задать то расстояние, который вам нужно, только уже для всех сторон, и все будет одновременно.

padding: 10px 20px 40px 50px;

Здесь изначально можно задать значение как и для margin начиная как понимаете сверху, а вот далее все идет по часовой стрелке, это справа, снизу, слева, и так далее.

Теперь в зависимости от разной ситуации, у вас есть возможность сделать отступы сверху на стилях CSS, где задействуем свойства margin и padding , что есть возможность выставить необходимые элементы на странице своего интернет ресурса, так как вы задумали и вам нужно сделать.

Не удается найти страницу | Autodesk Knowledge Network

(* {{l10n_strings.REQUIRED_FIELD}})

{{l10n_strings.CREATE_NEW_COLLECTION}}*

{{l10n_strings.ADD_COLLECTION_DESCRIPTION}}

 Вот текст без отступа 
 Вот текст с отступом 3em 
 Вот текст с отступом 15 пикселей 
 Вот текст с отступом 10% 
 
 

  



  
  
  <стиль>
    тело {
      цвет фона: # FFDA45;
      маржа: 15 пикселей;
      семейство шрифтов: без засечек;
    }
    #container {
      маржа: 0 авто;
      максимальная ширина: 500 пикселей;
    }
    #container p {
      border-top: solid 4px # 846A00;
      маржа: 0;
      padding-top: 15 пикселей;
      размер шрифта: 1.4em;
      font-weight: 100;
      высота строки: 1.6em;
    }
    #container h2 span {
      цвет: # CC0000;
    }
  



  

     
 
 #  Действительно связали комнату вместе  
    
 Etiam sit amet dapibus ex. Morbi augue massa, pretium sed semper et, tristique tempus velit. Proin tellus sapien, pulvinar et lacus id, sollicitudin facilisis ante. Nullam varius justo a nibh pulvinar, in malesuada turpis vestibulum.Donec hendrerit porttitor rhoncus. 
  


  

  #container h2 {
  текстовый отступ: -26px;
  отступ слева: 26 пикселей;
}  

  #container h2 {
  текстовый отступ: -26px;
  отступ слева: 26 пикселей;
}  

  п {
    text-indent: 4rem;
}
п {
    отступ текста: 20%;
}
п {
    текстовый отступ: 100 пикселей;
}
  

  п {
  text-indent: -2rem;
}
  

 clang-format -style = llvm -dump-config> .clang-format