If you want to use fractions (e.g. “1/2”) the “number slash number” solution is usually fine for most documents, but you can use CSS to make prettier smaller scale fractions…but is a wee cumbersome.
Note: This solution was originally developed by Lars Bruzileus
First you have to shrink the numerator and the denominator to something like 75% – the slash stays at 100%. Then you have to raise the numerator up slightly (by .5 ex). You can also adjust the letter spacing depending on your font.
.den {font-size: 75%;}
.num {font-size: 75%; vertical-align:.5ex}
In the HTML the code looks like this:
<span class="num">1</span>/<span class="den">7</span>
And here’s what it looks like:
1/7
Although I didn’t like CSS for superscripts, I do think they are just the trick for vulgar fractions.