Css Text Formatting And Font

Text Align

The text-align property is used for given alignment to text inside the inline or block elements. Text-align properties are different values: left, center, right, justify and interit;

  • Lefttext-align left is default value. Content are started from left side of element.
  • RightContent is started from right side of element.
  • CenterContent are center from left side and right side of element.
  • JustifyContent are cover left side edge and right side edge of element.
  • InheritThis value would be depend on the parent div text-align properties.
h1{
text-align: left; 
}
p{
text-align: justify; 
}

Text Color

Color property is used for give color to text inside the element.
Use text color different type values:
Hexadecimal value: #111111;
Color name value: Black;
RGB value: RGB(0, 0, 0);

h1{color:#111111;}
p{color: #444444;}

Text Decoration

Text-decoration property is used for decorations to text inside the element. If we remove the underlines from the link element, here we use this property.

a{
text-decoration:none;
}

Text decoration other values are: underline, overline, line-through or inherit. Underline gives line at its baseline of the text, overline give line above the text, line-through give line over the text and inherit as usual depend on the parent element decoration.

h1{
text-decoration:underline;
}
h2{
text-decoration:overline;
}
h3{
text-decoration:line-through;
}
h4{
text-decoration:inherit;
}

Text Transform

Text-transform property is used for uppercase and lowercase letter in a text. Text-transform has also different values:

  • Capitalize
    Transform the first letter of each word to uppercase.

    Text-transform: capitalize;
    
  • lowercase
    Transform the all letters into lowercase.

    Text-transform: lowercase;
    
  • uppercase
    Transform the all letters into Uppercase.

    Text-transform: uppercase;
    
  • none
    no effected on words.

    Text-transform: none;
    

Leave a Comment.