|
Let's see what we how we can change the attributes of the text we have on our website with Cascading Style Sheets.
With a style sheet you can align text, change text color, underline text and much more.
Let's start by defining the text color.
Below we have examples of different ways of changing text color by using the color property.
body {color #FFFFFF}
h1 {color: #000000}
h2 {color: red}
p {color: rgb(255,0,0)}
|
The color value can be a hex number #FFFFFF, color name (red), a rgb value (rgb(255,0,0)).
With this example we have set the text color for the body of the document, then the h1 and h2 headers and finally
we have given the paragraph tag another color.
Sometimes we run into situations where we want to text to be in a certain spot on our website or in a table for example.
We can use the text-align property to accomplish this
Text align has three different values;
left aligns text to the left
center aligns text to the center
right aligns text to the right
|
How about underlining text. We can use the text-decoration property to help us out
|
p {text-decoration: underline}
|
Text align has three different values;
underline places a line under the text
overline places a line over the text
line-through places a line through the text
|
Text transform. This property allows you to have uppercase or lowercase text and capitalize text.
|
p {text-transform: uppercase}
|
Text align has three different values;
capitalize Each word of text will start with a capital letter
uppercase All text will have capital letters
lowercase All text is in lower case letters
|
| 
