Text formatting

introduction

• Introduction to CSS
• How and where to write CSS?
• CSS Selectors
• Size and Other Units of Measurement
• CSS colors
• Other uses of colour

Formatting Text

• CSS Fonts
• Text formatting

Box Model

• Borders
• Margins
• Paddings
• Height and width
• The box model
• Outline

Advanced selectors

• Combinators
• Pseudo–classes
• Pseudo Elements

More about CSS

• Linking style sheets to a page
• Applying CSS
• CSS comments
• Background
• Overflow
• Float
• Opacity

To get more look and feel of the text, we will use text formatting properties to style the text.

There are few text formatting properties those are:

1. text- color: It is used to set to color to the text. We can set the color in different ways like name, hexadecimal, rgb values.

Syntax:

body{
  color:color name;
}

Here whatever is there in body element, the entire text will get the defined color.

2. text-alignment: It is used to set the alignment of the text horizontally only. The text can be set to left, right, centered, or justified. If we set justified then the text will stretch to touch the left and right edges if the text is less.

Syntax:

body{
	text-align:alignment type;
}

3. text-decoration: It is used to remove decoration of the text. Those decorations can be underline, overline, line-through or none.

Syntax:

body{
  text-decoration:decoration type;
}

4. text-transformation: It is used to set the case of the text. Transformation be like uppercase or lowercase, or capitalise. Capitalise means changing the first letter of the each into uppercase.

Syntax:

body{
  text-transform:type;
}

5. text-indentation : this property is used to indent the first line of the paragraph. The size can be in px, cm, pt. 

Syntax:

body{
  text-indent:size;
}

6. letter-spacing: This property is used to specify the space between the characters of the text. The size can be given in px.  

Syntax:

body{
  letter-spacing:size;
}

7. line-height: This property is used to set the space between the lines.

Syntax:

body{
  line-height:size;
}

8. text- direction : Text direction property is used to set the direction of the text. The direction can be set by using rtl(right to left) . Left to right is the default direction of the text. 

Syntax:

body{
  direction:rtl;
}

9. text- shadow : Text shadow property is used to add shadow to the text. You can specify the horizontal size, vertical size and shadow color for the text. 

Syntax:

body{
  text-shadow:horizontal size vertical size color name;
}

10. word-spacing : Word spacing is used to specify the space between the words of the line. The size can be given in px.

Syntax:

body{
  word-spacing:size;
}