In Brief...
Changing text style in CSS is achieved using the text-decoration and text-transform properties. The text-decoration property is used to add effects to text, such as underlines and line-throughs. The text-transform property is used to change the capitalization of text.
Take our Introduction to CSS Training course for free.
See the Course Outline and RegisterInstructions
- You can use the following values for the
text-decorationproperty:- none
- underline
- overline
- line-through
The none value of the
text-decorationproperty can be used to remove the underline from links, as shown below:
The following shows this code in use:<a href="http://www.webucator.com" style="text-decoration: none;">Webucator</a>
This code renders the following:<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>Text-Align, Text-Decoration and Text-Indent</title> </head> <body> <h1>Text-Decoration </h1> <div style="text-decoration: none;">text-decoration:none</div> <div style="text-decoration: overline;">text-decoration:overline</div> <div style="text-decoration: underline;">text-decoration:underline</div> <div style="text-decoration: line-through;">text-decoration:line-through</div> <div><a href="http://www.webucator.com" style="text-decoration: none;">Webucator</a></div> </body> </html>
- You can use the following values for the
text-transformproperty:- none
- capitalize
- uppercase
- lowercase
The following code sample shows the effects of
text-transform:
This code renders the following:<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>Text-Transform</title> </head> <body> <h1>Text-Transform</h1> <div style="text-transform: none;">Text-Transform: None</div> <div style="text-transform: capitalize;">Text-Transform: Capitalize - this is written in all lowercase letters but is capitalized</div> <div style="text-transform: lowercase;">Text-Transform: Lowercase</div> <div style="text-transform: uppercase;">Text-Transform: Uppercase</div> </body> </html>
Need CSS Training?
Webucator provides instructor-led training to students throughout the US and Canada. We have trained over 90,000 students from over 16,000 organizations on technologies such as Microsoft ASP.NET, Microsoft Office, XML, Windows, Java, Adobe, HTML5, JavaScript, Angular, and much more. Check out our complete course catalog.