font-stretch

  • Revision slug: CSS/font-stretch
  • Revision title: font-stretch
  • Revision id: 19308
  • Created:
  • Creator: Ptak82
  • Is current revision? No
  • Comment pl

Revision Content

{{template.CSSRef()}}

Summary

The font-stretch property selects a normal, condensed, or extended face from a font family.

  • {{template.Xref_cssinitial()}}: {{template.Cssxref("normal")}}
  • Applies to: all elements
  • {{template.Xref_cssinherited()}}: Yes
  • Percentages: N/A
  • Media: {{template.Xref_cssvisual()}}
  • {{template.Xref_csscomputed()}}: specified value (except for initial and inherit)

Syntax

With absolute keyword values
font-stretch: normal ;
font-stretch: {{mediawiki.external('<code>ultra-condensed</code> | <code>extra-condensed</code> | <code>condensed</code> | <code>semi-condensed</code>')}} ;
font-stretch: {{mediawiki.external('<code>semi-expanded</code> | <code>expanded</code> | <code>extra-expanded</code> | <code>ultra-expanded</code>')}} ;
With relative keyword values
font-stretch: {{mediawiki.external('<code>wider</code> | <code>narrower</code>')}} ;

Values

normal
Specifies a normal font face.
semi-condensed, condensed, extra-condensed, ultra-condensed
Specifies a font face condensed than normal, with ultra-condensed as the most condensed.
semi-expanded, expanded, extra-expanded, ultra-expanded
Specifies a font face expanded than normal, with ultra-expanded as the most expanded.
wider
Relative keyword 'wider' sets the value of font face to the next expanded value above the inherited value. (but not expanded than ultra-expanded)
narrower
Relative keyword 'narrower' sets the value of font face to the next condensed value below the inherited value. (but not condensed than ultra-condensed)

Examples

{{template.CSSRefExampleLink("font-style")}} (FIXME)

h1 { font-stretch: extra-expanded }
p { font-stretch: narrower}

Notes

WARNING: This CSS property is NOT YET IMPLEMENTED, see {{template.Bug(3512)}} for latest status of the enhancement request.

Specifications

Browser compatibility

See also

{{wiki.template('CSS_Reference:Fonts')}}

{{ wiki.languages( { "fr": "fr/CSS/font-stretch", "pl": "pl/CSS/font-stretch" } ) }}

Revision Source

<p> 
{{template.CSSRef()}}
</p>
<h3 name="Summary"> Summary </h3>
<p>The <b>font-stretch</b> property selects a normal, condensed, or extended face from a font family.  
</p>
<ul><li> {{template.Xref_cssinitial()}}: {{template.Cssxref("normal")}}
</li><li> Applies to: all elements
</li><li> {{template.Xref_cssinherited()}}: Yes
</li><li> Percentages: N/A
</li><li> Media: {{template.Xref_cssvisual()}}
</li><li> {{template.Xref_csscomputed()}}: specified value (except for initial and inherit)
</li></ul>
<h3 name="Syntax"> Syntax </h3>
<dl><dt>With absolute keyword values</dt><dd>
</dd><dd><code>font-stretch:</code> <code>normal</code> ;
</dd><dd><code>font-stretch:</code> {{mediawiki.external('&lt;code&gt;ultra-condensed&lt;/code&gt; | &lt;code&gt;extra-condensed&lt;/code&gt; | &lt;code&gt;condensed&lt;/code&gt; | &lt;code&gt;semi-condensed&lt;/code&gt;')}} ;
</dd><dd><code>font-stretch:</code> {{mediawiki.external('&lt;code&gt;semi-expanded&lt;/code&gt; | &lt;code&gt;expanded&lt;/code&gt; | &lt;code&gt;extra-expanded&lt;/code&gt; | &lt;code&gt;ultra-expanded&lt;/code&gt;')}} ;
</dd></dl>
<dl><dt>With relative keyword values</dt><dd>
</dd><dd><code>font-stretch:</code> {{mediawiki.external('&lt;code&gt;wider&lt;/code&gt; | &lt;code&gt;narrower&lt;/code&gt;')}} ;
</dd></dl>
<h3 name="Values"> Values </h3>
<dl><dt>normal 
</dt><dd>Specifies a normal font face.
</dd></dl>
<dl><dt>semi-condensed, condensed, extra-condensed, ultra-condensed 
</dt><dd>Specifies a font face condensed than normal, with ultra-condensed as the most condensed.
</dd></dl>
<dl><dt>semi-expanded, expanded, extra-expanded, ultra-expanded
</dt><dd>Specifies a font face expanded than normal, with ultra-expanded as the most expanded.
</dd></dl>
<dl><dt>wider
</dt><dd>Relative keyword 'wider' sets the value of font face to the next expanded value above the inherited value. (but not expanded than ultra-expanded)
</dd></dl>
<dl><dt>narrower
</dt><dd>Relative keyword 'narrower' sets the value of font face to the next condensed value below the inherited value. (but not condensed than ultra-condensed)
</dd></dl>
<h3 name="Examples"> Examples </h3>
<p>{{template.CSSRefExampleLink("font-style")}} (FIXME)
</p>
<pre>h1 { font-stretch: extra-expanded }
p { font-stretch: narrower}
</pre>
<h3 name="Notes"> Notes </h3>
<p><b>WARNING:</b> This CSS property is <b>NOT YET IMPLEMENTED</b>, 
see {{template.Bug(3512)}}
for latest status of the enhancement request.
</p>
<h3 name="Specifications"> Specifications </h3>
<ul><li><a class="external" href="http://www.w3.org/TR/CSS2/fonts.html#propdef-font-stretch">CSS 2 fonts</a>
</li><li><a class="external" href="http://www.w3.org/TR/css3-fonts/#font-stretch">CSS 3 fonts</a>
</li></ul>
<h3 name="Browser_compatibility"> Browser compatibility </h3>
<h3 name="See_also"> See also </h3>
<p>{{wiki.template('CSS_Reference:Fonts')}}
</p>{{ wiki.languages( { "fr": "fr/CSS/font-stretch", "pl": "pl/CSS/font-stretch" } ) }}
Revert to this revision