Содержание

Теги html для оформления текста, зачеркнутый текст, курсив, подчеркнутый текст

Создаем свой сайт

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

Итак, для начала создаем в блокноте пустой текстовый документ. После этого меняем его расширение с txt на html. Открываем его с одновременно с помощью браузера и текстового редактора, например, того же блокнота. Я советую использовать для этих целей программу Macromedia Dreamweaver или Notepad++.

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

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

Заголовки текста разного уровня

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

<h3>Поместите здесь текст, который вы хотите сделать заголовком</h3>

Цифра 2 рядом с буквой h означает уровень заголовка. Всего уровней 6. Первый уровень – название статьи. Все остальные – заголовки разделов и подразделов.

Жирный, подчеркнутый текст, курсив

Теги <b>, <i>, <u> легко решают эту проблему
<b>Так в html можно задать жирный текст</b>
<i>Вот так задается курсив</i>
<u>Вот это будет подчеркнутый текст</u>

Если нам нужно применить к тексту одновременно несколько свойств, просто вкладываем теги один в другой.

<i><b>Жирный курсив</i></b>

Изменяем размер шрифта

Размер шрифта текста задается в html с помощью тега <font>, у которого есть атрибут «size».

<font size=”5”>Размер шрифта 5</font>

Как поменять цвет текста

Цвет текста задается тем же самым тегом с помощью атрибута «color»

<font color=”red”>Текст красного цвета</font>

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

Текст в таком виде как он был набран

У html есть довольно неприятная особенность. Если вы набрали текст, в котором есть несколько пробелов, идущих подряд , друг за другом, то браузер покажет только один пробел. В некоторых случаях необходимо отобразить текст именно в таком виде, как он был набран. Для этого используется тег <pre>

<pre>Этот текст     будет выглядеть     так как он набран</pre>

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

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

Вообще говоря в html можно задать зачеркнутый текст с помощью сразу трех разных тегов. Теги <s> и <strike> вполне корректно отображаются во всех браузерах, тем не менее, они не рекомендуются к использованию. Они даже не включены в спецификации XHTML и HTML5. Поэтому для создания зачеркнутого текста я рекомендую использовать тег <del>.

<del>Зачеркнутый текст</del>

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

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

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

Похожие записи

Создаем свой сайт

Как сделать чтобы каждая ссылка открывалась в новом окне в WordPress и с помощью HTML

Авторadmin

Мы научились средствами htm и CSS изменять цвет ссылки и убирать подчеркивание. Казалось бы, с ссылками уже все ясно, но это не так. Есть еще один небольшой нюанс, о котором необходимо упомянуть, а именно, как сделать так, чтобы она открывалась в новом окне. Зачем это нужно Почему так важно, чтобы все внешние ссылки открывались в…

Читать далее Как сделать чтобы каждая ссылка открывалась в новом окне в WordPress и с помощью HTMLПродолжить

Создаем свой сайт

Как сделать иконку для сайта

Авторadmin

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

Для этого, есть один отличный способ. Я говорю об иконках для сайтов, так называемых Favicon(фавикон). Я продемонстрирую Вам как создается favicon.ico и каким образом вставить его на Ваш сайт или блог.

Читать далее Как сделать иконку для сайтаПродолжить

Основы

Что такое CSS

Авторadmin

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

Читать далее Что такое CSSПродолжить

Создаем свой сайт

Какую тему для сайта выбрать

Авторadmin

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

Читать далее Какую тему для сайта выбратьПродолжить

Как в html сделать курсив

Главная » Разное » Как в html сделать курсив


Как сделать в css или html курсивный шрифт у текста?

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

Как писать в html курсивом?

Начну с того, что в самом html есть два тега, которые дают тексту курсивное начертание. Это em и i. Кстати, второй встроен в html-редактор движка wordpress, в котором я сейчас и пишу данную статью. Чем отличаются эти теги? На самом деле сегодня не хотелось бы громко заявлять, что они чем-то отличаются.

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

Какие есть css-свойства для курсивного текста?

Это свойство font-style и его значение italic. Еще есть значение oblique и оно превращает текст в наклонный. Есть ли какая-то разница между этими значениями? Практически никакой. Кстати, подробно об этом и других свойствах css для текста читайте в соответствующей статье, где все разложено по полочкам.

Как вывести курсивом нестандартный шрифт?

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

На этом скриншоте вы можете видеть фрагмент подключение шрифта через сервис Google Fonts. Как видно, стоит галочка возле хотя бы одного курсивного начертания. Теперь, при использовании необходимых тегов или стилевого свойства, действительно этот шрифт будет становится курсивным, а не какой-то другой.

Таким образом, мы с вами разобрали все моменты, которые есть в работе с курсивным начертанием. Больше не смею вас задерживать.

Курсив в HTML: теги em и i

Всем привет! Давайте научимся выделять текст курсивом на HTML-страничке. Для этого используются теги и . Несмотря на внешнюю неразличимость имеются различия в семантике.

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

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

Вася предпочитает просыпаться рано.

Результат выглядит так:

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

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

Назад Следующий урок

Курсив на CSS: изменение начертания шрифта

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

Курсив или наклонный шрифт?

Отображение одного и того же шрифта в курсивном начертании может различаться.

На картинке — три блока текста, набранных одним и тем же шрифтом Playfair Display. Первый имеет обычное прямое начертание, а второй и третий — курсивное. Они открыты в одном и том же браузере Google Chrome, но выглядят совершенно по-разному.

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

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

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

HTML-курсив

Для курсивного отображения текста в HTML существует два специальных тега: i (от слова italic) и em. Начертание текстового фрагмента, заключенного в любой из этих дескрипторов, будет одинаковым.

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

Свойство font-style

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

  • normal — шрифт обычного начертания;
  • italic — курсивное начертание;
  • oblique — наклонное начертание.

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

Если искомый шрифт браузером не обнаружен, то italic будет выглядеть точно так же, как и oblique.

В отличие от тега em, css-свойство font-style не придает выделенному фрагменту особой важности, оно скорее соответствует дескриптору i.

Примеры

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

.quote { font-style: italic; border-left: 5px solid purple; padding-left: 20px; }

Кроме декоративной рамки справа и отступов, для блока quote определено правило font-style со значением italic.

С его помощью устанавливается курсив в CSS.

Свойство font-style

Трепачёв Д.П. © 2012-2018 г.

Ученикам: я ухожу на каникулы с 21-го декабря по 8 января. Буду не онлайн, хотя иногда возможно буду появляться.

Свойство font-style устанавливает курсив либо наклонное написание текста.

Синтаксис

селектор { font-style: italic | oblique | normal | inherit; }

Значения

Значение Описание
italic Делает курсив.
oblique Наклонный текст. В отличие от курсива, который имитирует рукописный текст, наклонный представляет собой обычный текст, буквы которого наклонены в сторону.
normal Отменяет курсив или наклон. Обычно необходимо в случае, если вам нужно отменить курсивное начертание для определенного участка текста (к примеру, все абзацы сделаны курсивом, а данный — нет).
inherit Наследует значение родителя.

Значение по умолчанию: normal.

Примеры

Пример . Значение italic

Сейчас текст станет курсивным:

p { font-style: italic; }

Результат выполнения кода:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a dapibus magna, ac interdum nisl. Suspendisse eget fringilla nibh, eu commodo arcu. Donec lacinia tempor velit sed tincidunt. Aliquam porttitor nulla purus, vel vulputate ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehicula, ante purus lacinia dui, interdum fringilla massa eros ut dui.

Пример . Значение oblique

Сейчас текст станет наклонным (в зависимости от браузера может быть неотличим от курсивного):

p { font-style: oblique; }

Результат выполнения кода:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a dapibus magna, ac interdum nisl. Suspendisse eget fringilla nibh, eu commodo arcu. Donec lacinia tempor velit sed tincidunt. Aliquam porttitor nulla purus, vel vulputate ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehicula, ante purus lacinia dui, interdum fringilla massa eros ut dui.


Смотрите также

  • Как в word убрать линию границы
  • Как в word поставить водяной знак
  • Php как добавить в массив элемент
  • Как открыть в word формат odt
  • Php как работают сессии
  • Как удалить подложку в word 2010
  • Как word сохранить в jpeg
  • Как проверить орфографию и пунктуацию в word
  • Letter spacing в css
  • Как в word 2007 изменить основной шрифт
  • Как восстановить удаленный word документ

Теги физического форматирования HTML текста.

Курсив

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

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

Теги выделения фрагментов текста

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

Важный фрагмент текста

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

Акцентированный фрагмент

Тег используется для подсветки фрагмента текста.

Подсвеченный фрагмент

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

Текст жирным шрифтом

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

Текст курсивом

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

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

Тег используется для написания текста шрифтом меньшего размера.

Текст меньшего размера

Тег используется для создания текста нижнего индекса.

Текст нижнего индекса

Тег используется для создания текста верхнего индекса.

Текст верхнего индекса

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

Предварительно отформатированный текст

Теги устанавливающие суть содержимого

Теги указывают, что содержимое является заголовком (подзаголовком).

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

Термин

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

Короткая цитата

Тег моноширинным шрифтом.

Результат вывода компьютерной программы

Тег указывает, что содержимое является клавиатурным вводом. Браузеры обычно отображают текст внутри тега моноширинным шрифтом.

Клавиатурный ввод

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

Переменная компьютерной программы

Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

Подписаться

Html-теги для текста – это теги, которые меняют оформление заключенного в них контента.

Эта идея пришла из печатных издательств. Редакторы на полях помечали, что является заголовком, как оформить список.

Так же и теги. Они указывают, какой стиль должен быть у элемента.

Теги и элементы

Каждый тег имеет вид:

Элемент – это совокупность тега и его содержимого. Многие из них требуют закрывающего тега:

Название тега>

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

  • Блок

  • курсив

Некоторые элементы не требуют закрытия


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

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

Парадигма оформления современных сайтов

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

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

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

Валидация страницы

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

  1. Strict. Не включает теги font, и пр. Это «строгий» набор правил для верстки на HTML 4.
  2. Transitional. Используется для сайтов, которые были написаны до появления новых стандартов. Разрешены устаревшие теги.
  3. HTML. Поддержка последнего стандарта.

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

Проверить валидность сайта можно на официальном сайте W3C – организации, где создаются стандарты.

Теги форматирования текста html

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

Рассмотрим все элементы, которые позволяют оформить текстовую часть сайта.

  • — Жирное выделение.

  • — Установка цвета и шрифта по умолчанию для страницы. Не рекомендуется к использованию.
  • — Увеличивает размер шрифта на одну условную единицу. Всего их семь. Стандартный не оформленный символ имеет размер 3. Вложение тегов будет увеличить на дополнительную единицу на каждом уровне. В CSS аналогом является свойство font-size.

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

  • - Вывод символов, которые помечаются как программный код. Оформляется моноширинным текстом уменьшенного размера (все символы имеют одинаковую ширину).

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

  • — Используется для привлечения внимания к фрагменту контента. Выделяется курсивом. Аналог CSS font-style.
  • — Самый запрещенный тег для текста в современной разметке. Браузеры его еще поддерживают, так как многие встроенные редакторы используют его для указания размера и шрифта. Но при ручной верстке не рекомендуем применять такой способ форматирования. Лучше пользоваться свойствами CSS font-size и color – аналоги написания.

  • — Курсив. Не осуждается последним стандартом, но рекомендуется использовать font-style.
  • - Обозначает моноширинным шрифтом имитацию напечатанного на клавиатуре текста.

  • — Логическое выделение контента. Дополнительно Chrome и FireFox подсвечивают его желтым фоном.

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

  • Используется для оформления текста так, как он был указан при верстке. По умолчанию в HTML любое количество подряд идущих пробелов трансформируются в один, а обычные переносы не учитываются. Элемент pre учитывает положение символов.>

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

  • — Выполняет действия, обратные элементу big, уменьшая размер символов на условную единицу.

  • — Зачеркивает текст. Аналог сокращенного элемента. Не рекомендуется использовать. Аналог CSS text-decoration со значением line-through.

  • — Жирное начертание. Логически акцентирует текст.
  • — Показывает символ в нижнем индексе. Размещается ниже стандартной базовой линии, на которой располагаются символы, и имеет уменьшенный размер. В CSS используется vertical-align.
  • — При выводе кода компьютерной программы все переменные заключаются в этот тег. Выделяет их курсивом.
  • — Показывает текст так, как он записан в коде страницы. Аналогично pre.

Специальные символы

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

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

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

В дальнейшем такой подход поможет сэкономить время на изменении дизайна, а также повысить шансы на попадание в ТОП поисковых систем.

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

Табл. 1. Теги для форматирования текста
Код HTMLОписаниеПример
ТекстЖирное начертание текстаТекст
ТекстКурсивное начертание текстаТекст
ТекстВерхний индексe=mc 2
ТекстНижний индексH 2 O
Текст
Текст пишется как есть, включая все пробелы Текст
ТекстКурсивный текстТекст
ТекстЖирное начертание текстаТекст

Любые теги форматирования текста можно использовать совместно друг с другом. Чтобы сделать текст одновременно жирным и курсивным шрифтом используется сочетание тегов и (пример 1). Их порядок в данном случае не важен.

Пример 1. Жирный курсивный текст

Текст

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

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

Рис. 1. Вид курсивного жирного начертания текста

Использование тегов и сдвигает текст относительно базовой линии и уменьшает размер шрифта (пример 2).

Пример 2. Создание нижнего индекса

Текст

Формула изумруда: Be3 Al2(SiO3)6

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

Рис. 2. Нижний индекс в тексте

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

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

Приведем описание тегов физического форматирования. Часть из них не рекомендуется к использованию спецификацией HTML 4.0 по приведенным выше причинам. Некоторые теги отменены (deprecate) спецификацией HTML 4. 0, однако они продолжают поддерживаться браузерами.

Тег

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

Это полужирный шрифт.

Рис. 1.2. Примеры физического форматирования текста (браузером Netscape)

Тег

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

Выделение курсивом

Тег

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

Это моноширинный шрифт.

Тег

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

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

Теги и

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

Пример зачеркнутого текста.

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

….

Тег

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

Шрифт большего размера.

Тег

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

Шрифт меньшего размера.

Тег

Тег сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов. Например:

Пример шрифта для нижнего индекса.

Тег

Тег сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для задания степеней чисел в математике. Например:

Пример шрифта для верхнего индекса.

Тег

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

Тег

Тег-контейнер является аналогом тега уровня блока

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

Браузер Microsoft Internet Explorer дополнительно разрешает использование следующих параметров тега: DIR, DATAFLD, DATAFORMATAS, DATASRC. Описание параметров можно найти во второй части книги.

Рис. 1.3. Использование вложенных тегов форматирования текста

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

Это полужирный шрифт.

Это курсив.

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

Тег

Тег указывает параметры шрифта. Он относится к тегам физического форматирования уровня текста.

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

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

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

Или

.

Для тега могут задаваться следующие параметры: FACE, SIZE и COLOR. Заметим, что браузер Netscape допускает также использование двух дополнительных параметров: POINT-SIZE и WEIGHT, описание которых опускаем.

    Параметр FACE служит для указания типа шрифта, которым программа просмотра пользователя будет выводить текст (если такой шрифт имеется на компьютере). Значением данного параметра служит название шрифта, которое должно в точности совпадать с названием шрифта, имеющего у пользователя. Если такого шрифта не будет найдено, то данное указание будет проигнорировано и будет использован шрифт, установленный по умолчанию.

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

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

    Назначение шрифтов

    Пример задания названия шрифта.

    На рис. 1.4 показано отображение примера браузером Netscape. В примере в качестве предпочитаемого указывается шрифт Verdana, при его отсутствии будет использован шрифт Arial и т. д.

Рис. 1.4. Отображение примера браузером Netscape

    Этот параметр служит для указания размеров шрифта в условных единицах от 1 до 7. Конкретный размер шрифта зависит от используемой программы просмотра. Принято считать, что размер «нормального» шрифта соответствует значению 3.

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

Размер шрифта указывается как абсолютной величиной (SIZE=2), так и относительной (SIZE=+1). Последний способ часто используется в сочетании с заданием базового размера шрифта с помощью тега .

Примечание

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

Приведем пример, в котором использованы различные способы назначения размеров шрифтов. Отображение примера показано на рис. 1.6.

Рис. 1.5. Окно настройки параметров шрифтов браузера Netscape

Рис. 1.6. Назначение размеров шрифтов

Назначение размеров шрифтов

Шрифт размера 1

Шрифт размера 2

Шрифт размера 3

Шрифт размера 4

Шрифт размера 5

Шрифт размера 6

Шрифт размера 7

    Этот параметр устанавливает цвет шрифта, который может задаваться с помощью стандартных имен или в формате #RRGGBB. Приведем пример документа с разноцветным текстом.

    Выбор цвета шрифта

    Текст зеленого цвета

    Текст красного цвета

Тег

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

Примечание

Тег может появляться также и в разделе документа.

Заметим, что для тега не существует закрывающего тега.

В качестве параметров могут использоваться точно такие же параметры, что и для тега , а именно: FACE, SIZE и COLOR. Назначение и правила записи параметров аналогичны.

Примечание

Браузер Netscape не допускает применение параметра FACE тега .

Приведем пример использования тега .

Назначение размеров шрифтов

Текст, записанный шрифтом по умолчанию.

Шрифт размера 2.

Шрифт размера 4.

Текст после таблицы

В приведенном примере дважды переопределяется размер шрифта, используемого по умолчанию. Изначально он равен 3 (по умолчанию). Затем устанавливается равным 2, далее — 4. Обратите внимание на отображение данного примера (рис. 1.7). Видно, что для таблиц назначение тега не действует. Это характерно для многих браузеров, хотя формально нарушает идею применения тега.

Рис. 1.7. Отображение примера с тегом (браузером Netscape)

Здравствуйте, уважаемые друзья! Ну, что вы готовы продолжать изучение нелегкого с первого взгляда языка HTML. Думаю, что «да».

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

Материал сегодняшней темы я посвятил очень важному элементу оформлению текстов — html теги форматирования текста.

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

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

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

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

Элементы html документа могут не содержать никакого текста, в этом случае применяется, например, тег перевода строк
, без указания закрывающего тега. Либо элементы html документа, могут содержать атрибуты, которые указывают на какое-либо свойство текста, например, теги html font, указывают на размеры шрифта.

Сегодня мы с вами рассмотрим основные html теги форматирования текста, при помощи которых производится создание и редактирование текста в html.

Теги форматирования текста в html документе: классификация

HTML теги разделения на абзац и переноса строк

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

В этом случае абзацы текста будут разделены между собой пустой строкой.

Тег принудительного перевода строк
. После него текст начинается с новой строки.

Посмотрим пример html кода форматирования текста по абзацам и выравнивания по сторонам.


А вот так, этот html документ будет выглядеть в браузере

HTML теги для выделения текста курсивом

Эта группа тегов является парной.

Теги применяются при логическом выделении названий: книги, статьи, цитирование.

Тегами выделяются какие-либо определения. Тегами и , как правило, выделяются наиболее важные фрагменты в тексте.

Пример html кода для выделения текстов курсивом

В браузере наш текст будет выглядеть следующим образом.

Теги, отвечающие за жирный шрифт html

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

В html документе это будет выглядеть следующим образом

И, соответственно, в браузере вы увидите текст, выделенный жирным шрифтом.

Теги, отвечающие за подчеркивание текста html

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

Пример html кода для подчеркнутого текста

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

HTML теги для создания моноширного шрифта

Напомню вам, что моноширный шрифт — это вид шрифта, у которого все знаки одинаковой ширины.

Для форматирования в html документе моноширного шрифта применяются парные теги: ; и

Рассмотрим форматирование моноширного текста на примере:

И, соответственно в вашем браузере будет наблюдаться следующая картинка

Теги для вывода индексов (верхних и нижних) в тексте

Для вывода различных математических, физических или химических значений и формул, очень часто мы сталкиваемся с необходимостью указания индекса, например, формула воды H 2 O. И, если в редакторе Word нам в помощь панель инструментов, то при составлении текстового html документа потребуются теги форматирования.

Тегами мы выведем индекс шрифтом меньшего размера и ниже уровня строки. Тегами мы выведем индекс шрифтом меньшего размера, наоборот, выше уровня строки.

Например, код:

Вывод на экране браузера

Тег html font и его основные параметры

Теги являются парными и в них заключаются основные параметры html шрифта текста:

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

Размер шрифта : size. Указывается от одного до 7-ми в условных единицах. HTML шрифт текста по умолчанию равен 3.

Цвет шрифта в html : color. По умолчанию всегда чёрный. Для ввода цвета шрифта в html документ, существует два варианта:

  • По имени (названию) цвета. Например: color=»blaсk» — черный цвет.
  • По коду (шестнадцатеричный код цвета). Код начинается с символа «#» и включает в себя шесть цифр, например: #000000 — черный цвет.

Таблица цветов html и кодов, как пример, вот здесь: goo.gl/1i4vZ. Вы можете набрать в поисковике запрос «таблицы цветов html» и выбрать таблицу, которая вам понравится.

Пример применения тега html font

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

Как совместно использовать html теги форматирования текста

Ну, вот, например, понадобилось вам создать текст жирным красным курсивом . Для этой операции мы должны попробовать применить теги форматирования: strong, font и em.

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

Пример последовательности:

  • Текст выделяем красным
  • Помещаем текст в тег html курсива
  • И, наконец, всё заключаем в теги жирного шрифта

В итоге, в окне браузера мы видим то, что сделали

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

Loading…

Текст внутри ячейки таблицы

Как применить курсив в HTML — Инструкции

Как применить курсив в HTML с помощью CSS

            В этом руководстве показано, как применять курсив в HTML. Чтобы применить курсив в HTML, вы должны использовать правило стиля CSS и свойство «font-style». При необходимости вы можете применить стиль CSS, используя встроенный, внутренний или внешний CSS, хотя встроенный стиль обычно не рекомендуется. Свойство «font-style» также зависит от свойства CSS «font-family», которое установлено в данный момент, так как шрифты для выделения курсивом должны иметь доступный курсив. Однако, если они этого не делают, вы также можете попытаться выделить шрифты курсивом, используя наклонное значение.

            CSS-свойство font-style использует текстовые значения «курсив», «наклон» или «обычный». Чтобы применить курсив к шрифтам, имеющим вариант курсива, используйте значение italic. Чтобы имитировать появление курсива для шрифтов, у которых нет варианта курсива, вы можете использовать наклонное значение. Наклонное значение пытается наклонить шрифты без определенной вариации курсива. Вместо этого, чтобы указать обычное начертание шрифта, используйте значение normal.

            Чтобы применить курсив в HTML с помощью CSS, поместите курсор метки вставки в то место во внешнем, внутреннем или встроенном стиле CSS, куда вы хотите добавить свойство font-style. Затем введите имя свойства font-style. Затем введите символ двоеточия. Наконец, введите либо текстовое значение «italic», если семейство шрифтов для выделения курсивом имеет доступный курсив, либо введите «oblique», если семейство шрифтов для выделения курсивом не имеет доступного курсива.

            В следующих примерах показано, как применить курсив в HTML, применив свойство font-style в качестве встроенного стиля CSS к тегу абзаца и тегу span. В примере тега абзаца используется текстовое значение «курсив» в стиле шрифта. В примере span используется «наклонное» текстовое значение в стиле шрифта.

Свойство: стиль шрифта
Значение: Либо «курсив», либо «наклонный», либо «обычный»
Пример 1:

Это абзац шрифта без засечек с курсивом.

Пример 2:

Это предложение в абзаце моноширинным шрифтом с курсивом , примененным к одному слову.< /p>

Результат 1:

Это абзац шрифтом без засечек с курсивом.

Результат 2:

Это предложение, выделенное моноширинным шрифтом в абзаце с курсивом, примененным к одному слову.

Изображение, показывающее, как применить курсив в HTML с помощью встроенного стиля CSS.

Как применить курсив в HTML с помощью тега курсива

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

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

Начальный тег: <я>
Конечный тег:
Пример:

Научное название одуванчика – Taraxacum officinale.

Результат:

Научное название одуванчика Taraxacum officinale .

Как применить курсив в HTML с помощью тега выделения

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

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

Начальный тег: <эм>
Конечный тег:
Пример:

Что делать вы хотите?

Результат:

Какие делать вы хотите?

Инструкции по применению курсива в HTML с помощью CSS:

  1. Чтобы применить курсив в HTML с помощью CSS , поместите курсор метки вставки в то место во внешнем, внутреннем или встроенном стиле CSS, где вы хотите добавьте свойство стиля шрифта.
  2. Затем введите имя свойства стиля шрифта.
  3. Затем введите двоеточие.
  4. Наконец, введите либо текстовое значение «italic», если семейство шрифтов для выделения курсивом имеет доступный курсив, либо введите «oblique», если семейство шрифтов для выделения курсивом не имеет доступного курсива.

Инструкции по применению курсива в HTML с помощью тега курсив:

  1. Кроме того, чтобы применить курсив с помощью тега курсив в HTML , введите текст абзаца.
  2. Затем введите тег там, где вы хотите начать выделенный курсивом текст.
  3. Введите текст курсивом.
  4. Затем введите тег в том месте, где должен заканчиваться курсив.
  5. Затем продолжайте вводить обычный текст предложения.

Инструкции по применению курсива в HTML с использованием тега выделения:

  1. Чтобы применить курсив с использованием тега выделения в HTML , введите текст абзаца.
  2. Затем введите тег в том месте, где вы хотите начать выделенный текст.
  3. Затем введите текст, который необходимо выделить.
  4. Затем введите тег в том месте, где вы хотите остановить выделение.
  5. Затем продолжайте вводить обычный текст предложения.

            В следующем видеоуроке под названием «Выделение текста (жирным и курсивом)» показано, как выделить текст в HTML жирным шрифтом и выделить его курсивом с помощью CSS. Этот видеоурок является частью нашего полного курса обучения HTML5 и CSS3 под названием «Освоение HTML5 и CSS3 Made Easy v.1.0».

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

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

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

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

Суфиян Хан Фироз Хан

Обновлено — 26 апреля 2022 г. Чтение: 3 мин. Опубликовано: 26 апреля 2022 г.

Опубликовано:

26 апр. 2022

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

В HTML у нас есть два тега для выделения текста курсивом:

  1. .. тег
  2. .. тег

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

1. Тег

..

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

Пример:

Код:

 
 

Он самый умный мальчик в классе.

Выход:

 Он *самый* умный мальчик в классе. 
 

2. Тег

..

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

Пример:

Код:

 
 

Сурат — алмазный центр Индии.

Выход:

 
 *Сурат* является алмазным центром Индии.
 

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

Пример 1. Выделение текста курсивом с помощью тега HTML

Пример

Код:

 
 

   <голова>
      выберите правильный HTML-тег, чтобы выделить текст курсивом
   
   <тело>
       

Это

лучший колледж в городе.

Текст best выделен курсивом в заголовке выше.

Вывод:

Пример 2. Выделение текста курсивом с использованием тега HTML

Пример:

 
 

   <голова>
      выберите правильный HTML-тег, чтобы выделить текст курсивом
   
   <тело>
     

Поздравляем с переходом на

миллион подписчиков на YouTube.

Текст один миллион выделен курсивом в заголовке выше.

Вывод:

Пример 3. Одновременное использование обоих тегов HTML

Пример:

 
 

   <голова>
      выберите правильный HTML-тег, чтобы выделить текст курсивом
   
   <тело>
     

Алхимик — это потрясающая книга.

Тексты Алхимик и удивительно выделены курсивом в заголовке выше.

Результат:

Пример 4. Выделение текста курсивом с использованием свойства CSS font-style

Мы также можем использовать свойство CSS font-style, чтобы сделать текст курсивом.

Пример:

 
 

   <голова>
      выберите правильный HTML-тег, чтобы выделить текст курсивом
   
   <тело>
       

Я обычный заголовок

Я выделен курсивом с помощью свойства font-style

Результат:

Подробнее

Если вы хотите узнать больше о тегах HTML , нажмите здесь.

Если вы хотите узнать больше о свойствах шрифта CSS , нажмите здесь

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

Оба этих тега HTML поддерживаются почти всеми браузерами.

Заключение

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

Время испытаний!

Время проверить свои навыки и выиграть награды!

Примечание. Награды будут начислены после следующего обновления продукта.

Какой элемент HTML использовать для курсивного текста? Это может быть , , а не | от МасаКудаматсу | На пути к более красивой веб-типографике

ПРИМЕЧАНИЕ. Если вы не являетесь пользователем Medium, нажмите здесь, чтобы прочитать эту статью.

TL;DR, отрендеренный в Zapfino с ранней эстетикой экрана компьютера 🙂

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

Ну, это неправильно, я недавно узнал. В зависимости от цели выделения слов курсивом следует использовать , , или .

Удивлены? Тогда читайте дальше.

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

  1. Выделение
  2. Ключевые термины
  3. Слова на иностранных языках
  4. Слова, используемые как слова (например, «Термин слово относится к последовательности букв, которая имеет определенное значение».)
  5. Буквы, используемые как буквы (например, « s является буквы на английском языке.»)
  6. Названия книг, журналов, фильмов, картин и других творческих работ

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

В разделе 7.50 Чикагского руководства по стилю упоминается пример

Это было Лео!

, чтобы сказать, что «выделение в этом примере зависит от курсива».

И это ударение меняет смысл предложения. Выделение курсивом слова вместо означает, что все остальные думают, что это не Лео. Например, когда вы выделяете курсивом Лео , это будет означать, что все остальные думают, например, что это был Боб. Смысл предложения меняется, пусть и незначительно.

В этом случае веб-разработчики должны использовать . По состоянию на 7 мая 2021 г. в §4.5.2 стандарта HTML Living Standard указано:

Элемент em представляет ударение в его содержании. … Размещение ударения меняет смысл предложения.

MDN в элементе , последняя версия изменена 23 апреля 2021 г., то же самое указано с примером:

предназначен для «изменения значения предложения, как это делает ударение в речи («Я люблю морковь» против «Я люблю морковь »)

Это просто. Но это не вся история.

Раздел 7.56 Чикагского руководства по стилю гласит:

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

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

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

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

Вместо этого мы, вероятно, должны использовать . HTML Living Standard § 4.5.21 гласит:

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

МДН на 9Элемент 0381 , последняя версия которого была обновлена ​​27 марта 2021 г., также указывает:

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

MDN для элемента , последнее обновление версии от 23 апреля 2021 г., также указано:

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

Это мое лучшее предположение. Дайте мне знать, если вы не согласны.

Раздел 7.53 Чикагского руководства по стилю гласит:

Используйте курсив для отдельных слов и фраз из другого языка, если они не встречаются в Webster’s или другом стандартном англоязычном словаре. … Если слово из другого языка становится знакомым из-за многократного использования в произведении, оно должно быть выделено курсивом только при первом употреблении. Однако, если он появляется редко, курсив можно сохранить.

с двумя примерами:

  • Ее любовь к футболу и теленовеллам отличала ее от книжных сверстников.
  • Слово, которое он использовал, Kaffeetasse (кофейная чашка), было достаточно точным, чтобы получить желаемый результат.

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

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

В соответствии с HTML Living Standard §4.5.20:

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

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

(выделено автором жирным шрифтом)

MDN для элемента , версия, последний раз обновленная 27 марта 2021 г., ссылается на эти примеры использования и добавляет:

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

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

Раздел 7.63 Чикагского руководства по стилю гласит:

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

с двумя примерами:

  • Термин критическая масса чаще используется метафорически, чем буквально.
  • Что подразумевается под нейроботикой ?

Для такого использования курсивного текста мы должны использовать , судя по следующему примеру в MDN на элементе , последняя версия обновлена ​​27 марта 2021 года:

Другое пример для может быть: «Слово является артиклем».

В точном примере, упомянутом в документации, я уверен, что в этом случае правильно использовать .

Раздел 7.64 Чикагского руководства по стилю гласит:

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

с несколькими примерами:

  • буква q
  • строчные n
  • прописные W
  • Множественное число обычно образуется в английском языке путем добавления s или es .
  • Он подписал документ цифрой X .
  • Мне нужно слово с двумя e и тремя s .

Для этого курсивного текста я не могу найти ни одного примера, упомянутого в HTML Living Standard или MDN. Но элемент , скорее всего, будет уместен, учитывая, что это аналогичное использование курсива для слов как слов. Дайте мне знать, если вы не согласны.

Раздел 8.2 Чикагского руководства по стилю гласит:

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

Для такого использования курсивного текста соответствующим элементом HTML является . HTML Living Standard §4.5.6 гласит:

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

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

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

с примерами

  • Многие редакторы используют Чикагское руководство по стилю .
  • См. статью «Сравнение стилей MLA и APA».

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

Автор записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *