#html #css
#HTML #css
Вопрос:
Я создаю веб-сайт и хотел использовать шрифт ‘Lato’, поэтому я добавил ссылку на шрифты Google в свой html и css, но когда я открываю свой веб-сайт, он находится в Helvetica. Я не могу решить проблему.
html,
body {
background-color: #fff;
color: #000000;
font-family: 'Lato', 'Arial', sans-serif;
font-weight: 300px;
font-size: 20px;
text-rendering: optimizeLegibility;
overflow-x: hidden;
scroll-behavior: smooth;
}
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
Комментарии:
1. Я считаю, что вы могли бы привести рабочий пример. Мы не знаем, как ваш html продолжается.
2. Это фактическое положение вашего css в html? Если это так, ваш css должен быть внутри
<style>
тега внутри<head>
3. Одна из проблем, которую я вижу во фрагменте @MSclavi, заключается в том, что вес шрифта сбрасывается до 400, потому что, по-видимому, Lato недоступен в 300. Итак, я думаю, могут ли быть обстоятельства, при которых невозможность использования Lato 300 может привести к отображению другого шрифта?
4. Какой тип шрифта вы видите во фрагменте?
Ответ №1:
Возможно, есть проблема с вашими тегами в html-файле, но здесь у вас есть фрагмент вашего кода, который работает.
html,
body {
background-color: #fff;
color: #000000;
font-family: 'Lato', 'Arial', sans-serif;
font-weight: 300px;
font-size: 20px;
text-rendering: optimizeLegibility;
overflow-x: hidden;
scroll-behavior: smooth;
}
<html lang="en">
<meta charset="utf-8">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
</head>
<body>
<span>Hello</span>
</body>
</html>