не является неправильным, потому что он не является семантическим. Это неправильно (обычно), потому что это презентационный. Разделение озабоченности означает, что имеющаяся информация должна передаваться с помощью 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 на вашем сайте курсивом. Надо думать о разметке от думаю о презентации.

как отметил DisgruntledGoati является семантическим в 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 to подчеркните это. Но помните, что эти элементы являются встроенными элементами и не должны использоваться для выделения большого блока текста.

используйте 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> tag: если вы решили, что хотите, чтобы определенные подчеркнутые фразы отображались красным цветом, дайте им класс и добавьте его в CSS:

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

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

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

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

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

DO

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

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

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

   .footnote { font-style:italic; }

НЕ НАДО

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