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

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

12 ответов:

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

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

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

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

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

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

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

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

tl; dr

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

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

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

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

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

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

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

ресурсы OOCSS

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

НЕ НАДО

Источник

Форматирование текста

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

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

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

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

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

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

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

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

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

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

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

Источник

Урок 3. Заголовки и форматирование текста

Заголовки в HTML

Сразу обращайте на это внимание и делайте заголовки информативными! Например: Введение в социологию, Парадокс Энштейна-Подольского-Розена, Жизнеописание Горация, Юрский период, в которых должен содержаться Смысл всей или промежуточной информации данной страницы.

Форматирование текста в HTML

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

Чаще всего (и правильнее) для переноса строки и обозначения абзаца используют тег p (параграф). В случае использования данного тега абзацы у Вас будут разделять отступами друг от друга.

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

Рассмотрим пример кода выравнивания текста по левой стороне, по правой и по центру

Также существует тег center. Он центрирует его содержимое (текст, изображение и тд). Для текста его действие аналогично выравниванию по центру.

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

Рассмотрим пример кода выделения текста жирным

И те, и другие слова будут выделены жирным, однако для Поисковой Системы будет важны слова ключевого слова

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

Рассмотрим пример кода c выделением текста курсивом

Как выделить текст подчёркиванием в html?

Данные и в первом, и во втором случае будут выделен подчёркиванием.

Как сделать перечёркнутый текст в html?

Как выделить текст в верхнем и нижнем индексах в html?

Тег font в html

Для редактирования текста в html также используется тег font. Однако с введением блочной вёрстки и популярностью CSS данный способ быстро начал забываться.

Тег font указывает параметры шрифта (тип шрифта, размер, цвет). У него есть соответствующие атрибуты:

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

Можно ли вывести текст в том виде, в котором напечатал(а). Тег PRE

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

Источник

WEBTEORETIK

Когда человеку тяжело,
это часто означает,
что он идёт к успеху.

Создание жирного и курсивного шрифта средствами CSS

Категория: Уроки CSS Просмотров: 4551 Коментариев: 0 Дата: 2017-11-09 Добавил: admin

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

Курсивный шрифт CSS

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

Задаем свойство для курсивного шрифта.

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

Жирный шрифт CSS

Чтобы задать жирный шрифт используется другое свойство, с именем font-weight: ; другими словами его еще называют насыщенностью шрифта. Изначально насыщенность установлена в значение normal то есть насыщенность шрифта нормальная, а задав значение bold он примет полужирный вид.

Так же можно задавать значение насыщенности цифрами от 100 до 900 с шагом 100. Значение normal приравнивается цифре 400, а значение bold цифре 700. Значение 900 поддерживается не всеми шрифтами, поэтому задав это значение, Вы можете не заметить отличия от значения 700. Выглядит такое условие следующим образом.

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

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

Источник