| | | HTML source code for displaying font size values |
|
|
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body { padding: 24px; }
span:before { content: attr(style); }
</style>
</head>
<body>
<span style="font-size: 16px;"></span>
<p>
<span style="font-size: xx-small;"></span><br/>
<span style="font-size: x-small;"></span><br/>
<span style="font-size: small;"></span><br/>
<span style="font-size: medium;"></span><br/>
<span style="font-size: large;"></span><br/>
<span style="font-size: x-large;"></span><br/>
<span style="font-size: xx-large;"></span>
</p>
<p>
<span style="font-size: smaller;"></span><br/>
<span style="font-size: larger;"></span><br/>
<span style="font-size: 1em;"></span><br/>
<span style="font-size: 100%;"></span>
</p>
</body>
</html>
|
|
|
|
| Related examples in the same category |
| 1. | Font Property and Purpose | | | | 2. | 'font' Example | | | | 3. | font shortcut | | | | 4. | Font shortcut: font: bold italic 2em Georgia, Times, "Times New Roman", serif; | | | | 5. | font: 1em/1.5 Georgia, serif | | | | 6. | font: bold 1em/1.5 Verdana, sans-serif | | | | 7. | font: italic 1em/1.5 Georgia, serif; | | | | 8. | Font color | | | | 9. | font: status-bar | | | | 10. | font: small-caption | | | | 11. | font: message-box | | | | 12. | font: menu | | | | 13. | font: caption; | | | | 14. | font: icon; | | | | 15. | font: menu; | | | | 16. | font: message-box; | | | | 17. | font: small-caption; | | | | 18. | font: status-bar; | | | | 19. | font: italic small-caps bold 1.5em/3em sans-serif; | | | | 20. | font: 32px "Monotype Corsiva"; | | | | 21. | font: 16px sans-serif; | | | | 22. | font: bold 24px sans-serif; | | | | 23. | font: italic bold small-caps 24px sans-serif; | | | | 24. | font: 16px monospace; | | | | 25. | This font is 1.2 times the default font, or 20 pixels. | | | | 26. | font-size is inheritable | | | | 27. | Making font size smaller and smaller | | | | 28. | This font size is 50% bigger | | | | 29. | This font size is 25% smaller | | | | 30. | font style | | | | 31. | font style no italic no oblique | | | | 32. | font style oblique italic | | | | 33. | Generic font | | | | 34. | Multiple fonts | | | | 35. | Using system font | | | | 36. | Font properties | | | | 37. | HTML code for displaying generic font families | | | | 38. | Using font sizes in pixels for alignment | | | | 39. | Using keyword font property values | | | | 40. | Change font size with inline style | | | | 41. | Font inheritance | | | | 42. | Font size inheritance | | | | 43. | CSS Built-in Fonts | | | | 44. | CSS1 Font Properties Example | | | | 45. | This demonstrates the use of the font-variant: small-caps; effect. | | | | 46. | Relative font size | | | | 47. | Test font at 100% | | | | 48. | font: 12px sans-serif; | | | | 49. | font-family: monospace; | | | | 50. | font-variant: small-caps; | | | | 51. | h4 font-weight: normal; | | | | 52. | Using inline style to control font size for span | | | | 53. | first-child font-weight: bold; | | | | 54. | This font is 1 em in size and sans-serif. | | | | 55. | Font style shortcut | | | | 56. | Use font | | | | 57. | This font is italic, small-caps, bold, 1em in size, with a 1.5 em line height and a sans-serif font. | | | | 58. | make text that's italic, bold, small-caps,24 pixel sans-serif, which looks like a comic book font | | | | 59. | Overlay font | | | | 60. | font color 2 | | | | 61. | System font: caption | | | | 62. | System font: icon | | | | 63. | System font: menu | | | | 64. | System font: message-box | | | | 65. | System font: small-caption | | | | 66. | System font: status-bar | | |
|