{"id":81,"date":"2010-11-05T23:41:39","date_gmt":"2010-11-05T18:41:39","guid":{"rendered":"http:\/\/www.zubair.info\/blog\/?p=81"},"modified":"2019-08-13T19:40:29","modified_gmt":"2019-08-13T14:40:29","slug":"css-font-style-oblique-vs-italic","status":"publish","type":"post","link":"https:\/\/www.zubair.info\/blog\/2010\/11\/05\/css-font-style-oblique-vs-italic.html","title":{"rendered":"CSS font-style: oblique vs italic"},"content":{"rendered":"

\"css <\/p>\n

What’s the difference between CSS’s oblique vs italic?<\/h3>\n

Oblique<\/strong> type (or slanted, sloped) is a form of type that slants slightly to the right, used in the same manner as italic type. Unlike italic type, however, it does not use different glyph shapes; it uses the same glyphs as roman type, except distorted. (Wikipedia<\/a>)<\/p><\/blockquote>\n

I was very curious to find out what’s the real difference between an Oblique style and a Italic style used in font-style CSS property. I’ll be sharing what i found about the differences. Visually<\/em>, the difference can be sometime hard to notice. The Oblique Style<\/strong> uses the same font as Normal<\/code> (non-italic version of the font-type \/ font-face) but skews (slants) it to the right a-little before presenting it to the screen – it looks less readable than the true<\/strong> Italic<\/code> version. While the Italic Style<\/strong> uses a Italic<\/code> type\/version<\/strong> of the font, most of the time almost all fonts have a Italic<\/code> version of the font which has special characters defined for it. But that is not Always<\/em> the case, some times the Font Designer doesn’t provide those and only provides the Normal<\/code> version of the font. \"css<\/a> So if you are using Italic<\/code> on a font-type (font-face) that doesn’t have its own true<\/strong> Italic<\/code> version of the font, it will automatically use the Oblique<\/code> version which just uses the regular version of the font but skews \/ slants it a-little to the right so it appear as if it were the Italic<\/code> version but i think it would be called more like a fake<\/strong> Italic<\/code>. Please comment and let me know if i missed something or if you found this post helpful – OR if there is anything i can do to improve the post \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"

What’s the difference between CSS’s oblique vs italic? Oblique type (or slanted, sloped) is a form of type that slants slightly to the right, used in the same manner as italic type. Unlike italic type, however, it does not use different glyph shapes; it uses the same glyphs as roman type, except distorted. (Wikipedia) I […]<\/p>\n","protected":false},"author":1001009,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[46],"tags":[98,48,47,49,50,51,52,53],"class_list":["post-81","post","type-post","status-publish","format-standard","hentry","category-css","tag-css","tag-css-property","tag-css-style","tag-font-style","tag-fonts","tag-italic","tag-obliqued","tag-web-design"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/posts\/81","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/users\/1001009"}],"replies":[{"embeddable":true,"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/comments?post=81"}],"version-history":[{"count":0,"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/posts\/81\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/media?parent=81"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/categories?post=81"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.zubair.info\/blog\/wp-json\/wp\/v2\/tags?post=81"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}