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

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

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

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

это должно привести к чему-то вроде этого:

<em property="italic" href="http://url/to/a/definition_of_italic"> Your text </em>

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

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

подробнее о RDFa здесь: http://www.alistapart.com/articles/introduction-to-rdfa/

tl; dr

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

Более Длинное Объяснение

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

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

как отметил DisgruntledGoat i семантику в HTML5. Хотя семантика кажется мне узкой. Польза вероятно будет редка.

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

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

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

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

простые OOCSS селекторы ресурсов

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

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

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

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

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

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

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

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

Я не вижу причин использовать <i>, Если вам специально не нужно поддерживать какой-то устаревший браузер без CSS.

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

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

<span class="italic">Italic Text</span> это самый неправильный путь. Прежде всего, это неудобно в использовании. Во-вторых, предлагается, чтобы текст был выделен курсивом. И слой структуры (HTML, XML, etc.) не стоит когда-нибудь сделать это. Представление всегда должно быть отделено от структуры.

<span class="footnote">Italic Text</span> кажется, лучший способ для сноски. Это не предполагает, что какая-либо презентация просто описывает наценку. Вы не можете предсказать, что произойдет в будущем. Если сноска вырастет в функции, вы можете быть вынуждены изменить ее имя класса (чтобы сохранить некоторые логики в коде).

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

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

HTML italic text отображает текст курсивом.

<i>HTML italic text example</i>

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

<p>This is <em>emphasized </em> text format <em>example</em></p>

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

см. В этом руководстве по подробнее: http://www.snoopcode.com/html/html-text-formating

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

Если вы подчеркиваете текст по какой-либо причине, вы можете использовать <em>, или класс, выделяющий курсивом ваш текст.

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

хорошо, первое, что нужно отметить, это <i> устарел и не должен использоваться <i> Не исключено, но я все равно не рекомендую его использовать-смотрите в комментариях подробнее. Это потому, что это полностью противоречит сохранению презентации в слое презентации, на который вы указали. Аналогично,<span class="italic"> кажется, сломать форму тоже.

теперь у нас есть два реальных способа делать вещи: <em> и <span class="footnote">. Запомните это em стенды для акцент. Если вы хотите сделать ударение на слове, фразе или предложении, вставьте его в <em> теги независимо от того, хотите ли вы Курсив или нет. Если вы хотите изменить стиль каким-то другим способом, используйте CSS: em { font-weight: bold; font-style: normal; }. Конечно, вы также можете применить класс <em> тег: если вы решите, что хотите, чтобы некоторые подчеркнутые фразы отображались красным цветом, дайте им класс и добавьте его в CSS:

Fancy some <em class="special">shiny</em> text?

em { font-weight: bold; font-style: normal; }
em.special { color: red; }

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

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

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

DO

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

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

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

   .footnote { font-style:italic; }

НЕ

1. не используйте <i> или <em> элементы - они не поддерживаются и связывают данные и представление слишком близко.
2. не давайте классу значение, указывающее правила представления (т. е. не используйте class="italic").