<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Fonts in CSS</title> <style> body{ font-family: Arial, Helvetica, sans-serif; font-size: 20px; line-height: 1.6em; } #welcome p span{ font-weight: bold; } #about p span{ font-style: italic; } </style> </head> <body> <div id="welcome"> <h2 class="primary-heading">Welcome</h2> <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. <span> Eius praesentium laboriosam ratione molestiae nobis, nisi quod laudantium aliquid accusamus</span> expedita!</p> </div> <div id="about"> <h2>About</h2> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. <span> Cumque enim natus ad? Mollitia alias repudiandae </span>iusto molestias voluptatum, dolores eius.</p> </div> </body> </html>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter