Text Shadows using CSS3

Text shadow always give a cool looking effect to some text.
A text with some kind of shadow is more attractive than a text without any shadow.

Heading

Heading

Now the question is How to add shadows to some text?
This is, for what you are here :P.

The above code snippet will look like this: http://css3wdesign.net16.net/shadow.html

We can add following values to the textssible color values

Value	Description
h-shadow	Required. The position of the horizontal shadow. Negative values are allowed
v-shadow	Required. The position of the vertical shadow. Negative values are allowed
blur	Optional. The blur distance
color	Optional. The color of the shadow. Look at CSS Color Values for a complete list of possible color values

The default position to set all values, place all these values is, as it is given in the above table.
like:

---

There are some of CSS3 generators can also do these things for you:
http://css3gen.com/text-shadow/
http://css3generator.com (I've posted a small tutorial to run this generator in my first post. To check, Click Here.

Read more

All CSS Text Styling Properties

Property	Detail	Example
color	Specifies the color of a text.	http://css3wdesign.net16.net/color.html
direction	Specifies the text direction/writing direction	http://css3wdesign.net16.net/direction.html
letter-spacing	Increases or decreases the space between characters in a text	http://css3wdesign.net16.net/spacing.html
line-height	Sets the line height	http://css3wdesign.net16.net/height.html
text-align	Specifies the horizontal alignment of text	http://css3wdesign.net16.net/aligned.html
text-decoration	Specifies the decoration added to text	http://css3wdesign.net16.net/decorate.html
text-indent	Specifies the indentation of the first line in a text-block	http://css3wdesign.net16.net/indent.html
text-shadow	Specifies the shadow effect added to text	Text Shadows using CSS3
text-transform	Controls the capitalization of text	http://css3wdesign.net16.net/transform.html
unicode-bidi	Used together with the direction property to set or return whether the text should be overridden to support multiple languages in the same document	http://css3wdesign.net16.net/unicode-bidi.html
white-space	Specifies how white-space inside an element is handled	http://css3wdesign.net16.net/white-space.html
word-spacing	Increases or decreases the space between words in a text	http://css3wdesign.net16.net/word-spacing.html

Downlaod all Examples.Click Here.

Read more

Text Properties in CSS

The color property in CSS is used to change the color of text.
Color specification is as same as described in Changing background color using CSS.(check for reference)

To select a specific color for text on whole page, it is described in the body selector.
We can specify separate color for each selector as well.

Text Alignment

The text-aling property is used to set the horizontal alignment of any text. It's values can be center, left, right and justify. 

Have a look on some paragraphs: 

http://css3wdesign.net16.net/aligned.html

Text Decoration:

Text decoration property is used to set or remove decorations from the texts. 

This property is mostly used to remove underlines from the links for designing purposes. 

However, we can do a lot with this like, Line-Through, over-line, under-line.

The syntax to use this property is given below:

http://css3wdesign.net16.net/decorate.html

Text Transformation:

Text Transformation property is used to specify uppercase and lowercase letters in a text. 

We can also capitalize a paragraph, if we want. 

http://css3wdesign.net16.net/transform.html

Want to download all example's files to test on your browser? Click Here.

Want to check more examples of CSS Text Properties? Click Here.

Read more