Show Output
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Example of CSS @font-face rule</title> <style> @font-face { font-family: "OpenSans"; src: url("/examples/fonts/OpenSans-Regular.eot"); src: url("/examples/fonts/OpenSans-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: "OpenSansBold"; src: url("/examples/fonts/OpenSans-Bold.eot"); src: url("/examples/fonts/OpenSans-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; } h1 { font-family: "OpenSansBold", Arial, sans-serif; /* Specify the OpenSans bold font */ } p { font-family: "OpenSans", Arial, sans-serif; } </style> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html>
