Редактиране на CSS за теми

Каскадни стилови таблици (CSS) ви позволява да контролирате форматирането на вашия уебсайт. По подразбиране са налични файловете bootstrap.min.css и theme.css. Можете да редактирате съществуващите CSS файлове и да качвате нови CSS файлове. Когато качите нов CSS файл, той ще бъде наличен като уеб файл в приложението Управление на портала.

Отваряне на редактор на CSS код

За да отворите редактор на CSS код, редактирайте портала, за да го отворите в портали Power Apps Studio.

1. Изберете Тема от лявата страна на екрана. Показват се наличните теми.

   

2. Изберете желания CSS, за да го отворите в редактора на код.

3. Редактирайте кода и запишете промените.

Качване на нов CSS файл

За да качите нов CSS файл, редактирайте портала, за да го отворите в портали Power Apps Studio.

1. Изберете Тема от лявата страна на екрана. Показват се наличните теми.

2. Изберете Качване на персонализиран CSS.

   

3. Прегледайте и изберете CSS файла за качване.

Изтриване на файл по избор CSS

CSS файловете се съхраняват като уеб файлове.

1. За да премахнете CSS файл, отидете на Приложение за управление на портали и изберете Уеб файлове.

2. Намерете записа на CSS файл. Може да се наложи да филтрирате Име и уебсайт стойности, за да намерите правилния запис.

3. След като бъде избран записът на уеб файл, изберете Изтрий.

4. В порталното студио изберете Конфигурация за синхронизиране за да изчистите промените в стила от персонализирания CSS.

Разбиране на рамка за начално зареждане

Bootstrap представлява клиентска платформа, която включва CSS и JavaScript компоненти за общи интерфейсни елементи на уеб приложения. Тя включва стилове за навигационни елементи, формуляри, бутони и интерактивни системи за мрежово оформление, които позволяват оформлението на сайта да се регулира динамично към устройства с различен размер на екрана, като телефони и таблети. С помощта на системата за оформление на Bootstrap можете да създавате общ сайт, който представлява подходящ интерфейс за всички устройства, които клиентите ви може да използват.

Шаблоните, включени в порталите се прилагат с помощта на стандартни компоненти на Bootstrap, с минимални допълнителни потребителски стилове. Така че, когато прилагате шаблоните, можете да се възползвате от опциите за персонализиране на Bootstrap. Можете бързо да персонализирате темата (шрифтове, цветове и т. н.) по начин, който се прилага последователно в целия портал.

Персонализирайте Bootstrap

Bootstrap поддържа персонализиране чрез набор от променливи. Можете да зададете някои или всички от тези променливи към стойности по избор и след това да изтеглите потребителска версия на Bootstrap, съставена въз основа на тези стойности.

Силата на променливите в Bootstrap е, че те не диктуват стила на отделния елемент. Всички стилове в платформата се основават и извеждат от тези стойности. Например, помислете за променливата @font-size-base. Това задава размер, който Bootstrap присвоява на нормален текст. Въпреки това Bootstrap също използва тази променлива, за да покаже размера на шрифта за заглавия и други елементи. Размерът за H1 елемент може да бъде определен като 300 процента от размера на @font-size-base. С поставяне на тази една променлива, можете да контролирате целия печатарски мащаб на вашия портал по последователен начин. По същия начин променливата @link-color контролира цвета на хипервръзките. За цвета, който присвоите на тази стойност, Bootstrap ще определи цвета на връзките при преминаване над тях с мишката като 15 процента по-тъмен от потребителската стойност.

Стандартният начин за създаване на персонализирана версия на Bootstrap е чрез официалния сайт на Bootstrap. Въпреки това, благодарение на популярността на Bootstrap, много сайтове на трети страни също са били създадени за тази цел. Тези сайтове може да предоставят по-лесен начин за използване на интерфейса за персонализация на Bootstrap, или предварително проектирани версии на Bootstrap за изтегляне. Официалният сайт на Bootstrap персонализатора предоставя повече информация за персонализирането на Bootstrap.

Когато изтегляте персонализирана версия на Bootstrap, тя съдържа следната структура на директориите.

css/
    |-- bootstrap.min.css 
img/
    |-- glyphicons-halflings-white.png 
    |-- glyphicons-halflings.png 
js/ 
    |-- bootstrap.min.js

Или, в зависимост от използваното приложение за персонализиране, тя може да съдържа само bootstrap.min.css. Независимо от това, bootstrap.min.css е файлът, който съдържа вашите персонализации. Останалите файлове са едни и същи за всички персонализирани версии на Bootstrap и вече са включени във вашия портал.

Вижте също

• разширен CSS в портали на Power Apps
• Разширена разработка от страна на клиента