Skip to content

Commit 6be3551

Browse files
authored
faq-styling: various improvements
1 parent ee9a1d1 commit 6be3551

File tree

1 file changed

+12
-12
lines changed

1 file changed

+12
-12
lines changed

content/docs/faq-styling.md

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,51 @@
11
---
22
id: faq-styling
3-
title: Стили и CSS
3+
title: Стилизация и CSS
44
permalink: docs/faq-styling.html
55
layout: docs
66
category: FAQ
77
---
88

9-
### Как мне добавить CSS классы в компоненты? {#how-do-i-add-css-classes-to-components}
9+
### Как добавить CSS-классы в компоненты? {#how-do-i-add-css-classes-to-components}
1010

1111
Передайте в проп `className` строку:
1212

1313
```jsx
1414
render() {
15-
return <span className="menu navigation-menu">Menu</span>
15+
return <span className="menu navigation-menu">Меню</span>
1616
}
1717
```
1818

19-
Обычно CSS классы зависят от пропсов или состояния:
19+
Обычно CSS-классы зависят от пропсов или состояния:
2020

2121
```jsx
2222
render() {
2323
let className = 'menu';
2424
if (this.props.isActive) {
2525
className += ' menu-active';
2626
}
27-
return <span className={className}>Menu</span>
27+
return <span className={className}>Меню</span>
2828
}
2929
```
3030

3131
>Совет
3232
>
33-
>Если вы часто пишите такой код, пакет [classnames](https://www.npmjs.com/package/classnames#usage-with-reactjs) может упростить его.
33+
>Если вы часто пишите похожий код, то пакет [classnames](https://www.npmjs.com/package/classnames#usage-with-reactjs) поможет упростить его.
3434
35-
### Могу ли я использовать встроенные стили? {#can-i-use-inline-styles}
35+
### Как можно использовать встроенные стили? {#can-i-use-inline-styles}
3636

3737
Конечно, прочитайте [документацию об элементах DOM](/docs/dom-elements.html#style).
3838

39-
### Встроенные стили это плохо? {#are-inline-styles-bad}
39+
### Встроенные стили это плохо? {#are-inline-styles-bad}
4040

41-
CSS классы, как правило, лучше для производительности, чем встроенные стили.
41+
CSS-классы, как правило, лучше для производительности, чем встроенные стили.
4242

4343
### Что такое CSS-in-JS? {#what-is-css-in-js}
4444

45-
"CSS-in-JS" относится к паттерну, в котором CSS создаётся с использованием JavaScript, а не во внешних файлах. Почитайте сравнение CSS-in-JS библиотек [здесь](https://github.com/MicheleBertoli/css-in-js).
45+
«CSS-in-JS» — это паттерн, в котором CSS-код создаётся при помощи JavaScript, вместо того, чтобы писать его во внешних файлах. Ознакомтесь со сравнением библиотек по работе с «CSS-in-JS» в [этом репозитории](https://github.com/MicheleBertoli/css-in-js).
4646

47-
_Обратите внимание, что эта функциональность не является частью React, но она предоставляется сторонними библиотеками._ React не имеет никакого отношения к тому, как определяются стили. Если у вас есть сомнения, хорошей отправной точкой является определение ваших стилей в отдельном файле `*.css` как обычно, и обращение к ним с помощью [`className`](/docs/dom-elements.html#classname).
47+
_Обратите внимание, что данная функциональность не входит в React из коробки, а предоставляется сторонними библиотеками._ React ничего не знает про то, как определяются стили. Если вы сомневаетесь, использовать указанный выше способ, то хорошим началом станет определение стилей в отдельном файле с расширением `*.css`, как вы ранее привыкли это делать, а затем указать нужные классы с помощью [`className`](/docs/dom-elements.html#classname).
4848

49-
### Могу ли я создавать анимации в React? {#can-i-do-animations-in-react}
49+
### Можно создавать анимации в React? {#can-i-do-animations-in-react}
5050

5151
React может использоваться для создания крутых анимаций! В качестве примера посмотрите библиотеки [React Transition Group](https://reactcommunity.org/react-transition-group/) и [React Motion](https://github.com/chenglou/react-motion).

0 commit comments

Comments
 (0)