Mokymo priemonė: Pasirinktinio stiliaus CSS įtraukimas į svetainę
Stiliaus darbo sritis leidžia redaguoti kai kurias svetainės temos funkcijas, pvz., šriftus ir spalvas, tačiau galite taikyti savo pasirinktines temas CSS .
Galite sukurti savo temą apibrėždami pasirinktinį CSS failą ir įkeldami jį į svetainę.
Šioje mokymo priemonėje sužinosite, kaip:
- Nusiųsti pasirinktinį CSS failą
- Redaguoti CSS Visual Studio Code žiniatinkliui
Būtinosios sąlygos
- Power Pages prenumeratos ar bandomosios versijos. Gauti Power Pages bandomąją versiją čia.
- „Power Pages“ svetainė sukurta. Kurti Power Pages portalą.
- Pasirinktinės temos failas, sukurtas naudojant jūsų parankinių rengyklę CSS .
Pastaba.
Bet kuri jūsų sukurta pasirinktinė tema turi būti suderinama su "Bootstrap v3".
Įtraukti pasirinktinę CSS į svetainę
Toliau pateiktame vaizdo įraše rodoma, kaip svetainėje taikyti CSS pasirinktinį kodą.
Šiame pavyzdyje įtrauksime kelis pasirinktinius failus, CSS kurie leis mums į mūsų svetainės mygtukus įtraukti papildomų atributų. Galite naudoti savo pasirinktinį failą CSS arba pateiktą pavyzdį.
Norėdami sukurti pavyzdį, savo parankinių CSS rengyklėje sukurkite button_shadow.css pasirinktinės temos failą ir įrašykite.
.button1 { box-shadow: 0 9px 18px 0 #333333, 0 8px 24px 0 #333333; }Eikite į Power Pages.
Pasirinkite svetainę, į kurią norite įtraukti pasirinktinę temą, ir pasirinkite "Redaguoti".
Atidarykite Stiliaus darbo srities naudojimas.
Pasirinkite temą ir pasirinkite ... (elipses), ir tada pasirinkite Valdyti CSS.
Pasirinktinio CSS skyriaus dalyje pasirinkite Nusiųsti ir pasirinkite pasirinktinį CSS failą. Vienu metu galima nusiųsti CSS tik vieną failą, tačiau galima nusiųsti kelis failus. Jei keli CSS failai atnaujina tą patį atributą CSS , bus taikomi failo atributai sąrašo apačioje. Galite koreguoti pasirinktinių failų tvarką CSS .
Turėtumėte iškart peržiūrėti naujinimų rezultatus puslapių drobėje.
Galite išjungti ir perkelkite pasirinktinių failų tvarką CSS . Paskutinį kartą pateiktas failas bus virš jo, o ne kiti.
Failą galite redaguoti tiesiogiai CSS pažymėdami eleksesą (...), o tada pasirinkdami Redaguoti kodą. Šiuo veiksmu bus atidarytas žiniatinklio rengyklės vaizdinis kodas. Pasirinkite CTRL-S kad įrašytumėte keitimus.
Dizaino studio pasirinkite "Sync" ir atnaujinkite CSS pakeitimus bei peržiūrėkite pakeitimus.
Pasirinkite "Peržiūra ", kad peržiūrėtumėte pasirinktinę temą svetainėje.
Pastaba.
Norėdami visiškai pašalinti pasirinktinę temą, panaikinkite žiniatinklio failo įrašą programoje "Portal Management".