Is there CSS for typesetting the LaTeX logo in HTML?

Question

I'm looking for css equivalent to the LaTeX macro that will produce a beautifully typeset LaTeX logo within an HTML document via css. That is,

<p>This web site uses <span class="latex">LaTeX</span> to generate the PDF version of this web page.</p>

The CSS probably should replace the roman characters TeX with Greek (and use the right font via web fonts if possible) etc.

Surely I can not be the first person to want to do this …

question from:https://stackoverflow.com/questions/8160514/is-there-css-for-typesetting-the-latex-logo-in-html

Answer 1

A Google search lead me to TeX and LaTeX logo POSHlets.

The solution involves:

    .tex sub, .latex sub, .latex sup {
      text-transform: uppercase;
    }

    .tex sub, .latex sub {
      vertical-align: -0.5ex;
      margin-left: -0.1667em;
      margin-right: -0.125em;
    }

    .tex, .latex, .tex sub, .latex sub {
      font-size: 1em;
    }

    .latex sup {
      font-size: 0.85em;
      vertical-align: 0.15em;
      margin-left: -0.36em;
      margin-right: -0.15em;
    }

<p><span class="tex">T<sub>e</sub>X</span> and 
<span class="latex">L<sup>a</sup>T<sub>e</sub>X</span></p>