# Підключення CSS стилей в шаблон

## Как подключить CSS стили в шаблон?

Существует 3 способа подключения стилей: &#x20;

1. В RezOn BO в разделе Сайт выбрать опцию "Добавить шаблон" и нажать кнопку "Таблица CSS стилей". Далее указать необходимые правки непосредственно в шаблоне и нажать кнопку "Сохранить":

![](https://827122301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGVHTd4I_c9f2PfJ3fE%2F-Lhu-An_6Y6n7vxZUMT7%2F-Lhu1CvkHiA9ATpYHSSR%2Fimage.png?alt=media\&token=2ef1d552-9199-414c-ae07-a220f81e7c06)

![](https://827122301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGVHTd4I_c9f2PfJ3fE%2F-Lhu6M52g70_C9RSabX8%2F-LhuI22eAvpnH_pF5tu1%2Fimage.png?alt=media\&token=590763b2-5bf4-46cb-add7-ff5555755ea8)

2\. В RezOn BO в разделе Сайт выбрать опцию "Добавить шаблон" и нажать кнопку "Таблица CSS стилей". Далее указать импорт на внешний файл стилей @import url("имя файла") \[типы носителей]; и нажать кнопку "Сохранить":

![](https://827122301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGVHTd4I_c9f2PfJ3fE%2F-Lhu6M52g70_C9RSabX8%2F-LhuL1CLggU0a9hnHZTY%2Fimage.png?alt=media\&token=9708c6ab-8816-4e4b-897b-08cfaa6c8df6)

![](https://827122301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGVHTd4I_c9f2PfJ3fE%2F-Lhu6M52g70_C9RSabX8%2F-LhuJUJdiaua5VLtNhqZ%2Fimage.png?alt=media\&token=77175000-3981-490b-b82f-a369aab0f8e1)

3\. В RezOn BO в разделе Сайт выбрать опцию "Добавить шаблон" и нажать кнопку "Шаблон сайта". Далее можно изменить шаблон, в том числе добавить сторонние файлы стилей, после чего нажать кнопку "Сохранить"

![](https://827122301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGVHTd4I_c9f2PfJ3fE%2F-Lhu6M52g70_C9RSabX8%2F-LhuL5IVcyJzoh5u8K39%2Fimage.png?alt=media\&token=b62f6a2b-3bdc-4e85-9589-601761affbe8)

![](https://827122301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LGVHTd4I_c9f2PfJ3fE%2F-Lhu6M52g70_C9RSabX8%2F-LhuKWZBwX7KAk96qatX%2Fimage.png?alt=media\&token=3b0d27ed-8c63-48a9-ae52-52c4a5956063)

Чтобы избежать мигания стилей (когда сначала грузятся общие стили, а за тем кастомные), необходимо кастомные стили с большей специфичностью добавить непосредственно в шаблон сайта. Обернув стили в тег `<style>`&#x20;

```
<style type="text/css">
	body {
		background: #fff;
	}
</style>
```

{% hint style="danger" %}
Не рекомендуется в CSS переопределять свойства heght, max-height для селекторов html, body, #main поскольку это может привести к неправильной работе скрипта автообновления высоты IFrame
{% endhint %}
