tipografia-css-comparativa-estandar-estandares

Muchas veces encontramos tipografías, decimos, «son muy bonitas». Pero a la hora de usarlas en el blog/sitio web nos llevamos una decepción. Y es que se ven distintas según el sistema operativo que utilicemos. Para evitar esto aquí os dejamos algunas tipografías estándares, con una comparativa de cada fuente estándar por sistema operativo que podéis ver en la ilustración del principio de la entrada. Si conoces otras, por favor, ponla en los comentarios.

Os mostramos el código CSS de las tipografías estándares:

Impact

impact

.classname {
color: #333333;
font-family: Impact, Charcoal, sans-serif;
}

Palatino Linotype

palatino-linotype

.classname {
color: #333333;
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
}

Tahoma

tahoma

.classname {
color: #333333;
font-family: Tahoma, Geneva, sans-serif;
}

Century Gothic

century-gothic

.classname {
color: #333333;
font-family: Century Gothic, sans-serif;
}

Lucida Sans Unicode

lucida-sans-unicode

.classname {
color: #333333;
font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
}

Arial Black

arial-black

.classname {
color: #333333;
font-family: 'Arial Black', Gadget, sans-serif;
}

Times New Roman

times-new-roman

.classname {
color: #333333;
font-family: 'Times New Roman', Times, serif;
}

Arial Narrow

arial-narrow

.classname {
color: #333333;
font-family: 'Arial Narrow', sans-serif;
}

Verdana

verdana

.classname {
color: #333333;
font-family: Verdana, Geneva, sans-serif;
}

Copperplate Gothic Light

copperplate-gothic-light

.classname {
color: #333333;
font-family: Copperplate / Copperplate Gothic Light, sans-serif;
}

Lucida Console

lucida-console

.classname {
color: #333333;
font-family: 'Lucida Console', Monaco, monospace;
}

Gill Sans

gill-sans

.classname {
color: #333333;
font-family: Gill Sans / Gill Sans MT, sans-serif;
}

Trebuchet MS

trebuchet-ms

.classname {
color: #333333;
font-family: 'Trebuchet MS', Helvetica, sans-serif;
}

Courier New

courier-new

.classname {
color: #333333;
font-family: 'Courier New', Courier, monospace;
}

Arial

arial

.classname {
color: #333333;
font-family: Arial, Helvetica, sans-serif;
}

Georgia

georgia

.classname {
color: #333333;
font-family: Georgia, Serif;
}

Vía | Cosassencillas