index.html

--- layout: single property_name: font-style ---<section id="font-style" class="property"><header class="property-header"><nav class="property-links"><a class="property-links-direct" href="{{site.url}}/property/font-style/" data-property-name="font-style" data-tooltip="Single page for this property" target="_blank">Link</a> <a class="property-share" data-tooltip="Share on Twitter or Facebook" data-property-name="font-style">Share</a> <a target="_blank" href="https://developer.mozilla.org/en/docs/Web/CSS/font-style" data-tooltip="See on Mozilla Developer Network" rel="external">MDN</a></nav><h2 class="property-name"><a href="{{site.url}}/#font-style"><span>#</span>font-style</a></h2><div class="property-description"><p>Defines how much the text is slanted.</p></div></header><style type="text/css">.font-style { font-size: 1.2em; }</style><section class="example"><header class="example-header"><p class="example-name"><code class="example-default" data-tooltip="This is the property's default value">default</code> <code class="example-value" data-tooltip="Click to copy" data-clipboard-text="font-style: normal;">font-style: normal;</code></p><div class="example-description"><p>The text is <strong>not</strong> slanted.</p></div></header><aside class="example-preview"><div class="example-browser"><i></i><i></i><i></i></div><div class="example-output"><div class="example-output-div font-style" id="font-style-normal">Hello world</div></div></aside><style type="text/css">#font-style-normal{ font-style:normal;}</style></section><section class="example"><header class="example-header"><p class="example-name"><code class="example-value" data-tooltip="Click to copy" data-clipboard-text="font-style: italic;">font-style: italic;</code></p><div class="example-description"><p>Use the <strong>italic</strong> version of the font: the letters are slightly slanted.</p></div></header><aside class="example-preview"><div class="example-browser"><i></i><i></i><i></i></div><div class="example-output"><div class="example-output-div font-style" id="font-style-italic">Hello world</div></div></aside><style type="text/css">#font-style-italic{ font-style:italic;}</style></section><section class="example"><header class="example-header"><p class="example-name"><code class="example-value" data-tooltip="Click to copy" data-clipboard-text="font-style: oblique;">font-style: oblique;</code></p><div class="example-description"><p>Use the <strong>oblique</strong> version of the font: the letters are more slanted than italic.</p></div></header><aside class="example-preview"><div class="example-browser"><i></i><i></i><i></i></div><div class="example-output"><div class="example-output-div font-style" id="font-style-oblique">Hello world</div></div></aside><style type="text/css">#font-style-oblique{ font-style:oblique;}</style></section></section>