You probably have written a couple of HTML and CSS files by now. The font applied to your text is not as appealing to your eyes and you want to play around with a couple of options till you find the right one. You're in the right place then.
Google Fonts is a rich library of fonts where you can pick from almost one thousand Font Families and even more font styles. To get started with Google Fonts, simply add this line at the top of your CSS file that you will use to style your text;
@import url("https://fonts.googleapis.com/css?family="Family+name"&display=swap");
where "Family name" is the name of the font family you have chosen after browsing through Google Fonts' list.
Note that whenever a font has a Family name made up of more than one word, the words are separated by a + sign.
To apply the font to your content add the "font-family" property to your selector like this:
.text{
font-family: "Family name";
}
where "Family name" is the family name of the chosen Font.
An important thing to note is that while writing the family name on the link at the top of the file we do not use quotation around the name but while applying it to the CSS selector, we use quotation marks.
Top comments (0)