Курсивный текст css: CSS (font-style). html: , . – Наклонный текст CSS на все случаи жизни

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

правильный способ сделать текст курсивом-игнорировать проблему, пока вы не доберетесь до 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/HTML: Как правильно сделать текст курсивным?

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

<i>Italic Text</i>

<em>Italic Text</em>

<span>Italic Text</span>

<span>Italic Text</span>

Это и есть "old way". <i> не имеет никакого семантического значения и лишь передает презентационный эффект выделения текста курсивом. Насколько я могу видеть, это явно неправильно, потому что это не семантика.

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

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

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

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

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

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

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

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

<i> и задаться вопросом, является ли этот ход мыслей причиной того, что он остался в спецификации HTML5?

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

html css semantic-markup Поделиться Источник Rupert Madden-Abbott     21 января 2010 в 10:11

12 Ответов



195

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

  1. Если вы хотите подчеркнуть фразу, используйте <em> .
  2. Тег <i> имеет новое значение в HTML5, представляя собой "a span of text in an alternate voice or mood". Поэтому вы должны использовать этот тег для таких вещей, как мысли/Асиды или идиоматические фразы. Спецификация также предлагает названия судов (но больше не предлагает book/song/movie названия; вместо этого используйте <cite> ).
  3. Если выделенный курсивом текст является частью более широкого контекста, скажем, вводного абзаца, вы должны прикрепить стиль CSS к более крупному элементу, т. е. p.intro { font-style: italic; }

Поделиться DisgruntledGoat     21 января 2010 в 12:44



21

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

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

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

<i> . Иначе-нет.

Поделиться Alohci     21 января 2010 в 10:39



9

Я не эксперт, но я бы сказал, что если вы действительно хотите быть семантическим, вам следует использовать словари (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/

Поделиться Guillaume Flandre     21 января 2010 в 10:31



7

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

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

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

Как уже упоминалось DisgruntledGoat

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

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

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

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

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

Ресурсы OOCSS

Поделиться Eva     06 сентября 2013 в 00:46



5

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

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

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

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

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

Поделиться Paul D. Waite     21 января 2010 в 10:38



1

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

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

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

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

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

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

Поделиться Crozin     21 января 2010 в 11:02



1

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

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

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

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

Поделиться GrahamS     21 января 2010 в 11:05



1

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

<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

Поделиться Prabhakar     29 ноября 2015 в 04:23



0

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

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

Fancy some <em>shiny</em> text?

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

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

Поделиться Samir Talwar     21 января 2010 в 10:37



0

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

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

Это OK, чтобы иногда нарушать правила !

Поделиться tahdhaze09     21 января 2010 в 14:17



-1

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

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

Поделиться aryan     21 января 2010 в 10:37



-3

DO

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

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

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

    .footnote { font-style:italic; }

НЕ

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

Поделиться Ninju Bohra     22 февраля 2012 в 17:42


Похожие вопросы:


сделать текст html невыбираемым

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


Добавить цветную строку с курсивным шрифтом в текст подсказки

Как добавить цветную строку с курсивным шрифтом в текст подсказки? На самом деле я переопределил метод getToolTipText(MouseEvent e) из JComponent в Core java и добавил к нему некоторый tooltiptext...


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

Как правило, способ подчеркнуть текст в тексте курсивом-сделать его не курсивным. Например: Публикация Улисса Джеймса Джойса была встречена большими спорами. Я знаю, что смогу это сделать: em em {...


Используя CGContext, как сделать шрифт курсивным или полужирным?

Я могу использовать CGContextSelectFont, чтобы выбрать fontType, fontSize. Но как сделать шрифт курсивным или полужирным? тнх


Как сделать выделенный текст в текстовой области полужирным, курсивным и т. д., а затем добавить его в форматированный текст?

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


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

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


Как сделать текст значения в форме курсивным

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


Как я могу сделать текст правильно выровненным в элементе HTML с отображением: flex?

У меня есть следующие HTML: <div class=outer> <div class=inner1>Hello</div> <div class=inner2>World</div> </div> Со следующим CSS: .outer { display: flex; }...


Как сделать светящийся текст в HTML и CSS

Я хочу сделать светящийся текст в HTML и CSS. Я следую этому учебнику. http://msdn.microsoft.com/en-us/library/gg589484(в=VS.85).aspx#creating_%22glow%22_effects_with_drop_shadows Я хочу, чтобы...


Как сочетать полужирный и курсивный шрифт в CSS?

Этот учебник W3Schools научил меня, как использовать свойство CSS font-style , чтобы сделать текст полужирным (эквивалентно <b&g>this</b> в старомодном HTML), а также как сделать...


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

Я знаю, что это легко, но по какой-то причине я не могу найти этот ответ. Я перепробовал все, используя font-family и font-style.

css Поделиться Источник DavidAlexanderPerez     12 марта 2018 в 02:49

5 Ответов



1

Вы можете использовать следующее правило:

шрифт-стиль: курсив;

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

p.italic {
font-style: italic; 
}
<p>This is normal text.</p>
<p>This is italic text.</p>    

Поделиться BenjB     12 марта 2018 в 03:00



0

Ну, если вы хотите использовать курсивный шрифт (или любой другой пользовательский шрифт), я рекомендую использовать https://cooltext.com/ . Перейдите в раздел "fonts" в верхней части главной страницы, и там есть различные категории, которые вы можете выбрать. "Cursive" - это то, что вам нужно, я полагаю. Выберите шрифт, который вы хотите, и загрузить файл .zip. Извлеките его и все такое, а затем преобразуйте в файл .woff, используя http://ttf2woff.com/ (поверьте мне, он должен быть в формате .woff для веб-страниц. Я испытал гнев и страдание от этого...) Надеюсь, это поможет! ..

.

Или вы могли бы просто сделать то, что предлагали все остальные, это тоже прекрасно.

Поделиться AidanM     12 марта 2018 в 02:52



0

Вы можете либо использовать курсивный шрифт CSS, либо использовать свойство letter-spacing , используя в качестве значения -1px :

p.cursive {
    letter-spacing: -1px;
}
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus interdum placerat ligula mattis semper. Nunc ornare pellentesque arcu, malesuada ullamcorper est cursus at. Duis id nibh ligula. Nam maximus nibh finibus lorem laoreet, vel tincidunt purus ornare. Nulla molestie eu massa et elementum.</p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus interdum placerat ligula mattis semper. Nunc ornare pellentesque arcu, malesuada ullamcorper est cursus at. Duis id nibh ligula. Nam maximus nibh finibus lorem laoreet, vel tincidunt purus ornare. Nulla molestie eu massa et elementum.</p>

Поделиться Obsidian Age     12 марта 2018 в 02:53



0

Это должно сработать...

span {
    font-family: cursive;
}
<span>Cursive text</span>

Поделиться Jorge Altieri     12 марта 2018 в 02:56



0

Вы можете использовать свойство font-family .

p {
  font-family: cursive;
}
<p>some text in cursive font</p>

Поделиться sol     12 марта 2018 в 02:57


Похожие вопросы:


если ячейка a1=текст, то ячейка a2=жирный шрифт. Как мне это сделать в excel?

если ячейка a1 равна некоторому тексту, то я хочу выделить соответствующую ячейку в той же строке полужирным и курсивным шрифтом. например, если в ячейке a1 есть текст james, то я хочу сделать...


Добавить цветную строку с курсивным шрифтом в текст подсказки

Как добавить цветную строку с курсивным шрифтом в текст подсказки? На самом деле я переопределил метод getToolTipText(MouseEvent e) из JComponent в Core java и добавил к нему некоторый tooltiptext...


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

Как правило, способ подчеркнуть текст в тексте курсивом-сделать его не курсивным. Например: Публикация Улисса Джеймса Джойса была встречена большими спорами. Я знаю, что смогу это сделать: em em {...


Как сделать текст тоньше в CSS?

Когда я вставляю тег <h2> , текст выглядит так, как будто он был выделен жирным шрифтом. Как сделать текст тоньше в CSS?


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

Как правильно сделать текст курсивным? Я видел следующие четыре подхода: <i>Italic Text</i> <em>Italic Text</em> <span class=italic>Italic Text</span> <span...


Используя CGContext, как сделать шрифт курсивным или полужирным?

Я могу использовать CGContextSelectFont, чтобы выбрать fontType, fontSize. Но как сделать шрифт курсивным или полужирным? тнх


Как сделать выделенный текст в текстовой области полужирным, курсивным и т. д., а затем добавить его в форматированный текст?

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


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

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


Как сделать текст значения в форме курсивным

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


Как сочетать полужирный и курсивный шрифт в CSS?

Этот учебник W3Schools научил меня, как использовать свойство CSS font-style , чтобы сделать текст полужирным (эквивалентно <b&g>this</b> в старомодном HTML), а также как сделать...


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

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

<i>Italic Text</i>

<em>Italic Text</em>

<span>Italic Text</span>

<span>Italic Text</span>

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

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

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

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

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

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

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

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

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

Курсив html тег пример

Поддержи проект!!!

Курсив или наклоненный текст html - как сделать курсив в html, тег курсива в html, как сделать шрифт курсивом через css, либо просто в коде html!

Все способы сделать наклонный текст через css , тег i курсив

  1. Как сделать наклонный текст все способы
  2. Тег i курсива наклонный текст
  3. Наклонный текст стилями прямо в теге
  4. Наклонный текст через стили css
  5. Наклонный текст через файл css
  1. Как сделать наклонный текст все способы

    Сколько способов сделать наклонный текст существует!?

    1). Через тег курсива i - Это тестовый наклонный текст.
    2). Через тег с использованием font-style: italic.
    3). Через тег style с использованием font-style: italic.
    4). Через файл css с использованием font-style: italic.
  2. itstime

    Тег i курсива наклонный текст

    Для того, чтобы сделать наклонны текст - существует отдельный тег - i курсив
    <i>Здесь тестовый наклонный текст - курсивом </i>

    Результат использования тега курсива наклонного текста:

    Здесь тестовый наклонный текст - курсивом
  3. Наклонный текст стилями прямо в теге

    Можно сделать текст наклонным конкретно в каком-то теге. Например у нас есть тег абзаца, который обозначается буквой p в английском алфавите. Просто в тег добавляем стили с font-style: italic

    style="font-style: italic;"

    Результат дополнения в тег наклонного font-style: italic

    <p>Использование атрибута style, для придания тексту написания курсив.</p>

    Результат дополнения в тег наклонного font-style: italic

    Точечное изменение текста на курсив в одной строке...

  4. itstime

    Наклонный текст через стили css

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

    Прописываем какой-то [класс] или id стилями

    <style>

    .example { font-style: italic;}

    </style>

    Далее нам потребуется какой-то тег, с этим классом:

    <div>Здесь текст наклоненный через style и класс с font-style: italic</div>

    Результат наклонного текста через css:

    Здесь текст наклоненный через style и класс с font-style: italic

  5. Наклонный текст через файл css

    Как сделать наклонный текст через файл css - - этот наклонный текст через файл ссы будет действовать на всем сайте!

    Поступаем абсолютно аналогично установке наклонного текста, как в предыдущем пункте.Только в файле css? тег style не указываем!

    .example { font-style: italic;}


Вас может еще заинтересовать список тем : #HTML | #CSS | #HTML_TAGS |

Последняя дата редактирования : 2020-01-28 10:12

Теги:
курсив html html курсив текст как сделать курсив в html шрифт курсив html выделить курсивом html тег курсива в html код html курсив как сделать текст курсивом в html жирный курсив в html полужирный курсив в html курсив css html какой html тег выводит текст курсивом как выделить текст курсивом в html выделение курсивом в html как сделать шрифт курсивом в html

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

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