Fonts in CSS

CSS Fonts

CSS has many font properties that define different aspects of the text.

Font Family: - Use the font-family property to set the font family of a text.

For e.g.

p {

font-family: Arial, Helvetica, sans-serif;

}

Note: - If the font family has more than one word, then it will be written in double quotes ("").

like-

p {

font-family: "Times New Roman", Times, Serif;

}

Font Style: - Use the font-style property to specify the style of a text. It has three values ​​-

* normal: Text will show as usual.

* italic: text will show in italic form.

For example

p {

font-style: italic;

}

* Oblique: The oblique style text looks similar to the italic, though there are differences in both values.

Font Size: Use the font-size property to set the size of a text.

For example

<style>

p {

font-size: 48px;

}

</ style>

<p> This is a test. </ p>

Result: - This is a test

We can also give the value of font-size in cm instead of px.

Note: - 1cm = 16px

For example

p {

font-size: 32px;

}

And

p {

font-size: 2cm;

}

In both of these examples, the font-size will be the same, because 32px is equal to 2cm.

Font Weight: - Use the font-weight property to specify the weight of a font.

For example

<style>

p {

font-weight: normal;

}

</ style>

<p> This is a test </ p>

Some other values ​​of font-weight can also be.

font-weight: bold;

font-weight: lighter;

font weight: bolder;

font-weight: 200;

font-weight: inherit;

Font-Variant:

font-variant property It specifies whether a text will display in small caps font or not.

For example

<style>

p {

font-variant: small caps;

}

</ style>

<p> This is a test </ p>

Output: - THIS IS A TEST

There may be some other values ​​of font-variant.

font-variant: normal;

font-variant: initial;

font-variant: inherit;...