Design of font style property by CSS
CSS font code generator
Fonts are important part of our html page. We can manage the style property of our fonts using style sheet. We will use internal style sheet to set the property values of our fonts. We will discuss each font property here and its possible values. At the end you can see the demo and html code of the style sheet used.
Font Family
Let us start with font type or family by saying what style of font to be used. We can use any supported font. Here is how we will set the font family using CSS.P { font-family: "New Century Schoolbook", Times, serif }Font Colour
P { color:#ff80ff; }Font Style
We will try to set the font style by using font-style property.It can take values as normal, italic and oblique
P { font-style: oblique }Font Weight
We will set the weight of the font. We can have values100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | normal | bold | bolder | lighter
Here is one example on how to set font-weight
P { font-weight: 800 }Font Size
We can set relative or absolute font size for the text.P { font-size: 12pt }
P { font-size: x-large }
P { font-size: 60% }Font variant
We can be used to display fonts in two options one is normal and other is SMALL-CAPS
P { font-variant: small-caps}We can adjust the gap between lines ( line spacing ) by using line-height.
P{ line-height:1.7em}DEMO : Font Style using internal Style
Now here is the total style code
<style>
P { font-family: 'New Century Schoolbook', Times, serif ;
font-style: oblique;
font-weight: 800 ;
font-size: 48px ;
font-variant: small-caps;
}
</style>HTML Link without Underline Border Style using CSS
This article is written by plus2net.com team.
