Pregunta

I tienen un panel que se puede ampliar o reducir al mínimo a través de un enlace centrada verticalmente con un símbolo como el texto del enlace. En font-weight: 900 esto no destacan mucho, incluso con un gran fondo gris alrededor de él. No quiero usar una imagen y, al tamaño de fuente actual, los dos símbolos tienen actualmente hasta la anchura máxima del panel.

¿Hay alguna forma para espesar la línea de los símbolos más allá de 900? O hay otra alternativa que pueda usar?

Gracias de antemano.

Richard

¿Fue útil?

Solución

Desafortunadamente no hay font-peso más grueso que 900, y especificando la fuente-peso por número varía a través de los navegadores. Su mejor opción sería utilizar un tipo de letra más gruesa - no ha especificado lo que estás usando, pero el impacto es relativamente grueso y alto para su anchura mientras que ser compatible con Web. De lo contrario podría usar @ font-face a la carga en una fuente diferente.

Otros consejos

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

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

EDIT:

Para obtener algún tipo de extraña razón esto no se ve tan bonito como lo hizo hace más de un año. Sólo funciona con el texto-sombra de 1 píxel (en la mayoría de las fuentes comunes, otras fuentes más gruesas posible que aún trabajo con 2px). Y con sombra de texto de sólo el 1 píxel, no hay necesidad de una gran espaciado entre letras tales.

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

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

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

Se puede usar sombra de texto en lugar de font-weight

text-shadow: 0px 1px, 1px 0px, 1px 0px;

Esto es bastante grueso. Pero sólo funciona con webkit.

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

introducir descripción de la imagen aquí

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top