Можно ли вставить символ табуляции в HTML вместо
четырехкратного ввода ?
Гораздо чище использовать CSS. Попробуй padding-left:5em
или margin-left:5em
уместно вместо этого.
em
в качестве измерения, как я, он должен расширяться с размером текста. Даже если вы этого не сделаете, это будет зависеть от характера используемого механизма масштабирования.
tab-size
свойство, которое вам действительно нужно, но его поддержка браузера была неустойчивой. Если это не удастся, лучшим выбором будет размещение на столе или, может быть, flexbox.
Это зависит от того, какой набор символов вы хотите использовать.
Там нет вкладки объекта определен в ISO-8859-1 HTML - но есть несколько пробельных символы, кроме
таких , как  
,  
, и  
.
В ASCII 	
есть вкладка.
Вот полный список объектов HTML и полезное обсуждение пробелов в Википедии .
 
и  
? Я проверил, оба они имеют одинаковое пространство ..!
 
немного больше. Я вижу разницу в Chrome 64 и FireFox 58.
Нет, Tab - это просто пробел в отношении HTML. Вместо этого я бы порекомендовал em-пробел, который такой большой (→ | | ←) ... обычно 4 пробела в ширину - и вводится как  
.
Вы могли бы даже быть в состоянии уйти с использованием Unicode символ (»
«) для него, если вам повезет.
& ЕПРС; это ответ.
Однако они не будут такими функциональными, как вы могли бы ожидать, если вы привыкли использовать горизонтальные табуляции в текстовых процессорах, таких как Word, Wordperfect, Open Office, Wordworth и т. Д. Они имеют фиксированную ширину и не могут быть настроены.
CSS дает вам гораздо больший контроль и предоставляет альтернативу, пока W3C не предоставит официальное решение.
Пример:
padding-left:4em
..или..
margin-left:4em
... как уместно
Это зависит от того, какой набор символов вы хотите использовать.
Вы можете настроить некоторые теги вкладок и использовать их аналогично тому, как вы используете теги h.
<style>
tab1 { padding-left: 4em; }
tab2 { padding-left: 8em; }
tab3 { padding-left: 12em; }
tab4 { padding-left: 16em; }
tab5 { padding-left: 20em; }
tab6 { padding-left: 24em; }
tab7 { padding-left: 28em; }
tab8 { padding-left: 32em; }
tab9 { padding-left: 36em; }
tab10 { padding-left: 40em; }
tab11 { padding-left: 44em; }
tab12 { padding-left: 48em; }
tab13 { padding-left: 52em; }
tab14 { padding-left: 56em; }
tab15 { padding-left: 60em; }
tab16 { padding-left: 64em; }
</style>
... и использовать их так:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tabulation example</title>
<style type="text/css">
dummydeclaration { padding-left: 4em; } /* Firefox ignores first declaration for some reason */
tab1 { padding-left: 4em; }
tab2 { padding-left: 8em; }
tab3 { padding-left: 12em; }
tab4 { padding-left: 16em; }
tab5 { padding-left: 20em; }
tab6 { padding-left: 24em; }
tab7 { padding-left: 28em; }
tab8 { padding-left: 32em; }
tab9 { padding-left: 36em; }
tab10 { padding-left: 40em; }
tab11 { padding-left: 44em; }
tab12 { padding-left: 48em; }
tab13 { padding-left: 52em; }
tab14 { padding-left: 56em; }
tab15 { padding-left: 60em; }
tab16 { padding-left: 64em; }
</style>
</head>
<body>
<p>Non tabulated text</p>
<p><tab1>Tabulated text</tab1></p>
<p><tab2>Tabulated text</tab2></p>
<p><tab3>Tabulated text</tab3></p>
<p><tab3>Tabulated text</tab3></p>
<p><tab2>Tabulated text</tab2></p>
<p><tab3>Tabulated text</tab3></p>
<p><tab4>Tabulated text</tab4></p>
<p><tab4>Tabulated text</tab4></p>
<p>Non tabulated text</p>
<p><tab3>Tabulated text</tab3></p>
<p><tab4>Tabulated text</tab4></p>
<p><tab4>Tabulated text</tab4></p>
<p><tab1>Tabulated text</tab1></p>
<p><tab2>Tabulated text</tab2></p>
</body>
</html>
Запустите фрагмент выше, чтобы увидеть наглядный пример.
Дополнительное обсуждение
В HTML-стандарте ISO-8859-1 не определены объекты горизонтальной табуляции, однако есть некоторые другие символы пробела, отличные от обычных  
, например;  
,  
И вышеупомянутый  
.
Также стоит упомянуть, что в ASCII и Unicode 	
есть горизонтальная табуляция.
Ниже приведены 3 различных способа, предоставляемых HTML для вставки пустого пространства.
чтобы добавить один пробел. 
чтобы добавить 2 пробела. 
чтобы добавить 4 пробела.;
к ним тоже. Нравится
Пытаться  
Это эквивалентно четырем
с.
На самом деле не существует простого способа вставить несколько пробелов внутри (или в середине) абзаца. Те, кто предлагает использовать CSS, упускают суть. Возможно, вы не всегда пытаетесь сделать отступ абзацу сбоку, но на самом деле пытаетесь поставить дополнительные пробелы в определенном месте.
По сути, в этом случае пространства становятся содержанием, а не стилем. Я не знаю, почему так много людей этого не видят. Я предполагаю жесткость, с которой они пытаются обеспечить разделение стиля и правила контента (HTML был спроектирован, чтобы делать и то, и другое с самого начала - нет ничего плохого в том, чтобы иногда определять стиль уникального элемента, используя соответствующие теги, не тратя намного больше время на создание таблиц стилей CSS и абсолютно ничего не читаемого об этом, когда он используется в модерации. Есть также что-то, что можно сказать, чтобы быть в состоянии сделать что-то быстро.) означает, что они могут рассматривать только пробельные символы как используемые только для стиль и отступ.
И когда нет изящного способа вставки пробелов без необходимости полагаться на теги  
и
теги, я бы сказал, что полученный код становится гораздо более нечитаемым, чем если бы существовал тег с соответствующим именем, который позволил бы вам быстро вставить большое количество пробелов. (или, если вы знаете, места не были израсходованы в первую очередь).
Однако, как было сказано выше, лучше всего использовать  
для вставки в правильном месте.
Лучше использовать предварительный тег. В предварительно определяет тег отформатирован текст.
<pre>
This is
preformatted text.
It preserves both spaces
and line breaks.
</pre>
узнать больше о предварительной метке по этой ссылке
<pre>
будет стандартизирован в HTML5 с таким же поведением , как в HTML4.
Я столкнулся с этим, когда искал метод, и в конечном итоге выяснил, что мне кажется, что он легко работает для того, чего хотел. Я новичок в публикации здесь, поэтому я надеюсь, что это работает ... Но есть это в CSS:
span.tab{
padding: 0 80px; /* Or desired space*/
}
Тогда в вашем HTML это будет ваша "длинная вкладка" в середине предложения, как мне нужно:
<span class="tab"></span>
Экономит от суммы
или  
что вам нужно.
Надеюсь, это поможет кому-то, ура!
span
тега, не совсем вкладку.
 
,  
,  
Или  
могут быть использованы.
W3 говорит ...
The character entities   and   denote an en space and an em space respectively, where an en space is half the point size and an em space is equal to the point size of the current font.
Подробнее читайте на W3.org для HTML3
Еще больше в Википедии
AFAIK, единственный способ использовать
Если вы можете использовать CSS, то вы можете использовать отступы или поля. См. Box box , а также для Internet Explorer, также прочитайте ошибку в Internet Box box model .
Если пробельные становится , что важно, это может быть лучше использовать предварительно отформатированный текст и <предварительно> тег.
. Вызов <pre>
тега создаст много дополнительной работы.
that important
вещь. Это факт жизни.
Если вы хотите сделать отступ в первом предложении абзаца, вы можете сделать это с помощью небольшой хитрости CSS:
p:first-letter {
margin-left: 5em;
}
:first-letter
если нужно сделать отступ только в первом предложении.
Тег <tab> никогда не попал в браузеры, несмотря на то, что он был введен в HTML3. Я всегда думал, что это очень жаль, потому что во многих обстоятельствах жизнь была бы намного проще, если бы она была нам доступна. Но вы можете легко исправить это, чтобы получить поддельный тег <tab>. Добавьте следующее в заголовок вашего HTML или еще (без тегов стиля) в ваш CSS:
<style>
tab { padding-left: 4em; }
</style>
С тех пор, когда вам понадобится вкладка в вашем документе, вставьте туда <tab>. Это не настоящая вкладка, потому что она не выравнивается по меткам табуляции, но она работает для большинства нужд, без необходимости смешиваться с неуклюжими символами или интервалами. Это действительно облегчает проверку вашего источника и позволяет легко форматировать простые вещи, когда вы не хотите переходить к сумме таблиц или других более сложных «решений».
Одним из приятных аспектов этого решения является то, что вы можете выполнить быстрый поиск / замену текстового документа, чтобы заменить все вкладки тегом <tab>.
Возможно, вы сможете определить набор истинных абсолютных позиций вкладок, а затем использовать соответствующую вкладку (например, <tab2> или <tab5> или что-то еще), где это необходимо, но я не нашел способа сделать это без отступа последующих строк ,
Вы можете использовать таблицу и применить width
атрибут к первому <td>
.
Код:
<table>
<tr>
<td width="100">Content1</td>
<td>Content2</td>
</tr>
<tr>
<td>Content3</td>
<td>Content4</td>
</tr>
</table>
Результат
Content1 Content2
Content3 Content4
Я использовал пролет с в стиле линии. Я должен был сделать это, поскольку я обрабатываю строку простого текста, и мне нужно заменить \ t на 4 пробела (appx). Я не мог использовать
как-нибудь дальше в процессе их интерпретации, чтобы в окончательной разметке были пустые пространства.
HTML:
<span style="padding: 0 40px"> </span>
Я использовал его в функции PHP, как это:
$message = preg_replace('/\t/', '<span style="padding: 0 40px"> </span>', $message);
Если вам нужна была только одна вкладка, у меня сработало следующее.
<style>
.tab {
position: absolute;
left: 10em;
}
</style>
с HTML что-то вроде:
<p><b>asdf</b> <span class="tab">99967</span></p>
<p><b>hjkl</b> <span class="tab">88868</span></p>
Вы можете добавить больше «вкладок», добавив дополнительные стили «вкладок» и изменив HTML, например:
<style>
.tab {
position: absolute;
left: 10em;
}
.tab1 {
position: absolute;
left: 20em;
}
</style>
с HTML что-то вроде:
<p><b>asdf</b> <span class="tab">99967</span><span class="tab1">hear</span></p>
<p><b>hjkl</b> <span class="tab">88868</span><span class="tab1">here</span></p>
Если вы используете CSS, я бы предложил следующее:
p:first-letter {
text-indent:1em;
}
Это будет отступ первой строки, как в традиционных публикациях.
Для этого есть простой CSS:
white-space: pre;
Он сохраняет пробелы, которые вы добавляете в HTML, а не объединяет их.
<span style="margin-left:64px"></span>
Рассмотрим это так: одна вкладка равна 64 пикселям. Так что это пространство, которое мы можем дать с помощью CSS.
мы можем использовать style = "white-space: pre" следующим образом:
<p>Text<tab style="white-space:pre"> </tab>: value</p>
<p>Text2<tab style="white-space:pre"> </tab>: value2</p>
<p>Text32<tab style="white-space:pre"> </tab>: value32</p>
пустое пространство внутри заполнено вкладками, количество вкладок зависит от текста.
это будет выглядеть так:
Text : value
Text2 : value2
Text32 : value32
Идеальный код CSS, который следует использовать, должен представлять собой сочетание свойств «display» и «min-width» ...
display: inline-block;
min-width: 10em; // ...for example, depending on the uniform width to be achieved for the items [in a list], which is a common scenario where tab is often needed.
Ну, если вам нужен длинный пробел в начале одной строки только из всего абзаца, то это может быть решением:
<span style='display:inline-block;height:1em;width:4em;'> </span>
Если это слишком много, чтобы написать или нужно во многих местах такие вкладки, то вы можете сделать это
<span class='tab'> </span>
Затем включите это в CSS:
span.tab {display:inline-block;height:1em;width:4em;}
Я использую список без маркеров, чтобы создать вид «с вкладками». (Это то, что я иногда делаю при использовании MS Word)
В файле CSS:
.tab {
margin-top: 0px;
margin-bottom: 0px;
list-style-type: none;
}
А в файле HTML используйте неупорядоченные списки:
This is normal text
<ul class="tab">
<li>This is indented text</li>
</ul>
Прелесть этого решения в том, что вы можете делать дополнительные отступы, используя вложенные списки.
Нуб здесь говорит, поэтому, если есть какие-либо ошибки, пожалуйста, прокомментируйте.
мы используем пользовательский класс пространства
<span class='space'></span>
Включите космический класс в CSS.
.space
{
margin-left:45px;
}
em
/ rem
измерения, чтобы увеличить масштаб текста в браузере.
Используя CSS и лучшие практики, динамическое создание вложенных меню с отступами будет выглядеть следующим образом:
indent
, используя сценарии на стороне сервера, такие как PHP или ASP, чтобы эти меню соответствующим образом форматировались с помощью CSS.В качестве альтернативы, переберите статическую переменную, чтобы добавить интервал, используя несколько
или<pre>
теги, или другие символы, в зависимости от ситуации.
После тестирования символа горизонтальной табуляции 	
я обнаружил, что
в описанном мною сценарии он не работает вместо нескольких . У вас могут быть разные результаты.
Это немного уродливое решение, но вы могли бы просто сделать это
var tab = ' ';
А затем используйте переменную табуляции в ваших строках.
Только тег "pre":
<pre>Name: Waleed Hasees
Age: 33y
Address: Palestine / Jein</pre>
Вы можете применить любой класс CSS к этому тегу.
Я бы просто порекомендовал:
/* In your CSS code: */
pre
{
display:inline;
}
<!-- And then, in your HTML code: -->
<pre> This text comes after four spaces.</pre>
<span> Continue the line with other element without braking </span>
<head>
<style> t {color:#??????;letter-spacing:35px;} </style>
</head>
<t>.</t>
Удостоверьтесь, что цветовой код соответствует фону, px изменяется в зависимости от желаемой длины для вкладки.
Затем добавьте свой текст после <t>. </ T>
Точка используется как пробел, и ее легче набирать, но '& # 160;' можно использовать вместо периода, чтобы сделать так, чтобы цветовое кодирование не относилось.
<head>
<style> t {letter-spacing:35px;} </style>
</head>
<t> </t>
Это полезно в основном для отображения абзацев текста, хотя может оказаться полезным в других частях скриптов.
TAB
Характер ... делать?<tab>
, а затем использовать JQuery наready
функцию , чтобы заменить или подушечку их с требуемым количеством эквивалентных пространств.white-space
(или единичный 
) не обрезает его, и вы хотите, чтобы они выстроились в линию до следующего столбца с «4 интервалами», как это может сделать вкладка (что иногда означало бы, что на самом деле это 0, 1 или 2 или 3 пробела в строке) .. как например .. скажем, в некоторых текстовых редакторах .. К сожалению, вы не можете в HTML ... без<table>
s ... а также, используя некоторое количество пробелов, чтобы попытаться взломать его ... потребуется фиксированный шрифт .... Я думаю, что большинство проблем лежат между необходимостью фиксированного шрифта и тем, что HTML любит удалять пробелы.