CSS font-weight thicker than 900?

Question

Tengo un panel que puede ampliarse o minimizarse a través de un enlace centrado verticalmente con un símbolo < o> como texto de enlace. En font-weight: 900 esto no se destaca mucho, incluso con un gran fondo gris a su alrededor. No quiero usar una imagen y, con el tamaño de fuente actual, ambos símbolos ocupan actualmente el ancho máximo del panel.

¿Hay alguna manera de espesar la línea en los símbolos más allá de 900? ¿O hay otra alternativa que podría usar?

Gracias de antemano.

Richard

Answer 1

Desafortunadamente no hay font-weight más grueso que 900, y especificando la fuente-peso por número varía en todos los navegadores. Su mejor opción sería usar una fuente más gruesa: no ha especificado lo que está usando, pero Impact es relativamente grueso y alto para su ancho, al tiempo que es seguro para la red. De lo contrario, podría usar @ font-face para cargar una fuente diferente.

Answer 2

En CSS 3 que hay otra manera de hacer que el tamaño de fuente más audaz:

color:#888888;  
text-shadow: 2px 0 #888888; 
letter-spacing:2px; 
font-weight:bold; 

EDIT:

Por una especie de extraña razón esto no se ve tan bonito como lo hizo a través de una Hace años. Solo funciona con text-shadow de 1px (en las fuentes más comunes, otras fuentes más gruesas aún pueden funcionar con 2px). Y con la sombra de texto de solo 1px, no hay necesidad de espaciado de letras tan grande.

color:#888888;  
text-shadow: 1px 0 #888888; 
letter-spacing:1px; 
font-weight:bold; 

Answer 3

Esto es bastante grueso. Pero funciona solo con webkit.

font-size: -webkit-xxx-large; 
font-weight: 900; 

Answer 4

Para añadir a la respuesta Gogutz, puede ir aún más audaz apilando las sombras de texto en una cuadrícula. Coma separa cada uno en la línea:

.extra-bold { 
    text-shadow: 0px 1px, 1px 0px, 1px 1px; 
}