Italic html: : The Idiomatic Text element — HTML: HyperText Markup Language

Help:Formatting — MediaWiki

Other languages:

  • Bahasa Indonesia
  • Deutsch
  • English
  • Esperanto
  • Lëtzebuergesch
  • Nederlands
  • Qaraqalpaqsha
  • Sunda
  • Tagalog
  • Tiếng Việt
  • Türkçe
  • Yorùbá
  • asturianu
  • bosanski
  • català
  • dansk
  • español
  • français
  • italiano
  • magyar
  • norsk bokmål
  • occitan
  • polski
  • português
  • português do Brasil
  • română
  • slovenčina
  • suomi
  • svenska
  • čeština
  • беларуская (тарашкевіца)
  • русский
  • українська
  • қазақша
  • עברית
  • العربية
  • سنڌي
  • فارسی
  • پښتو
  • कॉशुर / کٲشُر
  • हिन्दी
  • தமிழ்
  • മലയാളം
  • සිංහල
  • ไทย
  • 中文
  • 日本語
  • 한국어
Note: When you edit this page, you agree to release your contribution under the CC0.
See Public Domain Help Pages for more info.

You can format your text by using wiki markup. This consists of normal characters like asterisks, apostrophes, or equal signs which have a special function in the wiki, sometimes depending on their position. For example, to format a word in italic, you include it in two pairs of apostrophes like ''this''.

DescriptionYou typeYou get
Character (inline) formatting – applies anywhere
Italic text
''italic''

italic

Bold text
'''bold'''

bold

Bold and italic
'''''bold & italic'''''

bold & italic

«>
Escape wiki markup
<nowiki>no [[wiki]] ''markup''</nowiki>

no [[wiki]] »markup»

Section formatting – only at the beginning of the line
Section Headings of different levels
== Level 2 ==
=== Level 3 ===
==== Level 4 ====
===== Level 5 =====
====== Level 6 ======

Level 3

Level 4
Level 5
Level 6
Horizontal rule
Text before
----
Text after

Text before


Text after

Bullet list
* Start each line
* with an [[Wikipedia:asterisk|asterisk]] (*). 
** More asterisks give deeper
*** and deeper levels.
* Line breaks <br />don't break levels.
*** But jumping levels creates empty space.
Any other start ends the list.
* combine bullet list
** with definition 
::- definition
** creates empty space
* combine bullet list
** with definition 
*:- definition
** without empty spaces
*bullet list
:- definition
:* sublist that doesn't create empty
:* spaces after definition
  • Start each line
  • with an asterisk (*).
    • More asterisks give deeper
      • and deeper levels.
  • Line breaks
    don’t break levels.
      • But jumping levels creates empty space.

Any other start ends the list.

  • combine bullet list
    • with definition
— definition
    • creates empty space
  • combine bullet list
    • with definition
    — definition
    • without empty spaces
  • bullet list
— definition
  • sublist that doesn’t create empty
  • spaces after definition
Numbered list
# Start each line
# with a [[Wikipedia:Number_sign|number sign]] (#). 
## More number signs give deeper
### and deeper
### levels.
# Line breaks <br />don't break levels.
### But jumping levels creates empty space.
# Blank lines
# end the list and start another.
Any other start also
ends the list.
<nowiki>#</nowiki> use "nowiki" tags to display a literal (#) at the beginning of a line without interpreting it as a numbered list.
  1. Start each line
  2. with a number sign (#).
    1. More number signs give deeper
      1. and deeper
      2. levels.
  3. Line breaks
    don’t break levels.
      1. But jumping levels creates empty space.
  4. Blank lines
  1. end the list and start another.

Any other start also ends the list.

# use «nowiki» tags to display a literal (#) at the beginning of a line without interpreting it as a numbered list.

Definition list
;item 1
: definition 1
;item 2
: definition 2-1
: definition 2-2

At the end of the line, if the line begins with a semicolon (;), any inserted colon (:) will not be displayed. If you want for the colon to be displayed, escape it by writing &#58;.

item 1
definition 1
item 2
definition 2-1
definition 2-2
Indent text
: Single indent
:: Double indent
::::: Multiple indent

This workaround may harm accessibility.

Single indent
Double indent
Multiple indent
Mixture of different types of list
# one
# two
#* two point one
#* two point two
# three
#; three item one
#: three def one
# four
#: four def one
#: this looks like a continuation
#: and is often used
#: instead <br /> of <nowiki><br /></nowiki>
# five
## five sub 1
### five sub 1 sub 1
## five sub 2

The usage of #: and *: for breaking a line within an item may also harm accessibility.

  1. one
  2. two
    • two point one
    • two point two
  3. three
    three item one
    three def one
  4. four
    four def one
    this looks like a continuation
    and is often used
    instead
    of <br />
  5. five
    1. five sub 1
      1. five sub 1 sub 1
    2. five sub 2
Preformatted text
 Start each line with a space.
 Text is '''preformatted''' and
 ''markups'' '''''can''''' be done.

This way of preformatting only applies to section formatting. Character formatting markups are still effective.

Start each line with a space.
Text is preformatted and
markups can be done.
Preformatted text blocks
 <nowiki>Start with a space in the first column,
(before the <nowiki>).
Then your block format will be
    maintained. 
This is good for copying in code blocks:
def function():
    """documentation string"""
    if True:
        print True
    else:
        print False</nowiki>
Start with a space in the first column,
(before the <nowiki>).
Then your block format will be
    maintained.
This is good for copying in code blocks:
def function():
    """documentation string"""
    if True:
        print True
    else:
        print False

«>

«> MediaWiki ignores single line breaks. To start a new paragraph, leave an empty line. You can force a line break within a paragraph with the HTML tag ‎<br />.

«>»> Some HTML tags are allowed in MediaWiki, for example ‎<code>, ‎<div>, and ‎<span>. These apply anywhere you insert them.

DescriptionYou typeYou get
«>»>
Inserted
(Displays as underline in most browsers)
<ins>Inserted</ins>
or
<u>Underline</u>

Inserted

or

Underline

«>»>
Deleted
(Displays as strike-through in most browsers)
<s>Strike-through</s>
or
<del>Deleted</del>

Strike-through

or

Deleted

«>
Fixed width text
<code>Source code</code>
Source code
«>
Blockquotes
Text before
<blockquote>Blockquote</blockquote>
Text after

Text before

Blockquote

Text after

«>
Quotes
<q>This is a quotation</q>

The q element must not be used in place of quotation marks that do not represent quotes; for example, it is inappropriate to use the q element for marking up sarcastic statements.

[1]

This is a quotation
Comment
<!-- This is a comment -->
Comments are visible only 
in the edit zone.

Comments are visible only in the edit zone.

«>
Completely preformatted text
<pre>
Text is '''preformatted''' and 
''markups'' '''''cannot''''' be done
</pre>

For marking up of preformatted text, check the «Preformatted text» entry at the end of the previous table.

Text is '''preformatted''' and 
''markups'' '''''cannot''''' be done
Customized preformatted text
<pre>
Text is '''preformatted''' 
with a style and 
''markups'' '''''cannot''''' be done
</pre>

A CSS style can be named within the style attribute.

Text is '''preformatted''' 
with a style and 
''markups'' '''''cannot''''' be done

continued:

DescriptionYou typeYou get
Default preformatted text has a CSS attribute (white-space: pre-wrap;) to wrap the text according to available width
<pre>
This long sentence is used to demonstrate text wrapping.  This additional sentence makes the text even longer. This additional sentence makes the text even longer.
</pre>
This long sentence is used to demonstrate text wrapping. This additional sentence makes the text even longer. This additional sentence makes the text even longer.
Customized preformatted text with disabled text wrapping
<pre>
This long sentence is used to demonstrate text wrapping. This additional sentence makes the text even longer. This additional sentence makes the text even longer.
</pre>
This long sentence is used to demonstrate text wrapping. This additional sentence makes the text even longer. This additional sentence makes the text even longer.

Symbols and other special characters not available on your keyboard can be inserted in a multitude of ways. Many Operating Systems and browsers allow you to insert special characters through a menu option or Operating System panel. Additionally, you can use the WikiEditor or VisualEditor to insert them into the edit screen.

As a last resort, you can use a special sequence of characters. Those sequences are called HTML entities. For example, the following sequence (entity) &rarr; when inserted will be shown as right arrow HTML symbol → and &mdash; when inserted will be shown as an em dash HTML symbol —.


Hover over any symbol to reveal the entity that produces it. Some symbols not available in the current font will appear as empty squares.

HTML symbol entities
ÁáÂâ´ÆæÀàΑα&ÅåÃãÄäΒβ¦Ç縢
Χχˆ©¤°Δδ÷ÉéÊêÈèΕεΗη
ÐðË냽¼¾Γγ>ÍíÎî¡ÌìΙι
¿ÏïΚκΛλ«<¯µ·Μμ 
¬ÑñΝνÓóÔôŒœÒòΩωΟοªºØøÕõÖ
öΦφΠπϖ±£Ψψ»»®Ρρ
Šš§­Σσς¹²³ßΤτΘθϑÞþ˜
×ÚúÛûÙù¨ϒΥυÜüΞξÝý¥ÿŸΖζ
DescriptionYou typeYou get
Copyright symbol&copy;
©
Greek delta letter symbol&delta;
δ
Euro currency symbol&euro;

See the list of all HTML entities on the Wikipedia article List of HTML entities. Additionally, MediaWiki supports two non-standard entity reference sequences: &רלמ; and &رلم; which are both considered equivalent to &rlm; which is a right-to-left mark. (Used when combining right to left languages with left to right languages in the same page.)

&amp;euro;  → &euro;
<span>Typo to be corrected</span>  → Typo to be corrected
&lt;span>Typo to be corrected</span>  → <span>Typo to be corrected</span>

Nowiki for HTML

‎<nowiki /> can prohibit (HTML) tags:

  • <<nowiki />pre>  → <pre>

But not & symbol escapes:

  • &<nowiki />amp;  → &

To print & symbol escapes as text, use «&amp;» to replace the «&» character (eg. type «&amp;nbsp;«, which results in «&nbsp;«).

Beyond the text formatting markup shown hereinbefore, here are some other formatting references:

  • Links
  • Lists
  • Images
  • LanguageConverter markup – see Writing systems/Syntax
  • References – see Extension:Cite
  • Tables

You can find more references at Help:Contents .

  1. ↑ HTML Living Standard—The <q> element

Использование выделения в тексте

Перейти к основному содержанию Центр помощи

Изменено: пн, 17 октября 2022 г., 15:16

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

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

«Я хочу получать уведомления по электронной почте , а не по другим каналам связи».

«Его любимая книга Гроздья гнева

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

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

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

Приемлемый метод 

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

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

Примеры: 

  • Этот метод привел к увеличению продаж на 30%, да, на 30%.
  • Важно! Не подливайте масла в огонь

Допустимо в некоторых случаях

Теги Strong и Emphasis

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

Семантическая разметка лучше, чем разметка, используемая исключительно для стилизации, но, к сожалению, многие программы чтения с экрана игнорируют эти теги по умолчанию. Некоторые программы чтения с экрана (например, JAWS и NVDA) могут быть настроены на объявление выделения, но для этого требуются некоторые технические знания.

Руководство по обеспечению доступности веб-контента (WCAG) обсуждает эти методы в этой статье — Использование семантической разметки для выделения выделенного или специального текста.

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

Жирный шрифт

и курсив

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

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

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

Стиль HTML

Атрибуты стиля HTML используются для добавления стиля к элементу, например цвет, шрифт, размер и т. д.

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

  style="font-weight:bold"  

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

Теги заголовков

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

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

Заключение

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

Если вы решите использовать визуальное выделение, мы рекомендуем использовать семантические теги Strong и Emphasis , а также избегать использования Bold и Italic

Даже если вы используете Strong и Emphasis , нет гарантии, что они будут переданы средством чтения с экрана. Однако пользователи могут настроить некоторые программы чтения с экрана (например, JAWS и NVDA) на распознавание этих тегов.

Дополнительные ресурсы

  • Важность заголовков

Вы нашли это полезным? Да №

Отправить отзыв

Извините, мы не смогли вам помочь. Помогите нам улучшить эту статью своими отзывами.

CSS/HTML: как правильно выделить текст курсивом?

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

спросил

Изменено 2 года, 9 месяцев назад

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

Как правильно сделать текст курсивом? Я видел следующие четыре подхода:

 Курсив
Курсив
Курсив
Курсив
 

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


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


Для размещения презентации используется класс CSS. Это часто рекламируется как правильный путь, но опять же, мне это кажется неправильным. Похоже, что это не имеет большего семантического значения, чем . Но, кричат ​​его сторонники, гораздо проще потом изменить весь ваш курсивный текст, если вы, скажем, хотели, чтобы он был жирным. Но это не так, потому что тогда у меня останется класс под названием «курсив», который выделяет текст жирным шрифтом. Кроме того, неясно, почему я когда-либо захочу изменить весь курсив на своем веб-сайте или, по крайней мере, мы можем придумать случаи, когда это было бы нежелательно или необходимо.


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

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

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


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

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

Есть ли хорошие записи в блогах или статьи на эту тему? Возможно, теми, кто принимал решение сохранить/создать тег?

  • html
  • css
  • семантическая разметка

4

Для разных вариантов использования следует использовать разные методы:

  1. Если вы хотите выделить фразу, используйте .
  2. Тег имеет новое значение в HTML5, представляя «участок текста с альтернативным голосом или настроением». Таким образом, вы должны использовать этот тег для таких вещей, как мысли/замечания или идиоматические фразы. Спецификация также предлагает названия кораблей (но больше не предлагает названия книг/песен/фильмов; используйте вместо этого).
  3. Если выделенный курсивом текст является частью более крупного контекста, скажем, вступительного абзаца, вы должны прикрепить стиль CSS к более крупному элементу, т. е. p.intro { font-style: italic; }

4

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

Именование в целом может быть сложной задачей, и имена классов не являются исключением, но, тем не менее, это то, что вы должны сделать. Если вы используете курсив, чтобы выделить блок из основного текста, то, возможно, имя класса «отличительное от потока» будет правильным. Подумайте о повторном использовании: имена классов предназначены для категоризации — где еще вы хотели бы сделать то же самое? Это должно помочь вам определить подходящее имя.

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

0

Я не эксперт, но я бы сказал, что если вы действительно хотите быть семантикой, вам следует использовать словари (RDFa).

В результате должно получиться примерно следующее:

  Ваш текст 
 

em используется для представления (люди увидят его курсивом) и свойство 9Атрибуты 0127 и href ссылаются на определение того, что такое курсив (для машин).

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

Более подробная информация о RDFa здесь: http://www.alistapart.com/articles/introduction-to-rdfa/

1

TLDR

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

Более длинное объяснение

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

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

Как упоминал DisgruntledGoat, i является семантическим в HTML5. Однако семантика кажется мне узкой. Использование, вероятно, будет редким.

Семантика em изменена в HTML5, чтобы выделить ударение. strong также может использоваться для демонстрации важности. strong может быть выделен курсивом, а не полужирным шрифтом, если вы хотите его оформить. Не позволяйте таблице стилей браузера ограничивать вас. Вы даже можете использовать таблицу стилей сброса, чтобы перестать думать по умолчанию. (Хотя есть некоторые оговорки.)

class="italic" — это плохо. Не используйте его. Это не семантично и совсем не гибко. Представление по-прежнему имеет семантику, но отличается от разметки.

class="footnote" эмулирует семантику разметки и также неверен. Ваш CSS для сноски не должен быть полностью уникальным для вашей сноски. Ваш сайт будет выглядеть слишком беспорядочно, если каждая его часть оформлена по-своему. У вас должно быть несколько визуальных шаблонов, разбросанных по вашим страницам, которые вы можете превратить в классы CSS. Если ваш стиль сносок и блок-кавычек очень похож, то вам следует отнести сходство к одному классу, а не повторяться снова и снова. Вы можете рассмотреть возможность использования методов OOCSS (ссылки ниже).

Разделение ответственности и семантики имеет большое значение в HTML5. Люди часто не понимают, что разметка — не единственное место, где важна семантика. Существует семантика контента (HTML), а также семантика представления (CSS) и семантика поведения (JavaScript). Все они имеют свою собственную семантику, на которую важно обращать внимание для удобства обслуживания и сохранения DRY.

Ресурсы OOCSS

  • Объектно-ориентированный CSS
  • Введение в объектно-ориентированный CSS (OOCSS)
  • Как написать объектно-ориентированный CSS
  • Начало работы с объектно-ориентированным CSS (OOCSS)
  • Объектно-ориентированный CSS: что, как и почему
  • Погружение в объектно-ориентированный CSS

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

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

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

Поскольку это достаточно сложные стили (со связанными проблемами Internet Explorer), повторно используемые в разных местах, мы создаем такие классы, как box-1 , box-2 , чтобы мы могли повторно использовать стили.

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

3

HTML курсивный текст отображает текст курсивом.

 Пример HTML-курсива
 

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

 

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

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

Дополнительные сведения см. в этом руководстве: Форматирование текста HTML

0

Элемент i не является семантическим, поэтому для скринридеров, гуглбота и т.п. он должен быть каким-то прозрачным (как span или div элементов). Но это не лучший выбор для разработчика, потому что он объединяет уровень представления со слоем структуры, а это плохая практика. Элемент

em (также strong ) должен всегда использоваться в семантическом контексте, а не в презентационном. Его нужно использовать всякий раз, когда какое-то слово или предложение важны. Просто для примера в предыдущем предложении я должен использовать em , чтобы сделать больший акцент на части «следует всегда использовать». Браузеры предоставляют некоторые свойства CSS по умолчанию для этих элементов, но вы можете и должны переопределять значения по умолчанию, если ваш дизайн требует этого, чтобы сохранить правильное семантическое значение этих элементов.

Курсив — самый неправильный способ. Во-первых, это неудобно в использовании. Во-вторых, предлагается выделить текст курсивом. И слой структуры (HTML, XML и т. д.) никогда не должен этого делать. Презентация всегда должна быть отделена от структуры.

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

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

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

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

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

Если это чисто стильная вещь, например, ваш дизайнер решил, что все ваши заголовки

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

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

1

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

Если вы выделяете текст по ЛЮБОЙ причине, вы можете использовать или класс, выделяющий текст курсивом.

Это нормально иногда нарушать правила !

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

Итак, теперь у нас есть два реальных способа сделать что-то: и . Помните, что em означает акцент . Если вы хотите сделать акцент на слове, фразе или предложении, вставьте его в теги независимо от того, хотите ли вы выделить курсивом или нет. Если вы хотите изменить стиль каким-либо другим способом, используйте CSS: em { font-weight: bold; стиль шрифта: обычный; } . Конечно, вы также можете применить класс к тегу : если вы решите, что определенные выделенные фразы должны отображаться красным цветом, присвойте им класс и добавьте его в CSS:

 Причудливо  блестящий текст?
em { вес шрифта: полужирный; стиль шрифта: обычный; }
em.special { цвет: красный; }
 

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

5

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

text-style лучше подходит для нескольких стилей и не требует семантики.

DO

  1. Присвойте атрибуту класса значение, указывающее характер данных (т. е. class="footnote" подходит)

  2. Создать таблицу стилей CSS для страницы

  3. Определите стиль CSS, привязанный к классу, который вы назначаете элементу

    .сноска { стиль шрифта: курсив; }

НЕЛЬЗЯ

  1. Не используйте элементы или — они не поддерживаются и слишком тесно связывают данные и представление.

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

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