Импорт варианта шрифта в scss - React

Question

Я новичок в css, поэтому я немного запутался. Вот что я делаю в моем index.scss файле

@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:400,400i,700,800,800i,900i&display=swap');

body {
  font-family: 'Nunito Sans', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

Я хочу сделать все параграфы Nunito Sans Bold Italic. Как я могу сделать это в определенном файле сказать components/link.js

Answer 1

Чтобы все абзацы были оформлены с помощью Nunito Sans жирным шрифтом и курсивом, сначала нужно нацелиться на каждый элемент p, затем добавить семейство шрифтов и стили шрифтов, которые вам нужны. Например:

p {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: bold;
  font-style: italic;
}

Если вы хотите использовать этот CSS только в этом конкретном компоненте, создайте отдельный файл scss и импортируйте его только в этот компонент, например:

@import './link-style.scss';

Answer 2

Это может сработать

//index.scss

.paragraph {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: bold;
  font-style: italic;
}

<!--Link js -->
<p className="paragraph">
paragraph text
</p>

Answer 3

Посмотрите на свою HTML-разметку. Чтобы стилизовать некоторые конкретные элементы, попробуйте добавить к ним класс css. Чем, используя этот класс, в вашем файле scss вы сможете применить определенный шрифт. Дайте мне знать, если вам нужна дополнительная поддержка