Õpetus: kohandatud CSS lisamine saidile

Tööruum Tööruumi kujundamine võimaldab teil redigeerida mõnda saidi kujundusfunktsiooni, näiteks fondid ja värvid; kuid võite rakendada oma kohandatud CSS kujundusi.

Isikliku kujunduse loomiseks määratlege kohandatud CSS fail ja laadige see oma saidile üles.

Sellest õpikust saate teada, kuidas teha järgmist:

• Laadige üles kohandatud CSS fail
• Redigeeri CSS veebirakenduses Visual Studio Code

eeltingimused

• Rakenduse Power Pages kordustellimus või prooviversioon. Hangi Power Pages prooviversioon siin.
• Rakenduse Power Pages saidi loomine. Rakendusega Power Pages saidi loomine.
• Kohandatud kujunduse fail, mis on loodud teie lemmikredaktori CSS abil.

Märkus.

Kõik teie valitud kohandatud kujundused peavad olema ühilduvad rakendusega Bootstarp v3.

Kohandatud CSS-i lisamine saidile

Järgmine video näitab, kuidas rakendada kohandatud CSS koodi oma saidile.

Selles näites lisame mõned kohandatud CSS failid, mis võimaldavad meil lisada meie veebisaidil nuppudele varju efekte. Võite kasutada oma kohandatud CSS faili või kasutada loodud näidist.

1. Näidise loomiseks looge oma lemmikredaktoris CSS button_shadow.css kohandatud kujundus ja salvestage see.

   .button1 {
   box-shadow: 0 9px 18px 0 #333333, 0 8px 24px 0 #333333;
    }
   

2. Avage Power Pages.

3. Valige sait, kuhu soovite kohandatud kujunduse lisada, ja valige redigeeri.

4. Avage Kujundamis tööruum.

5. Valige kujundus ja valige ... (kolmikpunkt) ja seejärel valige Halda CSS.

   

6. Jaotises Kohandatud CSS valige suvand Laadi üles ja valige oma kohandatud CSS fail. Korraga saate üles laadida ainult ühe CSS faili, kuid üles saab laadida mitu faili. Kui mitu CSS faili värskendavad atribuuti, kehtivad loendi allosas oleva CSS faili atribuudid. Saate kohandada oma kohandatud CSS failide järjestust.

7. Peaksite kohe lehtede lõuendil värskenduste tulemusi nägema.

   

8. Saate oma kohandatud CSS failide järjestust keelata või teisaldada. Viimasena loetletud fail võtab teised oma kontrolli alla.

   

9. Saate redigeerida CSS faile, otse valides kolmikpunkti (...) ja seejärel valides Redigeeri kood. Selle sammuga avatakse visual code for web reaktor. Valige CTRL-S et salvestada muudatused.

   

10. Valige Sünkrooni kujundusstuudios et värskendada CSS ja vaadata muudatusi.

11. Valige Eelversioon, et vaadata saidil oma kohandatud kujundust.

Märkus.

Kohandatud kujunduse täielikuks eemaldamiseks kustutage veebifaili kirje portaali halduse rakendusest.