Med alle de nye CSS3 border ting som skjer (-webkit
, ...) er det nå mulig å legge til en kant til skriften din? (Som den solide hvite kanten rundt den blå Twitter-logoen). Hvis ikke, er det noen ikke altfor stygge hacks som vil oppnå dette i CSS / XHTML, eller trenger jeg fortsatt å fyre opp Photoshop?
Du kan kanskje emulere en tekststrek, ved hjelp av css text-shadow
(eller -webkit-text-shadow
/-moz-text-shadow
) og en veldig lav uskarphet:
#element
{
text-shadow: 0 0 2px #000; /* horizontal-offset vertical-offset 'blur' colour */
-moz-text-shadow: 0 0 2px #000;
-webkit-text-shadow: 0 0 2px #000;
}
Men selv om dette er mer allment tilgjengelig enn -webkit-text-stroke
-egenskapen, tviler jeg på at det er tilgjengelig for flertallet av brukerne dine, men det kan ikke være et problem (grasiøs degradering og alt det der).
Jeg prøvde en gang å gjøre de runde hjørnene og slippe skygger med css3. Senere fant jeg ut at det fortsatt er dårlig støttet (Internet Explorer(s), selvfølgelig!)
Jeg endte opp med å prøve å gjøre det i JS (HTML lerret med IE Canvas), men det påvirker ytelsen mye (selv på C2D-maskinen min). Kort sagt, hvis du virkelig trenger effekten, bør du vurdere JS-biblioteker (de fleste av dem skal kunne kjøre på IE6), men ikke gjør det for mye på grunn av ytelsesproblemer; hvis du fortsatt trenger et alternativ ... kan du bruke SFiR, deretter PS det og SFiR det. CSS3 er ikke klar i dag.