Beispiel:Em-font-size.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche 
<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">
    <title>em-Angaben für Schriftgrößen</title>
    <style>
:root { font-size: 1em; }
ul { font-size: 1.25em; }
aside ul { 
  font-size: 1.25rem; 
  color: red;
}
p { font-size: 1em; }
div {
  display:grid;
 grid-template-columns: 1fr 1fr;
  gap: 1em;
}
    </style>
  </head>
  <body>
<h1>vererbte Schriftgrößen mit <code>em</code>, bzw. Angaben mit <code>rem</code></h1>

<div>
    <ul>
      <li>Möbel nach Ihren Wünschen
        <ul>
          <li>Küchenmöbel</li>
          <li>Regale und Schrankwände</li>
            <ul>
              <li>Sperrholz</li>
              <li>Furnier</li>
              <li>Massivholz</li>
            </ul>
          <li>Badezimmermöbel</li>
        </ul>
      </li>
      <li>Haustüren</li>
      <li>Gartenzäune</li>
      <li>Reparaturen</li>
    </ul>
<aside>
    <ul>
      <li>Möbel nach Ihren Wünschen
        <ul>
          <li>Küchenmöbel</li>
          <li>Regale und Schrankwände</li>
            <ul>
              <li>Sperrholz</li>
              <li>Furnier</li>
              <li>Massivholz</li>
            </ul>
          <li>Badezimmermöbel</li>
        </ul>
      </li>
      <li>Haustüren</li>
      <li>Gartenzäune</li>
      <li>Reparaturen</li>
    </ul>
<aside>
</div>
<p>Zum Vergleich: „normale“ Schriftgröße von <code>1em</code>.</p>
  </body> 
</html>
Abgerufen von „http://wiki.selfhtml.org/index.php?title=Beispiel:Em-font-size.html&oldid=89872“