Adding More Slant To Italic Text

Question

I was curious as to if you can impact italic text with more of a slant with CSS? If so, how can this be accomplished?

Answer 1

With standard font-style in CSS, it is not possible to customise the italic state.

This is up to the browsers own preference and the fonts italic state.

Answer 2

You can also use

font-style: oblique 50deg;

(you can change 50 to what angle you want)

Answer 3

You can simulate a custom slant with CSS3 skew transformations (although it will not look as great as a real italic font).

Here's an example:

HTML:

<p class="slant">Some text</p>

CSS

.slant {
    -moz-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(30deg, 0deg);
    -webkit-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(30deg, 0deg);
    -o-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(30deg, 0deg);
    -ms-transform: scale(1) rotate(0deg) translate(0px, 0px) skew(30deg, 0deg);
    transform: scale(1) rotate(0deg) translate(0px, 0px) skew(30deg, 0deg);
}