2014-08-12 04:03:16 +00:00
|
|
|
---
|
|
|
|
title: Google Webfonts
|
2020-07-03 12:47:47 +00:00
|
|
|
intro: |
|
|
|
|
Short snippets on using [Google Webfonts](https://google.com/fonts) in a web page.
|
2014-08-12 04:03:16 +00:00
|
|
|
---
|
|
|
|
|
|
|
|
### Link tag
|
|
|
|
|
2020-07-03 12:47:47 +00:00
|
|
|
<!-- prettier-ignore -->
|
|
|
|
```html
|
|
|
|
<link href="http://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" type="text/css" />
|
|
|
|
```
|
2014-08-12 04:03:16 +00:00
|
|
|
|
|
|
|
### CSS import
|
|
|
|
|
2020-07-03 12:47:47 +00:00
|
|
|
<!-- prettier-ignore -->
|
|
|
|
```css
|
|
|
|
/* One font */
|
|
|
|
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
|
|
|
|
|
|
|
|
/* Combining multiple fonts */
|
|
|
|
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400italic|Montserrat:400,700'');
|
|
|
|
```
|
|
|
|
|
|
|
|
Great for using with [Codepen.io](https://codepen.io/) or similar websites!
|