CSS font-weight più spessa di 900?

Question

Ho un pannello che può essere espanso o ridotto a icona tramite un collegamento centrato verticalmente con un simbolo < o> come testo del collegamento. A font-weight: 900 questo non risale molto, anche con un grande sfondo grigio attorno ad esso. Non voglio usare un'immagine e, alla dimensione del carattere corrente, entrambi i simboli occupano attualmente la larghezza massima del pannello.

C'è un modo per addensare la linea sui simboli oltre 900? O c'è un'altra alternativa che potrei usare?

Grazie in anticipo.

Richard

Answer 1

Purtroppo non c'è font-weight più spessa di 900, e specificando font-weight per numero varia tra i browser. La soluzione migliore sarebbe utilizzare un carattere più spesso - non hai specificato cosa stai usando, ma Impact è relativamente spesso e alto per la sua larghezza pur essendo sicuro per il web. Altrimenti puoi usare @ font-face per caricare un font diverso.

Answer 2

In CSS 3 c'è un altro modo per rendere la dimensione del carattere più audace:

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

EDIT:

per una sorta di strano motivo questo non sembra bella come ha fatto nel corso di una anno fa. Funziona solo con text-shadow di 1px (sui font più comuni, altri font più spessi potrebbero funzionare con 2px). E con text-shadow di solo 1px, non c'è bisogno di una spaziatura di lettere così grande.

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

Answer 3

Questo è abbastanza spesso. Funziona solo con il webkit.

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

Answer 4

Per aggiungere al Gogutz risposta, si può andare ancora più audace impilando il testo-ombra in una griglia. Virgola separati ciascuno sulla linea:

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