Html знак табуляции: Табуляция в HTML: 4 способа сделать отступ

Форматирование HTML | Уроки | WebReference

Существует разница между тем, что написано в вашем коде HTML и что отображается в браузере.

Как мы уже видели, теги HTML, такие как <р>, только читаются браузером (чтобы знать, какой тип содержимого написан), но не отображаются в нём.

Мы также видели, как можно писать комментарии в коде HTML, чтобы помочь человеку с чтением кода, без необходимости отображать эти комментарии в браузере.

Другим видом написанного кода, который игнорируется браузером, является пробел, он включает в себя:

• переносы строк;
• пустые строки;
• табуляция (или отступы).

Переносы строк

Переносы строк и пустые строки (которые представляют собой последовательность переносов строк) в коде HTML игнорируются браузером. Они составляют лишь единое пространство.

<blockquote>
Первоначальная идея веба была в том, что он должен быть совместным
пространством,
где вы можете общаться путём обмена информацией.
</blockquote>

Чтобы реально вставить перенос строки вам нужно использовать элемент <br>:

<p>В лучшем случае, жизнь совершенно<br>непредсказуема</p>

Табуляция

Табуляция — это специальный символ, полученный с помощью клавиши Tab. Она обычно перемещает курсор на следующую позицию табуляции, но иногда превращается в два пробела.

Во всяком случае, как и обычный пробел, табуляция невидима. Она также игнорируется браузером:

<p>
  Давайте толкнём 		этот текст
  табуляцией.
</p>

Если вы хотите добавить пространство перед словом, вам придётся использовать CSS.

Если вы хотите закрыть элемент HTML, то должны сперва закрыть все его дочерние элементы.

Форматирование в виде дерева

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

<article><p>Данный код написан в <strong>одну</strong> строку.</p></article>

Из-за того, что может быть сложно следить за порядком, в котором были открыты элементы HTML, рекомендуется писать HTML в виде дерева:

<article>
  <p>
    Данный код написан в 
    <strong>несколько</strong>
    строк, но тем не менее, будет 
    отображаться как
    <em>одна</em>
    строка.
  </p>
</article>

Форматирование в виде дерева позволяет

визуально воспроизвести уровень вложенности вашего кода HTML. Это позволяет легко увидеть, что:

• <article> является предком;
• <p> — родитель для <strong> и <em>;
• <strong> и <em> — это братские элементы.

Пишите HTML для себя, чтобы его читать

Табуляция, пустые строки, набор пробелов и переносы строк опускаются компьютером и все они превращаются в один пробел.

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

Нет конкретных правил, касающихся форматирования HTML, но есть неявные

соглашения, в частности:

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

Перейти к заданиям

Автор: Джереми Томас

Последнее изменение: 22. 03.2016

Табуляторы и отступы

Обзор диалогового окна «Табуляторы»

Табуляторы помещают текст в определенную горизонтальную позицию внутри фрейма. Установка табуляторов по умолчанию зависит от единиц измерения горизонтальной линейки, заданных в диалоговом окне «Единицы измерения и приращения».

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

Табуляторы устанавливаются при помощи диалогового окна «Табуляторы».

Диалоговое окно «Табуляторы»

A. Кнопки выравнивания табуляторов B. Позиция табулятора C. Поле «Отточие» D. Поле «Выровнять по» E. Линейка табулятора F. Привязка над фреймом 

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

Вертикальные табуляторы

Открытие диалогового окна «Табуляторы»

1. При помощи инструмента «Текст» щелкните любое место текстового фрейма.

2. Выберите меню «Текст» > «Табуляторы».

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

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

Выравнивание линейки диалогового окна «Табуляторы» относительно текста

1. В режиме просмотра «Макет» прокрутите документ, чтобы отобразился верхний край его содержимого.

2. Прокрутите документ, чтобы отобразился верхний край текстового фрейма.

3. Щелкните значок магнита  в диалоговом окне «Табуляторы». Диалоговое окно «Табуляторы» будет привязано к верхнему краю столбца, содержащего выделенные элементы или точку ввода.

Установка табуляторов

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

1. Чтобы увидеть действие параметров табулятора, выберите «Просмотр» > «Просмотр макета».

2. При помощи инструмента «Текст»  щелкните в абзаце точку ввода.

3. Нажмите клавишу Tab. Добавьте табуляторы в абзацы, где необходимо добавить отступы по горизонтали. Это можно сделать и после установки табуляторов.

   Выравнивание текста с помощью табуляторов

4. Чтобы отобразить диалоговое окно «Табуляторы», выберите меню «Текст» > «Табуляторы».

5. Чтобы определить абзацы, к которым будут применяться табуляторы, выберите нужные абзацы.

   Примечание.

   В режиме просмотра «Гранки» и «Материал» при добавлении табуляторов в начало абзаца создается отступ текста одной и той же величины вне зависимости от положения табулятора. В режиме просмотра «Макет» отображается фактический размер табуляции.

6. Чтобы задать способ выравнивания текста для первого табулятора, в диалоговом окне «Табуляторы» нажмите кнопку табулятора с соответствующим выравниванием (слева, по центру, справа или по десятичной точке).

7. Выполните одно из следующих действий:

   Добавление нового табулятора
   • В поле Х введите значение позиции для табулятора, затем нажмите клавишу «Ввод» или «Return». Если выбрано значение Х, то значение табулятора можно увеличивать или уменьшать на 1 пункт с помощью клавиш «Стрелка вверх» и «Стрелка вниз».

8. Для последующих табуляторов с различным выравниванием повторите шаги 3 и 4.

Первый табулятор выравнивается по правому краю, второй — по левому.

Примечание.

Чтобы вставить символ табуляции в таблицу, выберите в меню «Текст» > «Вставить специальный символ» > «Другой» > «Табулятор».

Повтор табуляторов

Команда «Повторить табулятор» создает несколько табуляторов, основываясь на расстоянии между позицией табулятора и левым отступом или предыдущим табулятором.

1. Щелкните мышью в абзаце, чтобы поместить точку ввода.

2. В палитре «Табуляция» выберите позицию табуляции на линейке.

3. В меню палитры выберите пункт «Повторить табулятор».

   Повторяющиеся табуляторы

   A. Кнопки выравнивания табуляторов B. Позиция табулятора на линейке C. Меню палитры 

Удаление, перемещение и изменение табуляторов

Удаление, перемещение и редактирование табуляторов производится при помощи диалогового окна «Табуляторы».

Перемещение позиции табулятора

1. При помощи инструмента «Текст»  щелкните в абзаце точку ввода.

2. В диалоговом окне «Табуляторы» выделите на линейке нужный табулятор.

3. Выполните одно из следующих действий:

Удаление табулятора

1. Щелкните мышью в абзаце, чтобы поместить точку ввода.

2. Выполните одно из следующих действий:

   • Перетащите табулятор за пределы линейки.

   • Выберите табулятор и выберите в меню палитры пункт «Удалить табулятор».

   • Выберите в меню палитры пункт «Удалить все табуляторы» (Illustrator) или «Очистить все» (InDesign), чтобы восстановить положение табуляторов по умолчанию.

Изменение выравнивания табулятора

1. В диалоговом окне «Табуляторы» выделите на линейке нужный табулятор.

2. Щелкните кнопку выравнивания табуляторов.

   Примечание.

   Удерживая клавишу «Alt» (Windows) или «Option» (Mac OS), можно по щелчку табулятора циклически переключаться между четырьмя видами табуляторов.

Указание символов для десятичных табуляторов

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

1. В палитре «Табуляторы» создайте или выберите десятичный табулятор  на линейке табулятора.

2. В поле «Выровнять по» введите символ, по которому необходимо произвести выравнивание. Может быть введен или вставлен любой символ. Убедитесь, что указанный символ содержится в выравниваемых абзацах.

   Текст, выровненный с помощью десятичных табуляторов

Добавление отточий табуляторов

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

1. В палитре «Табуляция» выберите позицию табуляции на линейке.

2. В поле «Отточие» введите шаблон (не более восьми символов), а затем нажмите клавишу ВВОД или Return. Введенные символы повторяются по всей ширине табуляции.

3. Чтобы изменить шрифт или другой параметр форматирования отточия табулятора, выделите символ табуляции в текстовом фрейме, а затем примените к нему форматирование с помощью палитры «Символ» или меню «Текст».

Вставка табуляторов выравнивания по правому краю

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

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

• Является специальным символом и находится в тексте, а не в диалоговом окне «Табуляторы». Добавляется через контекстное меню, а не через диалоговое окно «Табуляторы». В результате этого табулятор отступа справа не может являться частью стиля абзаца.

• Отличается от значения «Отступ справа» в палитре «Абзац». Значение «Отступ справа» определяет расстояние от всего правого края абзаца до правого края текстового фрейма.

• Может использоваться с префиксом табулятора. Табулятор выравнивания по правому краю использует префикс табулятора первой позиции табулятора после правого поля или (в случае его отсутствия) последнюю позицию табулятора перед правым полем.

1. При помощи инструмента «Текст»  щелкните строку, в которую необходимо добавить табулятор выравнивания по правому краю.

2. Выберите меню «Текст» > «Вставить специальный символ» > «Другой» > «Табулятор выравнивания по правому краю».

Установка отступов

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

Отступ для первой строки абзаца позиционируется относительно отступа левого поля. Например, если левый край абзаца смещен на 1 пику, то установка отступа для первой строки абзаца в 1 пику приведет к смещению первой строки абзаца на 2 пики от левого края фрейма или врезки.

Отступы могут быть заданы при помощи палитр «Табуляторы», «Абзац» или панели «Управление». Их можно также установить при создании маркированного или нумерованного списка.

При настройке символов CJK для установки отступа для первой строки можно использовать параметр модзикуми. Однако при задании отступов в параметрах модзикуми для текста, в котором отступ первой строки был задан в палитре «Абзац», в качестве отступа текста можно указать значение суммы двух отступов.

Задание отступа с помощью диалогового окна «Табуляторы»

1. Выберите инструмент «Текст»  и щелкните абзац, для которого нужно установить отступ.

2. Чтобы отобразить диалоговое окно «Табуляторы», выберите меню «Текст» > «Табуляторы».

3. В диалоговом окне «Табуляторы» выполните с маркерами отступа  одно из следующих действий.

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

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

Дополнительные сведения об использовании диалогового окна «Табуляторы» см. в разделе Обзор диалогового окна «Табуляторы».

Задание отступов с помощью палитры «Абзац» или панели «Управление»

1. Выберите инструмент «Текст»  и щелкните абзац, для которого нужно установить отступ.

2. Задайте значения для отступов в палитре «Абзац» на панели «Управление». Например, выполните одно из следующих действий:

   • Чтобы задать отступ размером в 1 пику для всего абзаца, введите значение 1p в поле «Отступ слева» .

   • Чтобы задать отступ размером в 1 пику только для первой строки абзаца, введите значение 1p в поле «Отступ слева для первой строки .

   • Чтобы создать висячий отступ в 1 пику, введите положительное значение (например, 1p) в поле «Отступ слева» и отрицательное (например, 1p) в поле «Отступ слева для первой строки». См. Установка отступов.

Восстановление отступов

1. Щелкните абзац, в котором отступы необходимо сбросить к нулевой отметке.

2. Выберите в меню диалогового окна «Табуляторы» пункт «Сброс отступов».

Создание висячего отступа

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

Текст без отступа (слева) и с висячим отступом (справа)

1. Выберите инструмент «Текст»  и щелкните абзац, для которого нужно установить отступ.

2. В диалоговом окне «Табуляторы» или на панели «Управление» задайте положительное значение отступа слева.

3. Чтобы задать отрицательное значение отступа для первой строки абзаца, выполните одно из следующих действий:

В большинстве случаев задается отрицательное значение, вводимое на шаге 2. Например, если отступ слева равен 2 пикам, то значение отступа для первой строки абзаца обычно будет равно –2 пикам.

Отступ справа для концевой строки абзаца

Добавить висячий отступ с правой стороны концевой строки можно с помощью параметра «Отступ справа для концевой строки». Его особенно удобно использовать для выравнивания цен в каталогах продаж по правому краю.

Отступ справа для концевой строки

1. Введите текст абзацев. В последней строке каждого абзаца установите точку ввода перед текстом, для которого будет задан отступ, а затем выберите меню «Текст» > «Вставить специальный символ» > «Другой» > «Табулятор выравнивания по правому краю».

2. Выделите абзацы.

3. Для создания в абзацах отступа справа задайте значение (например, 2p) в поле «Отступ справа» в палитре «Абзац» или на панели «Управление».

4. Для создания в абзаце отступа справа задайте в поле «Отступ справа для концевой строки» в палитре «Абзац» или на панели «Управление» отрицательное значение (например, -2p).

Произвольный отступ

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

• Произвольный отступ является частью размещения текста, как если бы он был отображаемым символом. При перекомпоновке текста отступ смещается вместе с ним.

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

• Если выбрать команду «Текст» > «Показать служебные символы», то символ произвольного отступа  становится виден на экране.

Специальный символ произвольного отступа

1. При помощи инструмента «Текст»  установите точку ввода в то место, куда необходимо установить отступ.

2. Выберите меню «Текст» > «Вставить специальный символ» > «Другой» > «Произвольный отступ».

Связанные материалы

• Создание маркированного и нумерованного списков

html — Как получить символ табуляции?

Задавать вопрос

спросил 11 лет, 1 месяц назад

Изменено 3 месяца назад

Просмотрено 421 тысяч раз

В HTML нет символа для вкладки, но я не понимаю, почему я могу скопировать и вставить его сюда: » » (Вы не можете видеть его полную ширину, но если вы нажмете, чтобы отредактировать мой вопрос , вы увидите символ.) Если я могу скопировать и вставить символ табуляции, должен быть эквивалент Unicode, который можно закодировать в html. Я знаю, что его не существует, но это тайна, которую я никогда не мог понять.

Итак, мой вопрос: почему для табуляции нет символа Юникода, даже если я могу скопировать и вставить его?

3

Конечно, есть сущность для вкладок:

(Табуляция представляет собой 9-й символ ASCII или Unicode U+0009. )

Однако, как и обычные табуляции (те, которые вы вводите в текстовом редакторе), все символы табуляции обрабатываются анализаторами HTML как пробелы и сворачиваются в один пробел, кроме тех, что внутри

 , где литеральные табуляции будут отображаться как 8 пробелов в моноширинном шрифте. 
 





            4
     
 
 Попробуйте     
 
 согласно документам: 
 

   
 Объекты символов     и     обозначают en пробел и em
  пространство соответственно, где en пробел составляет половину размера точки, а em
  пробел равен размеру пункта текущего шрифта. Для фиксированного шага
  шрифты, пользовательский агент может рассматривать пространство en как эквивалентное A
  символ пробела, а пробел em эквивалентен двум пробелам
  персонажи. 
 
 
 Ссылка на документы: https://www.w3.org/MarkUp/html3/specialchars.html 
 





            0
     
 
 поместите его между тегами  
, затем используйте эти символы  	 
 это не будет работать без тегов 
 4
 Публикую еще один вариант для большей полноты. Когда я попробовал «предварительно» ответы, они также добавили дополнительные вертикальные разрывы строк.
 Каждую вкладку можно преобразовать в последовательность неразрывных пробелов, не требующую переноса.
 "    "
 
 Не рекомендуется для многократного/длительного использования на странице. Подход div margin/padding выглядел бы намного чище.
 1
 Я использую  	  для вкладки шириной в два символа.
 1
 Табуляция — это [HT] или символ номер 9 в библиотеке Unicode.
 Как уже упоминалось, по соображениям эффективности последовательные пространства объединяются в одно пространство, которое браузер фактически отображает. Помните, что означает ML в HTML. Это язык разметки, предназначенный для управления отображением текста... не пробелами :p
 Тем не менее, вы можете притвориться, что браузер уважает вкладки, поскольку все, что делает TAB, это добавляет 4 пробела, а с помощью CSS это легко сделать. либо в строке типа ...
 
текст с отступом 
 
 Или как обычный класс в таблице стилей
 .tabbed {padding-left:4.00em;}
 
 Тогда HTML может выглядеть так:
 
обычный абзац обычный абзац обычный абзац
Текст с отступом Текст с отступом Текст с отступом
обычный абзац обычный абзац обычный абзац
 
 1
 javascript - Пространство табуляции в HTML 
 спросил  10 лет, 3 месяца назад 
 Изменено
 1 год, 6 месяцев назад
 Просмотрено
 28 тысяч раз
 Я хочу использовать табуляцию в своей строке. Я предоставляю код использования новой строки. Но я не знаю, как использовать табуляцию в строке. Может ли кто-нибудь помочь мне в этом!?
 "Внимание! Извините, оплата наличными меньше, чем платеж за этот 
 месяц.  Пожалуйста, заплатите 
 правильную сумму."
 
 JavaScript
 HTML
 extjs
  	  — это символ TAB в ASCII. Но в соответствии со спецификацией html все символы пробела будут разделены на один символ. Есть и другие пробельные символы. Как и    ,     и     Вы тоже можете попробовать их.
 Обновление 
 Кажется     дает интервал размера табуляции. См. следующие
  a b  представлено как  a b 
  a b  представлен как  a b 
  a b  представлен как  a b 
  a b  представлен как  a b 
  a	b  отображается как  a b 
 Если вы поместите свою строку в элемент HTML  
 , она может иметь символ табуляции.