Стиль шрифта: курсив против косой в CSS

В чем разница между этими двумя:

font-style:italic
font-style:oblique

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

Чего мне не хватает?

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

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

Курсив лучше всего указывать только тогда, когда вы уверены, что шрифт был разработан с одним шрифтом.

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

Большинство шрифтов имеют курсив или косую версию; Я никогда не видел тот, который имеет оба. (Если у вас есть курсивная версия, зачем использовать косую версию?)

Косой тип (или наклонный, наклонный) - это форма типа, которая слегка наклонена вправо и используется так же, как и курсивный тип. В отличие от курсивного шрифта, он не использует различные формы глифов; он использует те же символы, что и римский, за исключением искаженного.

Дальнейшее чтение: стиль шрифта CSS косой против курсива

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

Вы будете видеть искусственный курсив везде, где обычный шрифт перекошен, font-style: italic;тогда как истинный курсивный шрифт предназначен для наклонного.

Нижней части двух LL сек показывает разницу ясно.

См пример

Согласно руководству по CSS для разработчиков Mozilla :

курсив: устанавливает текст, чтобы использовать курсив версию шрифта, если доступно ; если не доступно, вместо этого он будет имитировать курсив с косой.

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

Отсюда мы делаем вывод, что если курсивная версия шрифта недоступна , курсив и наклонный ведут себя одинаково. Поскольку фрагмент кода W3Schools не указывает какой-либо конкретныйfont-family , я считаю, что используется шрифт по умолчанию; шрифт по умолчанию, который, вероятно, не имеет курсивной версии.

Но как сделать курсивную версию шрифта доступной?

Это означает, что у нас есть как минимум две версии одного и того же шрифта: «обычный» и курсивный. Они могут быть указаны в <style>разделе с @font-faceправилом. Пожалуйста , кратко следующим образом: developer.mozilla , w3schools , tympanus.net . Как видите, шрифт загружается в виде файла, который может иметь следующие расширения:eot, otf, woff, truetype .

До сих пор я нашел два способа связать файл шрифта

`@font-face {
 font-family: 'Open Sans';
 font-style: normal;
 font-weight: 400;
 src: local('Open Sans'), local('OpenSans'), 
 url (http://themes.googleusercontent.com/static/fonts/opensans/v8/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

 @font-face {
 font-family: 'Open Sans';
 font-style: italic;
 font-weight: 400;
 src: local('Open Sans Italic'), local('OpenSans-Italic'), 
 url 
 (http://themes.googleusercontent.com/static/fonts/opensans/v8/
 xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff)
 format('woff');
 }`

`@font-face {
font-family: 'Ubuntu';
src: url('Ubuntu-R-webfont.eot');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Ubuntu';
src: url('Ubuntu-I-webfont.eot');
font-weight: normal;
font-style: italic;
}`