index.html

---
layout: single
property_name: font
---

<section id="font" class="property property--shorthand">
  <header class="property-header">
    <nav class="property-links">
      <a class="property-links-direct" href="{{site.url}}/property/font/" data-property-name="font" data-tooltip="Single page for this property" target="_blank">Pop out</a>
      <a class="property-share" data-tooltip="Share on Twitter or Facebook" data-property-name="font">Share</a>
      <a target="_blank" href="https://developer.mozilla.org/en/docs/Web/CSS/font" data-tooltip="See on Mozilla Developer Network" rel="external">MDN</a>
    </nav>
    <h2 class="property-name">
      <a href="{{site.url}}/#font"><span>#</span>font</a>
    </h2>
    <div class="property-description">
      <p>Shorthand property for <code class="shorthand"><a class="hash" href="{{site.url}}/#font-style" data-property-name="font-style">font-style</a></code> <code class="shorthand"><a class="hash" href="{{site.url}}/#font-variant" data-property-name="font-variant">font-variant</a></code> <code class="shorthand"><a class="hash" href="{{site.url}}/#font-weight" data-property-name="font-weight">font-weight</a></code> <code class="shorthand"><a class="hash" href="{{site.url}}/#font-size" data-property-name="font-size">font-size</a></code> <code class="shorthand"><a class="hash" href="{{site.url}}/#line-height" data-property-name="line-height">line-height</a></code>  and  <code class="shorthand"><a class="hash" href="{{site.url}}/#font-family" data-property-name="font-family">font-family</a></code>.</p>

    </div>

  </header>






</section>