Skip to main content

Визуальное оформление сайта работающего на платформе "Открытый регион"

По умолчанию платформа "Открытый регион" предлагает единое визуальное оформление для всех расположенных на ней сайтов. Мы попробуем немного разнообразить наше оформление. Делать это мы будем с помощью CSS.

CSS — язык каскадных стилей, который задаёт визуальное оформление для HTML, SVG и других языков разметки.

Для применения CSS нам необходимо на главной странице перейти по ссылке Редактировать анкету сайта - далее идем во вкладку дизайн портала и в поле подключаемые стили css вставляем свой код CSS.

image.png

image.png

image.png

Текст по ширине страницы, красная строка.

Для форматирования текста по ширине странице мы применим свойство text-align: justify, а для применения красной строки свойство text-indent: 1.5em (сделать отступ в первой строке абзаца равный 1.5em). Описываемые свойства по умолчанию будут применятся на все абзацы в размещаемых материалах (дополнительно делать разметку внутри материалов не требуется).

Указание размеров в em означает, что они задаются относительно шрифта, и какой бы ни был шрифт у пользователя — крупный (на большом экране) или мелкий (на мобильном устройстве), эти размеры останутся пропорциональными.

Код:

<style type="text/css">
    .detail__text p,
    .static-detail p {
        text-align: justify;
        text-indent: 1.5em;
    }
</style>