Css text property

694 views
614 views

Published on

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
694
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
8
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Css text property

  1. 1. Unit III: Adding Stylesand Interactivity Using CSS and Javascript
  2. 2. The CSS text PropertiesAllow you to add layout to text. The following are the different text properties: text- indent, text-align, text- decoration, letter-spacing, and text-transform.
  3. 3. Property Description ExampleText-indent Applies first line indent to p{text-indent: 30px;} paragraphText-align Aligns text to left, right, center, or p{text-align: right;} both sides (justify) p{text-align: center;} p{text-align: justify;}Text-decoration Applies text effects namely h3{text-decoration: underline, overline and line underline;} through H2{text-decoration: overline;}Letter-spacing Specifies spacing between text h1{letter-spacing: 5px;} characters p{letter-spacing: 2px;}Text-transform Capitalizes the first letter of each h2{text-transform: word (capitalize), converts all uppercase;} letters to uppercase (uppercase), li{text-transform: to lowercase (lowercase) or lowercase;} displays text as it appears in the HTML code (none)
  4. 4. COMPUEXERCISES/QUIZ1. Write the CSS code to align text to the center.2. Write the CSS code to underline a text.3. Write the CSS code to converts all letters to uppercase.4. Write the CSS code to set the spacing to 15px.5. Write the CSS code to indent a paragraph t0 25px.
  5. 5. ANSWER1. {text-align: center ;}2. {text-decoration: underline ;}3. {text-transform: uppercase ;}4. {letter-spacing: 15px ;}5. {text-indent: 25px ;}

×