Содержание

Перечёркнутый текст в HTML и CSS

Первыми тегами для зачёркнутого текста были <strike> и <s>.

<strike>Перечёркнутый текст</strike>
<s>Перечёркнутый текст</s>

C приходом HTML 4 их использование стало осуждается, а в HTML 5 их вовсе запретили. В место них ввели <del>, он помечает текст как удаленный, что семантически правильнее.

<del>Перечёркнутый текст</del>

По виду они не отличается:

Изменить цвет линии

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

С помощью CSS свойства text-decoration-color, который задаёт цвет линии (не поддерживается в Internet Explorer и Edge).

<del>Перечёркнутый текст</del>
del {
	text-decoration: line-through;
	text-decoration-color: red;
}

Также можно изменить стиль линии с помощью text-decoration-style.

Значение Описание Пример
text-decoration-style: solid; Одинарная линия Текст
text-decoration-style: double; Двойная линия Текст
text-decoration-style: dotted; Точечная линия Текст
text-decoration-style: dashed; Пунктирная линия Текст
text-decoration-style: wavy; Волнистая линия Текст

Второй способ

Тегу <del> задается цвет линии, вложенному <span> цвет текста.

<del>
	<span>Текст зачёркнут красной линией</span>
</del>
del {
	color: red;
	text-decoration: line-through;
}
del span {
	color: blue;
}

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

Линия добавляется псевдо элементом :before, но у текста не должно быть переносов.

<del>Перечёркнутый текст</del>
del {
	position: relative;
	color: #000;
	text-decoration: none;
}
del:before {
	content: "";
	border-bottom: 2px solid red;
	position: absolute;
	top: 0;
	left: 0;    
	width: 100%;
	height: 50%;
}

При такой реализации, можно расположить линию за текстом.

del {
	position: relative;
	color: #000;
	text-decoration: none;
}
del:before {
	content: "";
	border-bottom: 2px solid red;
	position: absolute;
	top: 0;
	left: 0;    
	width: 100%;
	height: 50%;
	z-index: -1;
}

Как подчеркнуть текст?

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

О том, как подчеркнуть текст в разных текстовых редакторах, а также при создании html-страниц, мы и расскажем в этой статье.

Как подчеркнуть текст в ворде?

  • В версии 2003 года: нужно выделить необходимую часть текста и нажмите на значок «Подчеркнутый» на панели инструментов (на нем изображена подчеркнутая буква Ч). Или же зайдите в меню «Формат», выберите вкладку «Шрифт» и выберите нужный вид подчеркивания из списка «Подчеркивание» (можно сделать черту жирной, двойной или декоративной).
  • В версиях 2007 и 2010 года: выделите нужный отрезок в тексте и нажмите на все тот же значок «Подчеркнутый» на вкладке «Начальная страница» в группе «Шрифт», который выглядит точно так же, как и в предыдущей версии. Или же можно воспользоваться комбинацией клавиш CTRL+U (что работает также в ворде 2003 года). Стиль или цвет подчеркивания также можно изменять. Для этого нужно нажать кнопку вызова диалогового окна «Шрифт», перейти на вкладку «Шрифт» и изменять по Вашему усмотрению параметры «Подчеркивание» или «Цвет подчеркивания». 
  • Для того, чтобы сделать подчеркивание слов без подчеркивания пробелов между ними, необходимо выбрать параметр «Только слова» в поле «Подчеркивание» (как найти соответствующее поле, описано шагом выше). Там же можно выбрать и «Двойное подчеркивание».
  • Иногда необходимо подчеркнуть одни лишь проблемы (например, для создания пустых полей в документах, подготавливаемых для заполнения). Для этого нужно зажать клавиши SHIFT+дефис(-) и держать до тех пор, пока подчеркивание не наберет необходимой длины.
  • Для того, чтобы удалить лишнее подчеркивание, выделите его и нажмите сочетание клавиш CTRL+U(Г).

Какими тегами сделать в html подчеркнутый текст?

  • Если Вы знаете, как пользоваться тегами при написании html, то все, что осталось узнать, — это какой же именно тег отвечает за подчеркнутость текста? Спешим ответить на вопрос, как подчеркнуть текст html! Для того, чтобы сделать подчеркнутый текст в html, необходимо проставить тег U. Однако он устарел и не рекомендуется использовать его в версиях HTML старше 4.0.
  • Кроме этого, существует тег INS , который используется для отметки недавно добавленного текста, но он также подчеркивает текст.
  • Советуем не использовать подчеркивание одновременно с использованием шрифта синего цвета, так как подчеркнутый синий текст всегда ассоциируется с гиперссылкой.

Как сделать подчеркнутый текст в css?

  • В таком языке как css подчеркнутый текст также выделить нетрудно. Сделать это можно с помощью свойства text-decoration: underline;, помещенного в соответствующий селектор.
  • Свойство text-decoration: overline; проводит линию над текстом. 
  • А text-decoration: none; позволяет отменить выбранные настройки и возвращает текст в изначальный вид.

Как написать подчеркнутый текст в «Вконтакте»?

  • Далеко не каждый знает, что и такая функция есть в этой социальной сети, просто для этого нет кнопки на видном месте, как, например, в программе Microsoft Word. Для того, чтобы сделать подчеркнутый текст, необходимо воспользоваться комбинацией &#175.
    Посчитайте количество символов в нужном Вам тексте — точно такое же количество данной комбинации необходимо вставить под текстом.
  • Не все так страшно и плохо, как кажется! Хорошие люди уже придумали, как упростить и эту задачу. Существует сайт, где Вы можете ввести нужную фразу и получить ее уже с готовым кодом! Останется только скопировать ее и вставить в сообщение или на стену в социальной сети. Любезно предоставляем ссылку: «Подчеркнуть текст в контакте».

Как подчеркнуть текст в документе и в системе управления сайтом?

Ваш вопрос:

Как подчеркнуть текст в документе и в системе управления сайтом?

Ответ мастера:

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

Нужно запустить текстовый редактор, обладающий функциями форматирования текста – обычно это Microsoft Office Word.

В него нужно загрузить документ, где требуется выделить подчеркиванием слово, некоторую часть текста или просто букву – для вызова соответствующей опции можно использовать комбинацию клавиш ctrl + o. Затем найти в тексте искомый фрагмент и выделите его. После чего на вкладке «Основные» кликнуть по пиктограмме подчеркивания – там нарисована подчеркнутая буква «Ч». В случае, если нужен какой-либо необычный вариант подчеркивания, то необходимо щелкните по выделенному фрагменту кнопкой мыши правой и выбрать в появившемся меню пункт «Шрифт». В возникшем окне есть раскрывающийся список «Подчеркивание» – там нужно выбрать любой из 17 предложенных вариантов, а затем воспользоваться кнопкой «OK».

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

Это абзац с подчеркнутым фрагментом текста.

При использовании системы управления сайтом для редактирования страниц нужные теги автоматически вставляются, если производить редактирование в визуальном режиме (WYSIWYG режиме). В данном случае достаточно нужный фрагмент выделить и щелкнуть на панели редактора по кнопке подчеркивания.
Если слова или буквы надо подчеркнуть в сообщении, отправляемом в чат или на какой-либо форум, то нужно найти соответствующую кнопку, присутствующую на панели редактирования сообщения. Бывает, она видна исключительно в расширенной форме редактирования. Обычно на пиктограмме данной кнопки изображена подчеркнутая английская буква U – нужно щелкнуть по ней, предварительно выделив нужный текстовый фрагмент.

Фразовые теги в HTML. Размечем тексты с помощью фразовых… | by Tatiana Fokina

Как уже сказала выше, форматирование делится на визуальное и логическое. За визуальное форматирование отвечают теги визуального форматирования, за логическое — теги логического форматирования. Последние называют ещё семантическими.

К тегам визуального форматирования относятся:

  • <span>;
  • <mark>;
  • <br> и <wbr>;
  • <i>;
  • <b>;
  • <sup> и <sub>
    ;
  • <ruby>;
  • <u>;
  • <s>.

А это список тегов логического форматирования:

  • <a>;
  • <em>;
  • <strong>;
  • <cite>;
  • <code>;
  • <abbr>;
  • <dfn>;
  • <ins>;
  • <del>;
  • <q>;
  • <kbd>;
  • <samp>;
  • <var>;
  • <time>;
  • <small>;
  • <bdi> и <bdo>.

Сейчас расскажу подробнее о каждом фразовом элементе.

<span></span>

span — это контейнер для текста.

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

Со span можно использовать атрибуты class="", title="", lang="" и xml:lang="". Последний — это аналог lang в XHTML-документах.

-- HTML --
Проснувшись однажды утром после беспокойного сна, Грегор Замза обнаружил, что он у себя в постели превратился в <span>страшное насекомое</span>.-- CSS --
.scary {
color: tomato;
}

Так отобразится этот текст в браузере:

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

Это исключение — трюк с атрибутом lang="". Если в тексте есть иностранные слова, то можно оборачивать их в span с указанием другого языка. Тогда скринридер прочтёт их с правильным произношением.

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

<html lang="ru">
...
<body>
...
...
<p>Я больше не мёрджу бездумно. Как говорится, <span lang="en"> enough is enough</span>.
</p>

По умолчанию фраза внутри span не будет отличаться от остального текста.

<br> и <wbr>

br (break) переносит строку с текстом точно в том месте, где его поставили. При этом отдельный абзац не создаётся.

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

Это одиночный тег и его не нужно закрывать.

Я сидел на пустом берегу.<br>Голубая вода Онтарио отражала череду моих мыслей —<br>Мир и войну, и мёртвых, навеки ушедших во тьму, чтобы воцарился мир.

В браузере этот текст выглядит так:

wbr (word break opportunity) ставит потенциальный разрыв строки.

Если у вас слишком длинные слова или URL-адреса, то смело используйте wbr. Он подходит для случаев, когда вы не уверены в месте переноса строки.

wbr тоже одиночный тег.

Сэло не удивился, узнав, что солнечные пятна действуют на его друзей, попавших в хроно<wbr>-синкластический инфундибулум.

Закрепим: тег br переносит строку сразу. С wbr браузер сначала анализирует ширину контейнера, а уже потом ставит перенос.

Если нужно добавить дефис в местах разрыва строк, то используйте символ мягкого переноса &shy; (-):

Эйя&shy;фьядла&shy;йёкюдль

Перенос сработает, когда ширина контейнера уменьшится.

<a></a>

a — ссылка.

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

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

<a href="https://ru.wikipedia.org/wiki/%D0%9A%D0%B0%D0%BF%D0%B8%D0%B1%D0%B0%D1%80%D0%B0" target="_blank" rel="noopener noreferrer">Статья про капибар</a>

По умолчанию ссылки подчёркнуты. Оттенок синего и стиль подчёркивания зависят от браузера.

Автоматический стиль ссылки в ChromeСтиль ссылки в FirefoxСсылка в Internet Explorer 11Ссылка в Microsoft Edge

Важно, чтобы ссылки точно описывали куда они ведут. Куда вы попадёте, кликнув по «Подробнее» или «Далее»? Нужно прочитать весь текст, чтобы это понять. У пользователей скринридеров тоже возникнут проблемы.

Для тех, кому важно сохранить лаконичность ссылок, Аарон Густафсон предлагает такой выход:

<a href="/speaking-engagements/">
<b>A List of My</b>
Speaking
<b>Engagements</b>
</a>

В примере текст ссылки скрывается на уровне CSS. То есть он будет доступен для пользователей со скринридерами, но не отобразится в браузере из-за свойств display: none; или visibility: hidden;.

При клике по ссылке новая страница открывается в том же самом окне. Этим поведение можно управлять с помощью атрибута target="".

В примере ссылке задано значение _blank. Это значит, что она откроется в новом окне. В этом случае обязательно указывайте rel="noopener noreferrer". Это поможет пользователям избежать фишинговых атак.

Якорные ссылки — это ссылки внутри одного документа.

Расставить такие ссылки просто. Для слова, к которому ведёт якорь, задайте id="". Для якоря укажите путь через атрибут href="#нужный-id". Ссылку для скринридеров можно описать в атрибуте aria-label="". Закрепим на примере:

В следующем <a href="#fat-cat" aria-label="Стрижка котов">параграфе</a> я подробнее расскажу о том, как правильно стричь кошек в теле. <a>Грумминг толстых котов</a>

Тег a — важная часть логической разметки.

<em></em> и <i></i>

em (emphasis) — эмфатическое ударение.

Эмфатическое ударение — выделение слова интонацией для усиления эмоциональной выразительности.

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

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

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

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

-- Пример 1 --
Нет, это <em>он</em> выложил релиз в прод (не я).-- Пример 2 --
Да, мне <em>определённо</em> не хватает для полного счастья системной красной волчанки.-- Пример 3 --
На корабле что-то есть. <em>Нам нужно срочно эвакуироваться!</em>

Текст внутри em выделяется курсивом.

Это тег логического форматирования. Поэтому скринридеры и голосовые помощники произнесут слово «он» с особой интонацией.

i (italic) делает текст наклонным.

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

-- Пример 1 --
<i>Низкоуровневый язык программирования</i> — язык программирования, близкий к программированию непосредственно в машинных кодах используемого реального или виртуального процессора. -- Пример 2 --
Пришлось читать документацию, <i lang="fr">c'est la vie</i>.

Такой текст выделяется курсивом:

Если пишите слова на иностранном языке, то для i можно задать атрибут lang="" или xml:lang="" в XHTML-документах. Это поможет скринридерам и поисковым роботам.

Я работаю простым <i lang="en">cleaning manager</i>.

👉 Запомните, em — семантический тег, а i нет.
Об особенностях использования и различиях em и i подробно написал Факундо Коррадини в статье «You’re using <em> wrong».

<strong></strong> и <b></b>

strong — логическое ударение.

Логическое ударение — выделение слова интонацией для усиления его смысла или повышения значимости.

С помощью strong подчёркивают важность слов и предложений.

Придумайте пароль. Не 1234 или qwerty. <strong>Никому не сообщайте его!</strong>

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

b (bold) делает текст полужирным.

Тег b используют для визуального форматирования. Он не усиливает смысловой вес слов, в отличие от strong.

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

Играю в <b>The Elder Scrolls</b> со времён пылевых бурь и скальных наездников.

В браузере строчка отобразится так:

👉 strong нужен для логического форматирования, а b — для визуального.

<mark></mark>

mark — контекстное выделение текста.

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

Этот тег нужен для визуального выделения слов, которые имеют значимость для конкретного автора и в определённом контексте.

Используйте mark, когда нужно выделить какое-то важное для контекста слово, новый элемент в списке, показать текущую дату в календаре и совпадения с поисковыми запросами.

-- Пример 1 --
Изюму из Малаги. Всё думала про Испанию. Перед тем как Руди родился. Такая <mark>фосфоресценция</mark>, голубовато-зеленоватая. Для мозга очень полезно.-- Пример 2 --
Чаще обращайтесь к argumentum ad populum: «<mark>Все мои знакомые говорят</mark>, что пользуются YotaPhone и ездят на ё-мобилях».

Хотя с точки зрения семантики mark более значим, чем span, это всё равно тег визуального форматирования.

mark автоматически заданы стили background-color: yellow; и color: black;.

<s></s>

s зачёркивает текст.

Используйте s, когда нужно зачеркнуть неправильный или устаревший текст. Это может быть старая цена или неактуальное предложение. Олдскульные любители форумов и Хабра используют перечёркивание в шутках, построенных на оговорке.

2+2=<s>5</s> 4

К s применяется свойство text-decoration: line-through;.

Этот тег нужен исключительно для визуального форматирования и не учитывается поисковыми роботами и скринридерами. Чтобы последние объявляли зачёркивание, спецификация рекомендует задавать псевдоклассам ::before и ::after нужное значение свойства content.

Вместо s можно использовать CSS. Задайте элементу text-decoration: line-through;.

-- HTML --
Невероятное предложение! Коробок спичек всего за <span>1000 $</span> 999 $.-- CSS --
.crossout {
text-decoration: line-through;
}

В браузере строка отображается так:

Раньше тексты можно было зачеркнуть с помощью тега strike. Сейчас он исключён из спецификации.

👉 s не подходит, если нужно нужно определить, когда и почему был удалён текст. В этом случае используйте del.

<u></u>

u (underline) подчёркивает текст.

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

Во втором случае в тег взято название страны 德國 — Германии.

-- Случай 1 --
Мышь (кр<u>о</u>дётся).-- Случай 2 --
我來自<u>德國</u>。

К содержимому u применяется свойство text-decoration: underline;.

Этот тег отвечает за визуальное форматирование.

👉 Не используйте u, если подчёркнутый текст можно перепутать со ссылкой.

<ins></ins> и <del></del>

ins (insert) определяет добавленный в документ текст.

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

С этим тегом можно использовать атрибуты cite="" и datetime="". Вcite пишут адрес документа, который объясняет, почему текст добавлен или отредактирован.
В datetime пишут дату и время редактирования или удаления текста. Формат: год-месяц-деньTчас:минуты:секунды:часовой пояс.

<ins cite="https://ru.wikipedia.org/wiki/Falcon_Heavy" datetime="2018-03-06T01:32:03Z">Апдейт. Falcon Heavy успешно запустили.</ins>

Браузер подчеркнёт этот текст.

del (delete) определяет удалённый или потерявший актуальность текст.

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

Для del доступны те же атрибуты, что и для ins: cite="" и datetime="".

<del>Маск не запустит Falcon Heavy.</del>

В браузере текст отобразится как зачёркнутый.

Когда в документе заменяют часть содержимого, то ins используют вместе с del.

<del>Маск вряд ли запустит Falcon Heavy.</del> 
<ins cite="https://ru.wikipedia.org/wiki/Falcon_Heavy" datetime="2018-03-06T01:32:03Z">Первый испытательный запуск Falcon Heavy был успешно произведён 6 февраля 2018 года.</ins>

Этот код глазами браузера.

ins и del нужны для логического форматирования.

<q></q>

q (quote) — короткая цитата.

Используйте q, когда дословно цитируете кого-то в предложении.

Для q можно задать атрибут cite="", в котором указывается источник цитаты.

Митник прав: <q cite="https://www.livelib.ru/book/1000092721-iskusstvo-obmana">Это естественно — стремиться к абсолютной безопасности, но это желание заставляет многих людей соглашаться с ложным чувством защищённости</q>.

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

Браузеры добавят для такого текста двойные кавычки.

q {
display: inline;
}q:before {
content: open-quote;
}q:after {
content: close-quote;
}

Так браузер отобразит текст внутри q.

Отображение <q></q> в Chrome

Минутка типографики. Браузеры автоматически ставят английские двойные кавычки “…”. Их используют в английском для оформления цитат.

q {
quotes: "\201c" "\201d";
}

Русская типографика отличается от английской. Вместо английских кавычек принято использовать французские — ёлочки. Они выглядят так: «…».

Чтобы заменить стандартные кавычки, задайте для свойства quotes значение “\00ab” “\00bb”;.

q {
quotes: "\00ab" "\00bb";
}

Вуаля.

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

<cite></cite>

cite — источник цитаты.

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

Аарон Густафсон написал книгу <cite>Adaptive Web Design</cite> в 2011 году. В ней он …

Содержимое тегаcite отображается по умолчанию курсивом.

Тег cite семантический.

<abbr></abbr>

abbr (abbreviation) — аббревиатура или акроним.

Аббревиатура — слово, образованное сокращением слова или словосочетания. Примеры: ГЭС и ФСБ.

Акроним — вид аббревиатуры. Акронимы образуются начальными звуками слов, которые входят в сокращение. Примеры: W3C, A11Y и Бенилюкс.

В abbr можно можно раскрыть аббревиатуру в атрибуте title="".

<abbr title="Hypertext Markup Language">HTML</abbr> — это стандартизированный язык разметки документов в вебе.

Браузер подчеркнёт слово пунктирной линией, а при наведении появится всплывающая подсказка.

В чёрной оптимизации title использовали не по назначению. Из-за этого современные скринридеры игнорируют содержимое атрибута. Поэтому лучше раскрывать аббревиатуру при первом упоминании в самом тексте без title="".

<dfn>Hypertext Markup Language (HTML)</dfn> — это стандартизированный язык разметки документов в вебе.

Тег abbr семантический.

Помните, одна аббревиатура — один abbr. Если сокращение повторяется, то не надо его ещё раз оборачивать в этот тег.

👉 Раньше для акронимов использовали отдельный тег acronym, но он был исключён из последней версии стандарта. Так что пользуйтесь abbr и не ломайте голову над видом аббревиатуры.

<dfn></dfn>

dfn (definition) — термин.

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

В dfn можно вкладывать abbr, если это термин-аббревиатура.

<dfn><abbr>HTML</abbr></dfn> — это стандартизированный язык разметки документов в вебе.

Вместе с dfn можно использовать атрибут title="". В нём приводится определение термина.

Во втором примере в dfn вложен abbr. В этом случае аббревиатура раскрывается в атрибуте title="".

-- Пример 1 --
<dfn>Капибара</dfn> — полуводное травоядное млекопитающее из семейства водосвинковых.-- Пример 2 --
<dfn><abbr title="HyperText Markup Language">HTML</abbr></dfn> — это стандартизированный язык разметки документов в вебе.

В браузере текст станет наклонным.

dfn — тег логического форматирования.

<code></code>

code — фрагмент компьютерного кода.

Используйте code для названий элементов языков программирования или целых строк кода.

Тег <code>code</code> используется для того, чтобы показать фрагмент JS-кода.

Отображается как текст, написанный моноширинным шрифтом.

code можно использовать внутри pre, если нужно сохранить исходное форматирование. В этом случае сохранятся авторские пробелы и переносы.

<pre>
<code> ul
each val in [1, 2, 3, 4, 5]
li= val
</code>
</pre>

Получим такое форматирование:

Тег code нужен для логического форматирования.

<samp></samp>

samp (sample) — результат вывода компьютерной программы или скрипта.

Тег samp полезен, когда в тексте цитируются системные ошибки и приводятся примеры вывода данных системой.

<p>Поиск выполнен.</p>
<p>
<samp>Обработано объектов: 82.<br>
Найдено подходящих объектов: 2.
</samp>
</p>

Браузеры сделают текст моноширинным.

samp можно комбинировать с pre и code.

<pre>
<code>console.log(2.3 + 2.4)<br></code>
<samp>4.699999999999999</samp>
</pre>

Получим такой текст:

samp — тег логического форматирования.

👉 Тег tt (TeleType) выполняет похожую функцию. Не используйте его. Он устарел и исключён из стандарта.

<kbd></kbd>

kbd (keyboard) — названия клавиш.

Используйте kbd, если пишите названия клавиш и голосовые команды.

Чтобы выйти, нажмите сначала <kbd>Esc</kbd>, потом <kbd>:</kbd>, затем <kbd>q</kbd> и <kbd>Enter</kbd>.

Если нужно написать сочетание из нескольких клавиш, то вложите дочерние kbd в общий контейнер.

Скопируйте, нажав <kbd><kbd>Ctrl</kbd>+<kbd>C</kbd></kbd>.

Текст внутри kbd написан моноширинным шрифтом.

kbd может содержать тег samp или быть вложенным в него.

В kbd вкладывают samp, если нужно показать входные данные в виде текста, который отображается системой. Простой пример — это названия кнопок или пунктов и подпунктов меню в программах. В примере так указан путь к нужному пункту меню:

Найдите пункт с настройками по пути
<kbd>
<kbd><samp>File</samp></kbd> →
<kbd><samp>Settings</samp></kbd>
</kbd>

Так отобразит текст браузер.

В samp вкладывают kbd, когда нужно показать как система интерпретировала пользовательский ввод.

<p>
<samp>yarn start:theproject does not exist, did you mean:</samp>
</p>
<blockquote>
<samp>
<kbd>yarn start:the-project</kbd>
</samp>
</blockquote>

Браузер использует для текста всё тот же моноширинный шрифт:

Тег kbd нужен для логического форматирования.

<var></var>

var (variable) — переменная.

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

-- Пример 1 --
У нас есть <var>число 1</var> и <var>число 2</var>.-- Пример 2 --
Она написала <var>E</var> = <var>m</var><var>c</var><sup>2</sup>.

Браузеры выделят var курсивом.

👉 Для сложных математических формул и расчётов используйте специальный язык разметки MathML.

<small></small>

small — дополнительная информация.

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

<p><small>© 2013-2018, команда капибар</small></p>

Размер small зависит от основного размера шрифта и гарнитуры. К тегу применяется свойство font-size: smaller;, которое уменьшает шрифт на одну условную единицу.

Можно вкладывать один тег small в другой.

<p>Всем, всем, всем!
</p>
<p>
<small> У нас самая выгодная ставка по ипотеке.
<small>Предложение действительно, если ваш доход выше 100 веточек в месяц.
</small>
</small>
</p>

В этом случае размер текста будет меньше с каждым уровнем вложенности.

👉 Раньше small использовался для физического форматирования вместе с big. В последней спецификации он приобрёл семантическое значение, а big был исключён. Вместо big спецификация рекомендует использовать CSS.

<sup></sup> и <sub></sub>

sup (superscript) — надстрочный текст.

Надстрочным текстом пишут сноски или математические знаки и символы.

-- 1 пример --
В день нужно платить всего 0,666 % <sup>*</sup>-- 2 пример --
a<sup>n</sup> × a<sup>k</sup>= a<sup>n+k</sup>

Надстрочный текст расположен над базовой линией, а его высота в два раза меньше основного. К sup по умолчанию применяются свойства vertical-align: super; и font-size: smaller;.

sub (subscript) — подстрочный текст.

Подстрочный текст используется в формулах.

H<sub>2</sub>SO<sub>4</sub>

Подстрочный текст меньше в высоту и располагается ниже базовой линии. По умолчанию sub заданы свойства vertical-align: sub; и font-size: smaller;.

👉 Для сложных математических формул используйте язык разметки MathML.

<ruby></ruby>

ruby — верхняя или нижняя текстовая аннотация.

Тег связан с агатом — типографским шрифтом, размер букв в котором равен 5,5 пунктам.

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

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

<ruby>  
東 <rt>tō</rt>
京 <rt>kyō</rt>
</ruby>

Браузеры разместят один текст над другим и уменьшат надстрочный шрифт.

Токио!

Можно вкладывать один элемент ruby в другой. В этом примере указана транскрипция слов на хирагане и английском языке.

<ruby>
<ruby>東
<rt>とう</rt>南
<rt>なん</rt>
</ruby>
<rt lang=en>Southeast</rt>
</ruby>の方角

Текст в браузере отобразится так:

«Юго-восточное направление»

Тег ruby нужен для визуального форматирования.

<bdo></bdo> и <bdi></bdi>

bdo (bi-directional override) — изменение направления текста.

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

В bdo обязательно нужно указывать атрибут dir="", который задаёт направление текста:
rtl — справа налево;
ltr — слева направо.

<bdo dir="rtl">קביברה</bdo> в переводе с иврита означает «капибара».

В браузере предложение выглядит так:

bdi (bi-directional isolate) — отмена изменения направления текста.

Используйте bdi для слов, которых не должно касаться изменение направления текста. Это полезно, когда направление текста заранее не известно или есть слова из языка с другим направлением.

В примере в тексте на иврите есть слово на английском, которое нам не нужно разворачивать.

-- HTML --
<div><bdi>C++</bdi> היא שפת תכנות מרובת פרדיגמות המבוססת על שפת התכנות C‏, שפותחה בשנות ה־80.-- CSS --
.content-rtl {
direction: rtl;
}

По умолчанию для bdi задан атрибут dir="auto".

Поведение bdi можно заменить стилями. Примените к span правило unicode-bidi: isolate;. Только помните, что в этом случае браузер не сможет понять семантику, которая передаётся с помощью bdi.

👉 На сентябрь 2018 bdi поддерживается браузерами частично.

<time></time>

time — дата и время в машиночитаемом формате.

Используйте time, если в тексте указаны точные даты и время. Это может быть время отправки комментария или сообщения, расписание, архив, календарь.

Этот тег не стоит использовать, если:

Внутри time можно использовать несколько атрибутов:
datetime="" — дата и время в машиночитаемом формате;
pubdate="" — дата публикации документа;
title="" — дополнительная информация.

Время указывается внутри time или в атрибуте datetime. Во втором примере в datetime указаны число и месяц.

-- Пример 1 --
<time>2 ноября 2018 года</time>.-- Пример 2 --
Акции Tesla упали из-за поведения Илона Маска в прямом эфире в <time datetime="09-07">в эту пятницу</time>.-- Пример 3 --
Мем опубликован <time title="Понедельник, 12-50">7 часов назад</time>.

Браузер отобразит эти строки как обычный текст. Содержимое атрибута title станет всплывающей подсказкой.

Формат времени в datetime="" жёстко определён.

  • Год: 1985.
    Должен состоять из четырёх и более цифр.
  • Год и неделя: 1984-W38.
    W — номер недели.
  • Год и месяц: 1985-10.
  • Год, месяц, день: 1985-10-25.
  • Месяц и день: 10-25.
  • Часы и минуты: 1:15.
  • Часы, минуты, секунды: 1:15:39.
  • Часы, минуты, доли секунд: 1:54:39.929.
    Доли нужно округлять до трёх знаков.
  • Дата и время, разделённые «T» или пробелом: 1985-10-25T1:15. Время можно указывать с секундами и долями секунд: 1985-10-25T1:15:39.
  • Часовой пояс можно задать несколькими способами: Z или +0000, +00:00, -0800, -08:00.
    Двоеточие можно не использовать.
  • Местная дата и время: 1985-10-25T1:15Z.
  • Временной интервал: P2T4h28M3S.
    P, количество дней, T, количество часов (H), минут (M) и секунд (S). Дни и часы можно не указывать.
  • Временной интервал можно указать другим способом: 1w 2d 2h 30m 10.501s.
    w — недели, d — дни, h — часы, m — минуты, s — секунды.
    Можно писать слитно, а буквы могут быть в любом регистре.

В спецификации есть полный список форматов записи времени.

time нужен для логического форматирования и важен для поисковиков. Благодаря этому тегу ссылки в поисковой выдачи размещаются в хронологическом порядке.

Браузеры автоматически преобразовывают дату из григорианского календаря в другую систему исчисления времени. Например, японский браузер покажет <time>16:00</time> как «16:00時». «時» означает «час».

И немного информационного дизайна. В блоге UX-дизайнера Михаила Озорнина есть советы о том, как писать дату и время в интерфейсах.

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

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

Всего лишь пара фразовых тегов сделает код структурированным и предсказуемым, а страницы доступными.

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

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

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

Как убрать или сделать подчёркивание в Word

В Word можно подчеркнуть надписи, пробелы, знаки табуляции. Доступны разные виды линий: волнистые, прямые, двойные. Ещё есть разделители страниц, таблицы. Красными, зелёными и синими «волнами» программа выделяет ошибки и неправильно оформленный текст. Чтобы пользоваться данным инструментарием, разберитесь, как добавить эти линии, как изменить их атрибуты и как убрать подчёркивание в Word, если его нельзя выделить.

В редакторе Word есть несколько способов подчеркивания текста. О них мы расскажем ниже.

Простое подчёркивание

Сделать полоску под надписью можно так:

  1. Выделите фрагмент.
  2. На главной панели меню найдите букву «Ч» с чёрточкой под ней. Или нажмите Ctrl+U. Избавиться от линии можно этим же сочетанием клавиш.
  3. Чтобы печатать уже с полосками, кликните на значок «Ч», напишите что-то, и снова кликните на «Ч».

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

  1. Выделите фрагмент.
  2. Нажмите маленькую стрелочку рядом с буквой «Ч».
  3. В выпавшем списке выберите расцветку и тип: двойная линия, штриховая, толстая, волнистая.

Чтобы создать полоску, которая будет оставаться на месте, пока над ней печатают текст, нужно сделать следующее:

  1. Через раздел «Таблицы» (или Вставка — Таблицы, если у вас Word 2007) добавьте сетку.
  2. Напишите в ней пару слов.
  3. Кликните по рамке правой кнопкой мыши.
  4. «Границы и заливка».
  5. Откроются параметры. Справа будет область, в которой есть настройки видимости границ. Оставьте только нижнюю линию. Она останется на месте, даже если вы удалите текст.
  6. В этом же меню выберите тип и толщину полоски.

Можно сделать проще:

  1. После добавления сетки вверху окна появится раздел «Работа с таблицами». В нём перейдите во вкладку «Конструктор».
  2. Нажмите стрелку рядом с «Границы».
  3. Оставьте активной только опцию «Нижняя граница».

Такие полоски нужны при работе с HTML-документами. Этот приём подходит для создания полей ввода и веб-форм.

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

  1. Выделите текст.
  2. Кликните на чёрную стрелочку рядом с буквой «Ч».
  3. Пункт «Другие».
  4. В поле «Подчёркивание» выберите «Только слово».

Подчёркивание пробелов

Иногда нужно, чтобы линии находились под пробелами. Например, если вы готовите к печати документ, в котором должно быть место для ввода имени, фамилии или других данных. Для этого подойдут таблицы (взаимодействие с ними описано выше). Но есть и другие способы. Вот как сделать подчёркивание в Word без слов:

  1. Самый простой метод — нажмите Shift+[-] (дефис; без скобок). Появится линия. Это не часть оформления, а символ. К нему применимы все настройки шрифта.
  2. Чтобы изменить цвет полоски, найдите на панели меню кнопку с пиктограммой в виде буквы «А». Нажмите на стрелочку рядом с ней — откроется палитра.

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

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

  1. Нажмите клавишу «TAB». Она находится над кнопкой Caps Look. Курсор Word сдвинется.
  2. Лучше активировать отображение скрытых символов, чтобы видеть знаки табуляции, а не только набор слов. Для этого кликните на панели инструментов на иконку, похожую на букву «П» (кнопка называется «Абзац»). Или нажмите Ctrl+Shift+* (звёздочка). Табуляция в Word выглядит как стрелочка, указывающая вправо.
  3. Выделите её.
  4. Нажмите Ctrl+U.

Печатать над такими линиями тоже не получится. Но они гораздо шире пробелов — с ними будет легче выровнять строку.

Границы страниц

Если в Word ввести три звёздочки или три дефиса подряд, они могут стать горизонтальной линией (иногда для этого надо нажать Enter). Это автозамена превращает их в границу страницы. Чтобы создать определённый вид такой линии, надо сделать так:

  • Введите три знака равенства (=), чтобы создать двойную полосу.
  • Три звёздочки (*) — пунктирную.
  • Три дефиса (-) — простую.
  • Три нижних пробела (_) — жирную.

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

Вот как убрать подобную линию:

  1. Поставьте курсор Word в начало строки с полоской.
  2. Нажмите Delete.

Если этот способ не поможет, лучше сделать так:

  1. Раздел «Разметка страницы». Он находится в строке меню наверху окна.
  2. Кнопка «Границы страниц».
  3. В поле «Тип» задайте параметр «Нет». Горизонтальная линия пропадёт.

Красное, зелёное и синее подчёркивание — проверка орфографии

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

  • Красная. Неправильно написано слово, или его нет в базе данных Office. Красным цветом также обозначаются повторы.
  • Зелёная. Ошибки с грамматикой, стилистикой, пунктуацией. Лишние скобки. Несогласованный текст.
  • Синяя. Несоответствие формата.

Обычно эта функция приносит пользу. Но если вы правильно всё написали, то внезапно появившиеся волнистые линии будут раздражать и мешать. Как убрать подчёркивание в Word, если оно поставлено автоматически при проверке орфографии:

  1. Кликните правой кнопкой мыши на фрагмент, под которым появилась волнистая линия.
  2. Чтобы избавиться от неё, выберите пункт «Пропустить».
  3. Чтобы Word запомнил выбранное слово и записал его в свой словарь, нажмите «Добавить».

Если вы хотите совсем отключить проверку, откройте настройки:

  1. Перейдите в меню Сервис — Правописание (в Word 2007 для этого надо нажать на логотип Office в левом верхнем углу и в выпавшем списке выбрать «Параметры»).
  2. Уберите галочку в «Автоматически проверять орфографию» или отметьте «Скрыть ошибки только в этом документе». Автопроверка перестанет вам докучать. Но искать опечатки будет сложнее.

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

Перечеркнуть текст в excel

Где находится параметр «Зачеркивание»?

​Смотрите также​​ что вопрос очень​ зачеркнутым.​:​ — Формат —​_Boroda_​ в ячейке В1​ время перетаскивания нарисуйте​Кнопки нижняя граница​рядом с полем​ со стрелками, чтобы​ подчеркнуть.​ применить все подчеркивание​ переведена автоматически, поэтому​ Online, чтобы увидеть​Открыть в Excel​ Для удобства также​Примечание:​ косвенно связан с​JeyCi​Александр​ Шрифт — ставим​

​: Нууу, это не​ пусто. Как перечеркнуть​ линию.​и выберите стиль​Шрифт​ выделить содержимое.​

​Включения редактирования в ячейке,​ или выделенного текста​ ее текст может​ внесенные изменения. ​.​ приводим ссылку на​Мы стараемся как​

  1. ​ темой?​​: Условное Форматирование​​: Формат ячейки. Границы​

  2. ​ флажок Зачеркнутый —​ совсем так, мягко​

  3. ​ текст автоматически в​Чтобы изменить форматирование строки,​​ границы нижней палитру.​​, а затем в​

    ​На вкладке​​ дважды щелкнув ячейку​ в ячейках, применение​

  4. ​ содержать неточности и​​Если у вас нет​​Выделите ячейки с данными,​​ оригинал (на английском​​ можно оперативнее обеспечивать​​Sanja​

  5. ​или файл-пример приложите,​Ahs1960​ ОК — Найти​ говоря. Смотрите файл​

​ ячейке A1, если​ щелкните линию, чтобы​На вкладке​ диалоговом окне​Главная​ можно выбрать содержимое​ нижнюю границу для​

​ грамматические ошибки. Для​ классического приложения Excel,​ которые нужно отформатировать.​ языке) .​

support.office.com>

Подчеркивание содержимое ячейки, все ячейки или строк на листе

​ вас актуальными справочными​​: Никак. Считайте количество​ согласно​:​ все. В нижней​Mult1plexer​ в ячейку B1​ выделить его.​Вставка​подчеркивания​в группе​ ячейки. Если для​ ячейки или строки​ нас важно, чтобы​ вы можете Попробуйте​Нажмите кнопку вызова диалогового​В Excel Online недоступно​ материалами на вашем​ ячеек по тому​Юрий М​prosto_chelovek​ части окна Найти​

​: Спасибо, то что​ ведено слово «Выполнено».​Откроется панель​в группе элементов​Выберите стиль, который​Шрифт​ редактирования в ячейке​ и нарисуйте линию,​ эта статья была​ поработать. Или вы​

Подчеркивание все или выбранного содержимого ячейки

  1. ​ окна​ зачеркивание текста, которое​

    • ​ языке. Эта страница​ условию, по которому​: См. вариант.​: Доброго времени суток.​ появятся все ссылки​

    • ​ нужно.​ Спасибо за ответ.​Средства рисования​Иллюстрации​ вы хотите использовать.​выполните одно из​

      ​ выключен, можно щелкните​ чтобы подчеркнуть ячеек.​ вам полезна. Просим​ можете приобрести его,​Формат ячейки​ можно использовать, чтобы,​ переведена автоматически, поэтому​ они зачеркиваются​Sanja​Хочу задать зависимость​ на ячейки с​C1rcle​AlexM​, содержащая вкладку​нажмите кнопку​Выделите ячейку, диапазон ячеек​ указанных ниже действий.​ ячейку и выберите​Выполните одно из указанных​ вас уделить пару​

  2. ​ когда вы будете​​.​​ например, показать изменение​​ ее текст может​​БМВ​: УФ​

Подчеркивание всей ячейки или строки с помощью нижняя граница

  1. ​ первую из них,​ узнать, возможно ли​Mult1plexer​.​.​ нужно подчеркнуть. Дополнительные​ нажмите кнопку​

  2. ​ которые нужно подчеркнуть​​Чтобы подчеркнуть всего текста​​ помогла ли она​​Новости о недавних обновлениях​​  Можно также нажать​​ или завершенные задачи.​

    ​ грамматические ошибки. Для​это не совсем​

Нарисуйте линию, чтобы подчеркнуть ячеек

  1. ​: Загуглил «условное форматирование»​​ в другой.​​ прокручиваем список до​​ как-нибудь с помощью​​: Через условное форматирование​​На вкладке​​В разделе​

  2. ​ сведения читайте в​​Подчеркнутый​​ в строка формул.​

    ​ или чисел в​
  3. ​ вам, с помощью​ Excel Online можно​

    ​ сочетание клавиш CTRL+5.​Если у вас есть​ нас важно, чтобы​ так, можно UDF​ — изучаю. Спасибо!​

  4. ​Собственно так: Если​ конца, удерживаем Shift​ фильтра или какой-то​

    ​ получалось только ту​​Формат​​линии​​ статье Выбор ячеек,​​.​

  5. ​ Можно также нажать​​ ячейке или диапазон​​ кнопок внизу страницы.​​ узнать в блоге​​В диалоговом окне​ классическое приложение Excel,​

support.office.com>

Зачеркнуть текст по условию (Условное Форматирование/Conditional Formattings)

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

​Чтобы применить другой стиль​​ клавишу F2 для​

​ ячеек, Выделите ячейки​​ Для удобства также​ Microsoft Excel.​Формат ячеек​ можно открыть в​ вам полезна. Просим​

​ контролировать DisplayFormat но​​: Как посчитать количество​ меньше единицы, то​ по последней ссылке.​

​ таблице только ячейки​​ в которой и​Стили фигур​.​

​ столбцов o\n листа.​​ подчеркивания, например двойного​ изменение активной ячейки,​

excelworld.ru>

Найти ячейки с зачеркнутым текстом (Иное/Other)

​ или диапазона ячеек.​​ приводим ссылку на​Примечание:​на вкладке​ нем книгу и​ вас уделить пару​ вопрос явно не​ ячеек с зачеркнутым​

​ текст во второй​​ На листе выделятся​
​ с зачеркнутым текстом?​
​ текст​выберите нужные параметры​Перетащите линию под ячейки,​На вкладке​ подчеркивания или одинарные​ используйте клавиши со​Чтобы подчеркнуть часть содержимого​ оригинал (на английском​Мы стараемся как​Эффекты​ применить зачеркивание текста.​ секунд и сообщить,​ по данной теме.​ текстом, с помощью​ ячейке зачеркнут. Если​ все соответствующие ячейки​Pelena​

​китин​​ форматирования.​

excelworld.ru>

Как перечеркнуть клетку в excel (как делают в календарях)

​ которые нужно подчеркнуть.​​Главная​

​ или двойные подчеркивание​​ стрелками расположите точку​

​ в ячейке, дважды​​ языке) .​

«Зачеркнутый»/»Не зачеркнутый» текст в зависимости от данных в ячейке

​ можно оперативнее обеспечивать​​щелкните пункт​
​ Для этого выполните​ помогла ли она​zaservl​ формулы?​
​ значение равно (или​C1rcle​: Здравствуйте.​: а файл приложить​Mult1plexer​Чтобы нарисовать прямую туда,​в группе​ (подчеркивание, заполняющего ширины​ вставки, а затем​

​ щелкните ячейку и​​Существует несколько способов добавления​
​ вас актуальными справочными​Зачеркнутый.​

​ указанные ниже действия. ​​ вам, с помощью​

​: И на этом​​БМВ​

​ больше) единицы, то​​: огромное спасибо!!!!​Можно через Найти​

​ слабо? может и​​: Здравствуйте! В ячейке​ куда нужно, удерживайте​Шрифт​ ячейки), нажмите кнопку​

​ с помощью клавиши​​ выберите текст или​ подчеркивание к данным​ материалами на вашем​Сохраните книгу и откройте​

​Выберите команду​​ кнопок внизу страницы.​ спасибо!​: zaservl, как понять,​ текст становится не​

​Печальный мух​​Ctrl+F — Параметры​
​ получится​ A1 имеется текст,​ клавишу SHIFT во​щелкните стрелку возле​ диалогового окна​ SHIFT + клавиши​

​ числа, которые нужно​​ на лист. Можно​ языке. Эта страница​

planetaexcel.ru>

​ ее в Excel​

шпаргалка по Markdown в 2021 году

🎧 Часто пишете, редактируете или оформляете контент? Попробуйте Markdown!

Это мощный инструмент для копирайтеров, веб-разработчиков и контент-менеджеров. С его помощью вы сможете быстро и красиво оформлять текст. Синтаксис встроен в Ghost, Trello, Slack, Хабр и еще множество сервисов. Мы покажем несколько полезных трюков, которые сделают вас суперпользователем Markdown.

🎧 Слушайте аудио-версию этой статьи!


Что такое Markdown

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

Вот простой пример использования Markdown:

**Экзотическая кошка** - порода [кошек](https://ru.wikipedia.org/wiki/Кошка) с характерной *приплюснутой* мордочкой.

превращается в
Экзотическая кошка — порода кошек с характерной приплюснутой мордочкой.

Попробуйте сами! Онлайн-редактор откроется в новом окне.

Почему Markdown так хорош

Вы скажете, что Markdown бесполезен — ведь можно нажимать на кнопки форматирования в редакторе и не изучать новый язык разметки.

Да, но задумайтесь: сколько времени вы тратите на нажатие этих самых кнопок? Может, секунду или даже меньше. А если вас настигло вдохновение и мысли идут потоком? Даже за секунду легко потерять нить своего повествования.

Просто попробуйте использовать Markdown, и вы удивитесь, насколько естественен его синтаксис. Этим языком пользоваться намного проще, чем чистым HTML.

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

Мы создали для вас шпаргалку, в которой описали основные функции Маркдаун.

Базовое форматирование

Заголовки

Чтобы создать заголовок, используйте #. Одна решетка — h2, шесть решёток — h6. Вот пример:

## Заголовок 2
### Заголовок 3
#### Заголовок 4

Markdown сделает всё сам и отобразит вот так:

Заголовок 2

Заголовок 3

Заголовок 4

Текст

Для форматирования текста в абзаце используются звездочки. Слово между двух звездочек выделяется курсивом, а между двух пар звездочек — жирным шрифтом. Чтобы поставить ссылку, не нужно писать теги и запоминать, что такое атрибуты. Смотрите, как просто:

*курсив*
**жирный**
***жирный курсив***
[ссылка](https://ru.wikipedia.org/)

курсив
жирный
жирный курсив
ссылка

Картинки

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

![альт](ссылка на картинку "описание при наведении")


Как и в HTML, альтернативный текст и описание при наведении — необязательные атрибуты, и вы можете обойтись без них.

Списки

Чтобы сделать маркированный список, можно использовать *, + и -. Все эти символы Markdown превращает в элементы списка, самостоятельно добавляя теги <ul> и <li>.

+ пример списка      * чтобы сделать подпункт, нажмите tab         — подпункт подпункта * второй пункт

  • пример списка
  • чтобы сделать подпункт, нажмите tab
  • подпункт подпункта
  • второй пункт

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

1. Первый пункт
2. Второй пункт
  1. Первый пункт
  2. Второй

Цитаты

Цитаты оформляются с помощью символа >.

> Это цитата 

Это цитата
Если продолжить писать дальше, это тоже будет цитата.

Надо дважды поставить «Enter».

Исходный код

Код, как в примерах выше, выделяется обратными апострофами ` — на клавиатуре они находятся на букве Ё. На макбуках эта клавиша возле левого shift или слева от буквы Z.
Три апострофа ``` выделяют блоки кода. Можно указать язык, и Markdown подсветит функции и теги.

«`css .h3 {     margin: .5em 0 .2em;     font-size: 3.6rem;     font-weight: 700; }     «`

Что ещё

==Подсвеченный текст==

Подсвеченный текст

~~Зачеркнутый текст~~

Зачеркнутый текст
Чтобы Markdown не воспринимал символ, как форматирование, используйте обратный слэш \.
В предыдущем предложении используется два слэша \\, потому что первый съедается. Но если, например, указать путь к папке Windows, один слэш отображается корректно — C:\Users\Lenovo\Documents\php.

Продвинутые техники Markdown

Освоив простое форматирование с помощью Маркдауна, вам непременно захочется узнать, как его еще можно использовать. Что ж, продолжим.

Горизонтальная черта

С помощью --- можно заменить <hr>. Не забудьте отбить энтером, иначе предыдущий текст превратится в заголовок.


Кстати, это еще один способ для выделения заголовков. С помощью === выделяются заголовки первого уровня, а с --- — второго.

Заголовок 1
=====
Заголовок 2
-----

Ссылки

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

**Пример [один][1], пример [два][2].**

[1]: https://google.ru "Гугл" 
[2]: https://yandex.1]: Заметка в конце блока или статьи. В данном случае - в конце блока.

Заметка в конце блока или статьи. В данном случае — в конце блока. ↩︎

Как открывать ссылки в новом окне в Маркдаун

Все ссылки в стандартном редакторе Markdown открываются в этом же окне. Только HTML-разметка позволяет изменить это. Никакие другие способы не будут работать стабильно и всегда, и в этом есть некоторое неудобство. Но имея заготовленный шаблон (смотрите ниже), вы легко справитесь с этим.

Пример <a href=»https://google.ru» target=»_blank» title=»Гугл»>один, пример <a href=»https://yandex.ru» target=»_blank» title=»Яндекс»>два.

Таблицы на Markdown

Тут у Markdown перед HTML огромное преимущество. В нем делать таблицы гораздо проще:

Заголовок таблицы | Другой заголовок

Выглядит это так:

Заголовок таблицыДругой заголовокЯчейка 1Ячейка 2Ячейка 3Ячейка 4

Символом : можно выровнять столбцы:

| Влево  | По центру  | Вправо |

В таблице работает любое форматирование:

ВлевоПо центруВправопервая ячейкатекст2зачеркнутая ячейкажирная ячейкакурсивнезачеркнутая ячейкапросто ячейка

Воспринимает ли Markdown HTML

Если вы вставите в статью обычный HTML, редактор поймет, чего вы от него хотели. Например — Курсив <i>Курсив</i>. Это удобно, если нужно прописать классы или атрибуты.

Горячие клавиши для MacOC

Markdown понимает сочетания горячих клавиш и сам вставляет необходимые символы. Например:

  • Ctrl/⌘+B — жирный текст;
  • Ctrl/⌘+I — Курсив;
  • Ctrl/⌘+K — Ссылка;
  • Ctrl/⌘+H и многократное нажатие для выбора нужного заголовка.

Горячие клавиши для Windows

  • Ctrl+B — жирный текст;
  • Ctrl+I — Курсив;
  • Ctrl+K — Ссылка;
  • Ctrl+H и многократное нажатие для выбора нужного заголовка.

Редакторы Markdown

Кроме использования Маркдауна в поддерживающих его синтаксис сервисах, вы можете попробовать приложения-редакторы.

Markdown для MacOS

Для Apple существует большое количество удобных программ:

Markdown для Windows

Для «микромягких» окошек программ, к сожалению, поменьше:

Что делать дальше

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

  1. Начните писать ваш первый документ на Маркдауне с базовых вещей. Вы научитесь быстрее, чем думаете!
  2. Не забывайте использовать горячие клавиши — это очень экономит время.
  3. Используйте HTML всегда, когда вам нужно отформатировать сложные вещи. Вместе эти два инструмента создают мощный дуэт.

Не забывайте попробовать Онлайн-редактор.

🎧 Слушайте аудио-версию этой статьи!

HTML тег u


Пример

Отметьте слово с ошибкой тегом :

Это неверный текст.

Попробуй сам »

Дополнительные примеры «Попробуйте сами» ниже.


Определение и использование

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

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


Поддержка браузера

Элемент
Есть Есть Есть Есть Есть

Глобальные атрибуты

Тег также поддерживает глобальные атрибуты в HTML.


Атрибуты событий

Тег также поддерживает атрибуты событий в HTML.



Другие примеры

Пример

Используйте CSS для стилизации текста с ошибками:




. Ошибка орфографии {
текст-украшение-строка: подчеркивание;
стиль оформления текста: волнистый;
цвет оформления текста: красный;
}

Это какой-то неверный текст.


Попробуй сам »

Связанные страницы

Учебное пособие по HTML: Форматирование текста HTML

Ссылка на HTML DOM: подчеркнутый объект


Настройки CSS по умолчанию

Большинство браузеров отображают элемент со следующими значениями по умолчанию:


CSS свойство оформления текста


Пример

Установить различное оформление текста для элементов

,

и

:

h2 {
оформление текста: над чертой;
}

h3 {
оформление текста: сквозное;
}

h4 {
оформление текста: подчеркивание;
}

h5 {
оформление текста: подчеркивание над чертой;
}

Попробуй сам »

Дополнительные примеры «Попробуйте сами» ниже.


Определение и использование

Свойство text-decoration определяет украшение, добавленное к тексту, и это сокращение недвижимость по адресу:

  • текст-украшение-строка (обязательно)
  • текст-украшение-цвет
  • стиль оформления текста
Значение по умолчанию: нет текущий цвет сплошной
Унаследовано: нет
Анимируемое: нет, см. Отдельные свойства .Прочитать о animatable
Версия: CSS1, обновленный в CSS3
Синтаксис JavaScript: объект .style.textDecoration = «подчеркивание» Попытайся

Поддержка браузера

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

Объект
оформление текста 1.0 3,0 1,0 1,0 3,5


Синтаксис CSS

текст-украшение: текст-украшение-строка текст-украшение-цвет стиль оформления текста | начальный | наследование;

Стоимость недвижимости


Другие примеры

Пример

Добавьте дополнительное украшение текста:

h2 {
text-decoration: подчеркивание поверх линии красным пунктиром;
}

h3 {
оформление текста: подчеркивание поверх волнистой линии синий;
}

Попробуй сам »

Связанные страницы

Учебник

CSS: Текст CSS

Ссылка на HTML DOM: свойство textDecoration



: элемент неартикулированной аннотации (подчеркивание) — HTML: язык разметки гипертекста

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

Этот элемент раньше назывался элементом «Подчеркнутый» в старых версиях HTML, и до сих пор иногда используется неправильно. Чтобы подчеркнуть текст, вы должны вместо этого применить стиль, который включает свойство CSS text-decoration , для которого установлено значение underline .

Исходный код этого интерактивного примера хранится в репозитории GitHub. Если вы хотите внести свой вклад в проект интерактивных примеров, клонируйте https: // github.com / mdn / interactive-examples и отправьте нам запрос на перенос.

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

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

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

Варианты использования

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

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

Другие элементы, которые следует учитывать при использовании

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

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

Чтобы предоставить текстовые аннотации (в отличие от нетекстовых аннотаций, созданных с помощью ), используйте элемент .

Чтобы применить подчеркнутый внешний вид без какого-либо семантического значения, используйте значение text-decoration свойство underline .

Указывает на орфографическую ошибку

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

HTML
  

Этот абзац включает предупреждение написанное слово.

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

CSS
  u.spelling {
  оформление текста: красное волнистое подчеркивание;
}  

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

Результат

Результат должен быть знаком любому, кто использовал любой из наиболее популярных текстовых редакторов, доступных сегодня.

Избегайте

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

Несемантические подчеркивания

Чтобы подчеркнуть текст без какого-либо семантического значения, используйте элемент со свойством text-decoration , установленным на «подчеркивание» , как показано ниже.

HTML
   Сегодняшнее специальное предложение 

Куриный суп с лапшой и морковью
CSS
  .underline {
  оформление текста: подчеркивание;
}  
Результат
Представляя название книги

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

HTML
  

Класс прочитал Моби Дик в первом семестре.

Результат со стилем по умолчанию

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

  cite {
  стиль шрифта: нормальный;
  оформление текста: подчеркивание;
}  
Результат с нестандартным стилем

таблиц BCD загружаются только в браузере

HTML — полужирный, курсив и подчеркивание

Пример

Полужирный текст

Чтобы выделить полужирный текст, используйте теги или :

   Здесь полужирный текст 
  

или

   здесь полужирный текст 
  

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

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


Курсив

Чтобы выделить текст курсивом, используйте теги или :

   Текст, выделенный курсивом 
  

или

   Текст, выделенный курсивом 
  

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

Например, если вы хотите выделить действие внутри предложения, это можно сделать, выделив его курсивом с помощью : «Не могли бы вы уже отправить правку?»

Но если бы вы определяли книгу или газету, которую обычно стилистически выделяете курсивом, вы бы просто использовали : «Я был вынужден прочитать Ромео и Джульетта в старшей школе.


Подчеркнутый текст

Хотя сам элемент объявлен устаревшим в HTMl 4, он был повторно представлен с альтернативным семантическим значением в HTML 5 — для представления неартикулированной, нетекстовой аннотации. Вы можете использовать такую ​​визуализацию для обозначения текста с ошибками на странице или для обозначения собственного имени на китайском языке.

  

Этот абзац содержит некоторый неверный текст.




HTML Tag »

Раскрытие: Ваша поддержка помогает поддерживать работу сайта! Мы зарабатываем реферальный сбор за некоторые услуги, которые мы рекомендуем на этой странице.Подробнее
Элемент
Узнайте, как шрифты и веб-типографика работают в HTML: руководство для начинающих
Что делает HTML Tag ?
Элемент изначально использовался для обозначения текста, который должен быть подчеркнут. Этот элемент устарел в HTML 4.01, но в HTML5 он был переопределен для представления текста, который должен отображаться в виде неартикулированного , но стилистически отличного от окружающего текста. Например, одним из правильных способов использования элемента является определение терминов с ошибками.
Дисплей
встроенный
Использование
семантика

Пример кода

  

Вот слово, которое подчеркнуто & lt; u & gt; элемент.

Вот слово, которое подчеркнуто с помощью CSS.

Вот слова, окруженные тегами & lt; u & gt; со стилем без артикуляции, но с явным отображением .

<стиль> .underline { оформление текста: подчеркивание; } u.unarticulated { текстовое оформление: нет; цвет: # 000080; стиль шрифта: курсив; }

Вот слово , подчеркнутое элементом .

Вот слово, подчеркнутое с помощью CSS.

Вот слова, окруженные тегами с неартикулированным, но явно отрисованным стилем .

Когда использовать элемент

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

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

Итак, какое семантическое значение этот элемент передает в современном HTML? В соответствии со спецификацией HTML5, опубликованной W3C:

Элемент u представляет собой отрезок текста с неартикулированной, хотя и явно визуализированной, нетекстовой аннотацией…

Вы сожалеете, что даже спросили, не так ли? Давайте немного поясним это определение.

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

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

Давайте сложим по кусочкам. Элемент u используется для:

  • Добавить аннотацию, которая сообщает нам что-то о самом выделенном тексте, а не о содержании или сообщении текста.
  • Аннотации добавляются без артикуляции. Слова между тегами и не должны быть подчеркнуты, допустим любой метод аннотации, если…
  • Аннотация должна быть явно отображена, то есть ее легко заметить.

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

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

Как подчеркнуть текст в CSS

CSS-свойство text-decoration используется для украшения содержимого текста.Он может добавлять строки выше, ниже и сквозь текст. Это свойство CSS украшает текст несколькими видами строк. Это сокращение для text-decoration-line, text-decoration-color и text-decoration-style .

Свойство text-decoration-line используется для подчеркивания текста. Это свойство имеет три значения: надчеркнутый, подчеркнутый, или сквозной . Итак, значение подчеркивания используется для подчеркивания текста в CSS.Это значение рисует подчеркивание под встроенным текстом.

Пример

оформление текста <стиль> h2 { цвет синий; } тело { выравнивание текста: центр; } п{ размер шрифта: 25 пикселей; } # p1 { оформление текста: подчеркивание; цвет оформления текста: синий; }

Добро пожаловать в javaTpoint.com

Привет, добро пожаловать на javaTpoint.com. Этот сайт разработан для того, чтобы студенты могли легко изучать технологии, связанные с информатикой. JavaTpoint.com всегда предоставляет простые и подробные учебники по различным технологиям. Никто не совершенен в этом мире, и ничто не вечно лучше. Но мы можем попытаться стать лучше.

Проверить это сейчас

Выход

Не существует свойства CSS для применения подчеркивания только к отдельным словам в предложении или к элементу с несколькими словами.Итак, лучший способ добиться этого — заключить подчеркнутые слова в элемент диапазона, а затем применить подчеркивание к этим промежуткам.

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

Пример

В этом примере мы также используем свойство text-decoration-style , которое задает стиль для подчеркивания выделенного текста. Мы используем значение double этого свойства. Здесь есть два элемента , которые содержат текст, который необходимо подчеркнуть.

оформление текста <стиль> h2 { красный цвет; } тело { выравнивание текста: центр; } п{ размер шрифта: 25 пикселей; } охватывать { оформление текста: подчеркивание; цвет оформления текста: красный; стиль оформления текста: двойной; }

Добро пожаловать в

javaTpoint.com

Привет, добро пожаловать на javaTpoint.com. Этот сайт разработан для того, чтобы студенты могли легко изучать технологии, связанные с информатикой. На javaTpoint.com всегда есть легкие и подробные учебники по различным технологиям. Никто не совершенен в этом мире, и ничто не может быть лучшим в вечности. Но мы можем попытаться стать лучше.

Проверить это сейчас

Выход


Учебное пособие по тегам подчеркивания HTML

с примерами — POFTUT

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

Подчеркнуть текст с помощью тега

HTML предоставляет тег для подчеркивания данного текста в HTML. — это начальный тег для подчеркивания, а используется для установки конца подчеркивания.Теги подчеркивания можно без проблем использовать для различных типов текста, таких как гиперссылки, полужирный текст и т. Д. В следующем примере мы подчеркнем отдельное слово, полное предложение или гиперссылку. HTML-тег или подчеркивание поддерживается всеми основными браузерами, такими как Google Chrome, Mozilla Firefox, Microsoft Edge, Safari или Opera.

  


  

Пример подчеркивания текста HTML

Мне нравится poftut.com

Мне нравится пофтут.ru

Мне нравится poftut.com

Мне нравится poftut.com

Подчеркнутый текст с атрибутом оформления текста CSS

CSS предоставляет атрибут text-decoration для подчеркивания различных элементов HTML. Мы можем использовать атрибут text-decoration, чтобы подчеркнуть текст HTML.Атрибут стиля оформления текста может использоваться с различными тегами или элементами HTML. В следующем примере мы использовали тег , чтобы выделить текст и подчеркнуть его.

  


  

Пример подчеркивания текста HTML

Мне нравится poftut.com

Мне нравится poftut.com

Мне нравится poftut.com

Мне нравится poftut.com

Подчеркнуть текст с помощью атрибута CSS text-decoration

Установить цвет и стиль подчеркивания текста

В некоторых случаях простого подчеркивания текста HTML может быть недостаточно. Мы также можем раскрасить или изменить стиль подчеркивания. Атрибут CSS text-decoration может использоваться для стилизации и цвета подчеркивания с тегом или без него. Ниже мы предоставим цвет подчеркивания текста HTML как красный, зеленый и стиль как волнистый, пунктирный, пунктирный и двойной.

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

штриховой стиль создаст штриховую линию.

Пунктирный стиль аналогичен пунктирному, но точки будут меньше.

двойной стиль поместит два подчеркивания, где по умолчанию — одинарное подчеркивание.