The
font
property is used as a shorthand to specify the font the browser uses to render characters.
The possible values.
Values | Description |
---|
<font-style> <font-variant> <font-weight> <font-size>/ <line-height> <font-family> | |
caption | icon | menu | message-box | small-caption | status-bar | |
inherit | inherited from the parent |
example
font: italic small-caps 600 15pt/18pt Arial, serif
font: 110% "Times New Roman", Garamond, serif
font: 110%/120% "Courier New", fantasy
snippet
<html>
<head>
<style>
ol {font-family:Arial;}
ul {font-family:Verdana;}
</style>
</head>
<body>
<ul>The 'font' property
<li style="font: italic small-caps 600 15pt/18pt Arial, serif;">italic</li>
<li style="font: oblique border 0.2in/0.3in Arial, serif;">oblique</li>
<li style="font: 20px/28px fantasy">20px/28px fantasy</li>
<li style="font: 150%/200% Verdana">150%/200% Verdana</li>
<li style="font: 1.1pc cursive">1.1pc cursive</li>
</ul>
</body>
</html>
Output
The 'font' property - italic
- oblique
- 20px/28px fantasy
- 150%/200% Verdana
- 1.1pc cursive