Is it possible to get cut out text effect like this using CSS/CSS3 only? or image is the only option to get this effect.
views:
101answers:
4
+1
A:
You can use the text-shadow style to set a shadow for the top left corner. It will look close to what you are looking for, but as far as I know there is no way to do exactly what you are looking for in CSS/CSS3
Samuel
2010-10-19 12:14:13
+3
A:
text-shadow is your friend. See this page for lots of examples what you can achieve with it. Example #8 looks promising.
Aaron Digulla
2010-10-19 12:21:38
+1 Thanks for the link
metal-gear-solid
2010-10-19 12:24:06
This will come in handy for me too someday! Thanks! +1
Tom
2010-10-19 12:36:40
A great link - thanks for sharing.
Ken Ray
2010-10-19 12:49:12
A:
What you really need for that particular effect is inset:
text-shadow: inset #000 0 0 0.10em; /* THIS DOESN'T WORK */
Unfortunately: " is the same as defined for the ‘box-shadow’ property except that the ‘inset’ keyword is not allowed."
robertc
2010-10-20 12:38:14
A:
Yes you can achieve this effect with CSS and text, but it's a little insane. Basically you create a bunch of grey-zero css3 radial and linear gradients with a zero opacity and carefully position them over your text. But you'd be better off doing this in photoshop.
Michael Mullany
2010-10-21 23:37:44