Невозможно вставить шрифты Google в файл HTML, используя @import в файле CSS
Я пытаюсь изучить веб-дизайн, и в настоящее время я изучаю HTML и CSS. Я хочу встроить шрифт Sans-Serif от Google в мой CSS-файл, используя @import и поместив его в верхней части моего CSS-файла, чтобы изменить шрифты моей HTML-страницы. но после сохранения и открытия файла Index.html в различных веб-браузерах (Chrome, IE, Opera и т. д.) я не вижу никаких изменений шрифта. Но когда я вставляю свои коды HTML и CSS в онлайн-редактор http://codepen.io/ появляются изменения, и я вижу изменение шрифта.
Я связал файл CSS с моим файлом Index.html, используя этот код:
<head>
<link re="stylesheet" type="text/css" media="screen" href="CSS/screen.css">
</head>
и мой файл CSS содержит только код ниже:
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,700,700i');
body {font-family: 'Open Sans', sans-serif;
font-size: 16px;
font-weight: 300;
color: #555;
margin: 0;
padding: 0;}
вот мои HTML и CSS файлы:
https://drive.google.com/file/d/1nPvXFAYIYWQOM4YtZ7-iEtkUPXX8LsxP/view?usp=sharing
Что-то не так с кодами или проблема с настройками Windows? любая помощь будет высоко ценится.