Not all of the properties are recognized by all browsers.
Text transformation would have been better labelled capitlization, because that is what it controls: the capitilazation of the text. It has values of uppercase, lowercase, capitalize, normal with normal being the default. Normal in this instance means whatever the designer types is not changed. I hope uppercase and lowercase are self-explanatory. Here is one example of each of the values used with the same paragraph. With the exception of the value of the attribute at the end of the paragraph all four paragraphs were typed identically.
Normal in this instance means whatever the designer types is not changed. I hope uppercase and lowercase are self-explanatory. This paragraph is set text-transform:normal.
Normal in this instance means whatever the designer types is not changed. I hope uppercase and lowercase are self-explanatory. This paragraph is set text-transform:uppercase.
Normal in this instance means whatever the designer types is not changed. I hope uppercase and lowercase are self-explanatory. This paragraph is set text-transform:lowercase.
Normal in this instance means whatever the designer types is not changed. I hope uppercase and lowercase are self-explanatory. This paragraph is set text-transform:capitalize.
Text decoration can add a little variety to the text on the page. At least one of the attribute values is annoying. The default is none. This paragraph is set text-decoration:none
Text decoration can add a little variety to the text on the page. At least one of the attribute values is annoying. The default is none. This paragraph is set text-decoration:overline
Text decoration can add a little variety to the text on the page. At least one of the attribute values is annoying. The default is none. This paragraph is set text-decoration:underline
Text decoration can add a little variety to the text on the page. At least one of the attribute values is annoying. The default is none. This paragraph is set text-decoration:line-through
Text decoration can add a little variety to the text on the page. At least one of the attribute values is annoying. The default is none. This paragraph is set text-decoration:blink
Text direction should be fairly obvious. Do you want the text to be read from left to right (European languages) or right to left (Hebrew, Arabic and others)? Language codes and browser defaults can and will override these instructions.
Text direction should be fairly obvious. Do you want the text to be read from left to right (European languages) or right to left (Hebrew, Arabic and others)? Language codes and browser defaults can and will override these instructions. Even with the appropriate style set, my browser will not reverse this paragraph.
Control of white space can sometimes be crucial to a page design, and sometimes be irrelevant. The default is to let the browser decide, which is generally a reasonable choice. But there are four other choices: nowrap, pre, pre-wrap, pre-line. Setting white space to pre has the same effect as the pre element in HTML: whatever spaces are typed in the text will be respected by the viewing agent (the browser). It has the added freedom that pre can be used with any element. It is a style attribute, not a block element.
Setting white space to pre has the same effect as the pre element in HTML: whatever spaces and line breaks (presses of the ENTER key) are typed in the text will be respected by the viewing agent (the browser). It has the added freedom that pre can be used with any element. It is a style attribute, not a block element. With added spaces and using white-space: pre .
Setting white space to nowrap means the text will not wrap at the edge of the browser window. It will continue as a long line of text until the element is closed or a <br /> is introduced. Nowrap forces the viewer to scroll to the right, not usually something viewers like to do. With added spaces and using white-space: nowrap .
pre-wrap is new in CSS2.1. Setting white space to pre-wrap means the text will wrap at the edge of the browser window. And it means the pre-typed spaces and line breaks are suppposed to be respected by browsers will continue as a long line of text until the element is closed or a line break is introduced. This forces the viewer to scroll to the right, not usually something viewers like to do. With added spaces and using white-space: pre-wrap .
pre-line is also new in CSS2.1. It collapses any multiple spaces typed between words into one space between each pair of words. However it does respect any line breaks (presses of the ENTER key) typed into the text. It also wraps at the edge of the browser window. With added spaces and using white-space: pre-line .
Not all of the properties are recognized by all browsers.