Comment écrire une valeur de fraction en utilisant html?

Question

Je veux écrire une valeur de fraction telle que l'image ci-dessous :

Comment écrire une valeur de fraction en utilisant html sans utiliser d'image ?

REMARQUE: je ne veux pas de ce modèle 1 1/2 mais strictement comme la photo ci-dessus

Answer 1

Essayez ce qui suit :

 1<sup>1</sup>&frasl;<sub>2</sub>

Cela s'affiche comme :

1 ¹₂

Answer 2

 .frac {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    letter-spacing: 0.001em;
    text-align: center;
}
.frac > span {
    display: block;
    padding: 0.1em;
}
.frac span.bottom {
    border-top: thin solid black;
}
.frac span.symbol {
    display: none;
} 

 1 <div class="frac">
    <span>1</span>
    <span class="symbol">/</span>
    <span class="bottom">2</span>
    
</div>

Answer 3

Découvrez les éléments suivants :

 span.frac {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
}
span.frac > sup, span.frac > sub {
  display: block;
  font: inherit;
  padding: 0 0.3em;
}
span.frac > sup {border-bottom: 0.08em solid;}
span.frac > span {display: none;}

 <p>7&nbsp;<span class="frac"><sup>42</sup><span>&frasl;</span><sub>73</sub></span>.</p>

Stylo de code

Answer 4

Vous pouvez utiliser les éléments <sup> et <sub> en conjonction avec l' entité fraction slash ⁄

<sup>1</sup>&frasl;<sub>2</sub> est ¹ ⁄ ₂

MISE À JOUR : J'ai fait ce violon qui montre une fraction coupée en HTML à l'aide d'un tableau.

    <table>
      <tbody>
        <tr>
          <td rowspan="2">1</td>
          <td style="border-bottom:solid 1px">1</td>
          </tr>
          <tr>            
            <td>2</td>
          </tr>
      </tbody>
   </table>