Remember that the sizes in em or percentage are more cascadable because they adjust their sizes according to the the different devices i.e. the sizes become smaller or larger according to the devices.
CSS Fonts
Fonts are actually different type faces of the text. They include the font-size, font-family, font-variant, font-weight, font-style and color of the fonts.
font-size
The font-size property defines the size of the font. The size may be defined in px, em units. Size of the fonts can also be defined by the percentage(%) value.
font-weight
font-weight defines the stroke thickness(blackness). The values of font-wight increase from 100 to 900. And as a result the darkness (stroke thickness) increases from 100 to 900.
Example
NORMAL
font-wight:400;
OR
font-wight:normal;
BOLD
font-weight:700;
OR
font-weight:bold;
font-style
font-style defines the style of text. It represents normal, italic and oblique text.
When oblique is not available, it selects italic font.
font-family
It represents a list of family names separated by comma. This list also contains generic family at the end.
Example
<style>
div{font-family:family-name,family-name,generic-family;}
div{font-family:papyrus,"Curlz MT",sans;}
</style>
Try </>
Comma separated values are alternative. The next values are the alternatives to the current ones. Alternative means if one font is not available, then the next font will be used. If the next is also not available then the next to it will be used. If none of the fonts is available, then the generic family will be used.
generic-family includes only five families such as serif, sans-serif, cursive, fantasy and monospace.
family names include many types of fonts. For example, Curlz MT and papyrus, geo sans light etc. You may use google fonts for your website.
color
This CSS property defines the color of the text. The value may be in rgb or hexadecimal.
Example
<style>
p{color:red;}
p{color:rgb(255,0,0);}
p{color:#ff0000;}
</style>
Try </>
The above three values define the same color i.e. red.
Next Previous
Was this article helpful?
