How to import Google Fonts in HTML ?
Choosing the right font for your webpage is a very important aspect of any design. Using a web font service enables you to use a wide variety of fonts fit for presenting the data in your webpage. Google Fonts is a free web font service which hosts a huge variety of fonts to choose from. We can use these fonts in our webpages.
To use a custom font, we need to import the font family from the web font service, Google Fonts, in this case.
Method-1: Using <link> tag
<link href=’https://fonts.googleapis.com/css?family=Sofia’ rel=’stylesheet’/>
Method-2: Using @import rule
@import url(‘https://fonts.googleapis.com/css?family=Poppins’);
Example-1:
<html> <head> <link href= rel='stylesheet' /> <style> h1 { font-family: Sofia; color: green; } </style></head> <body> <center> <h1>GeeksforGeeks</h1> </center></body> </html> |
Output:
Example:
<html> <head> <style> @import url( h1 { font-family: 'Open Sans', serif; color: green; } </style></head> <body> <center> <h1>GeeksforGeeks</h1> </center></body> </html> |
Output:
Please Login to comment...