13.11.2016
Добавлю для себя быстрое подключение шрифтов Google (Open Sans, Roboto, Ubuntu, Montserrat, Cuprum), просто потому что надоело постоянно брать их с сайта fonts.google.com. Если кому-то пригодится, то берите, мне не жалко.
Google font Open Sans
//Добавляем к body или к нужному элементу
font-family: 'Open Sans', sans-serif;
//Добавляем в <head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap" rel="stylesheet">
//Или добавляем в самый верх файла стилей css
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');
Ссылка — https://fonts.google.com/specimen/Open+Sans
Google font Roboto
//Добавляем к body или к нужному элементу
font-family: 'Roboto', sans-serif;
//Добавляем в <head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
//Или добавляем в самый верх файла стилей css
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
Ссылка — https://fonts.google.com/specimen/Roboto
Google font Ubuntu
//Добавляем к body или к нужному элементу
font-family: 'Ubuntu', sans-serif;
//Добавляем в <head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap" rel="stylesheet">
//Или добавляем в самый верх файла стилей css
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap');
Ссылка – https://fonts.google.com/specimen/Ubuntu
Google font Montserrat
//Добавляем к body или к нужному элементу
font-family: 'Montserrat', sans-serif;
//Добавляем в <head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
//Или добавляем в самый верх файла стилей css
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');
Ссылка — https://fonts.google.com/specimen/Montserrat
Google font Cuprum
//Добавляем к body или к нужному элементу
font-family: 'Cuprum', sans-serif;
//Добавляем в <head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Cuprum:wght@400;700&display=swap" rel="stylesheet">
//Или добавляем в самый верх файла стилей css
@import url('https://fonts.googleapis.com/css2?family=Cuprum:wght@400;700&display=swap');
Ссылка — https://fonts.google.com/specimen/Cuprum
Подключить несколько шрифтов можно так:
//Добавляем к body или к нужному элементу
font-family: 'Open Sans', sans-serif;
font-family: 'Roboto', sans-serif;
//Добавляем в <head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Roboto:ital,wght@0,700;1,300&display=swap" rel="stylesheet">
//Или добавляем в самый верх файла стилей css
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Roboto:ital,wght@0,700;1,300&display=swap');