CSS
Text Formatting

HTML provides limited facilities for text formatting, whereas, CSS provides complete text formatting presentation and style.

Text Color

Text color is changed by specifying any color to color property. The color value can be pecified as hexadecimal code like #00DDFF or a named color value like red.

Basic Syntax:
Copy Code 


h1 { color: red; }
Example:
Copy Code 


<!doctype html>  
<html>
    <head>
        <title>...</title>
    </head>
  
    <body>
       <h1 style="color: #00DDFF;">PHPDocs</h1>
    </body>
    </html>

Typeface

Typeface is used to specify the font-family of the text.

The browser will keep going down the list of specified faces until it finds one that is installed on the system. If no font in the list is installed on the system, a font similar to the specified face will be used.

Basic Syntax:
Copy Code 
h2 { font-family: Verdana, Arial, Helvatica;}
Example:
Copy Code 


<!doctype html>  
<html>

    <head>
        <title>...</title>
    </head>
  
    <body>
       <h2 style="font-family: Verdana, Arial, Helvatica;">PHPDocs</h2>
    </body>

    </html>

Text Size

CSS can be used to specify the text size. HTML can display text of size 7 at maximum. In CSS, font-size property is used to specify the size of text.

The size can be specified by using different units that are as follows:

  • Units: points (like 50pt, 70pt etc) and pixels (like 43px, 52px etc)
  • Predefined Keywords: small, medium, large etc
  • Percentage: 2%, 5% etc
Using Point:
Copy Code 


p{ font-size: 50pt; }
Using Pixel:
Copy Code 


p{ font-size: 43px; }
Using Keyword:
Copy Code 


p{ font-size: large;}
Using Percentage:
Copy Code 


p{ font-size: 700%; }