Add Google Fonts using @import in CSS
In this approach, we are using the @import rule in your CSS file to import the Google Fonts, and then apply it to the desired elements.
Syntax:
@import url('https://fonts.googleapis.com/css?family=Lobster');
Example 1: Here we are using the @import method to add different Google fonts in our code example.
HTML
<!DOCTYPE html> < html > < head > < title >CSS Google Fonts</ title > < style > @import url( 'https://fonts.googleapis.com/css2?family=Roboto|Pacifico&display=swap'); h1 { font-family: 'Lobster', cursive; } p { font-family: 'Pacifico', cursive; } </ style > </ head > < body > < h1 >w3wiki</ h1 > < p >A Computer Science Portal..!</ p > </ body > </ html > |
Output:
Contact Us