Redigeeri CSS-i kujunduste jaoks

Artikkel
12/21/2023

Märkus

Alates oktoobrist 2022 on Power Appsi portaalide nimi Power Pages.
Alates 26. veebruarist 2024 kõrvaldatakse Power Appsi pärandportaalide stuudio kasutuselt. Oma veebisaitide redigeerimiseks kasutage selle asemel Power Pagesi kujundusstuudiot. Lisateave: Power Appsi portaalide stuudio kõrvaldatakse kasutuselt
Selles teemas käsitletakse pärandfunktsioone. Värskeimat teavet leiate Microsoft Power Pagesi dokumentatsioonist.

Kaskaadlaadistike (CSS) abil saate kontrollida oma veebisaidi vormingut. Failid bootstrap.min.css and theme.css on vaikimisi saadaval. Saate olemasolevaid CSS-faile redigeerida ja uusi CSS-faile üles laadida. Uue CSS-faili üleslaadimisel on see portaali haldamise rakenduses saadaval veebifailina.

Oluline

Power Appsi portaalid põhinevad Bootstrapi versioonil 3.3.x, välja arvatud Sündmuse portaal. Portaali arendajad ei tohiks asendada Bootstrap 3 muude CSS-teekidega, kuna mõni Power Appsi portaali stsenaarium sõltub Bootstrap 3.3.x-st. Lisateavet leiate Mõista Bootstrap raamistikku ja Kohanda Bootstrap jaotiseid selles artiklis.

Koodiredaktori avamine CSS

Koodiredaktori CSS avamiseks redigeerige portaali , et avada see portaalides Power Apps Studio.

Valige Kujundus ekraani vasakust servast. Kuvatakse saadaolevad kujundused.
Valige soovitud CSS, et see koodiredaktoris avada.
Muutke koodi ja salvestage muudatused.

Uue faili üleslaadimine CSS

Uue CSS faili üleslaadimiseks redigeerige portaali , et avada see portaalides Power Apps Studio.

Valige Kujundus ekraani vasakust servast. Kuvatakse saadaolevad kujundused.
Valige Laadi üles kohandatud CSS.
Sirvige ja valige üleslaaditav CSS-fail.

Kohandatud CSS faili kustutamine

CSS-failid salvestatakse veebifailidena.

CSS-faili eemaldamiseks minge portaali haldamise rakendusse ja valige suvand Veebifailid.
Otsige üles CSS-faili kirje. Õige kirje leidmiseks peate võib-olla filtreerima väärtusi Nimi ja Veebisait.
Kui veebifailikirje on valitud, valige suvand Kustuta.
Valige portaalistuudios suvand Sünkrooni konfiguratsioon, et eemaldada kohandatud CSS-i stiilimuutused.

Bootstrap raamistiku mõistmine

Alglaadur on eesraamistik, mis sisaldab CSS ja JavaScript komponente tüüpilise veebirakenduse liidese elementide jaoks. See sisaldab navigeerimiselementide, vormide ja nuppude laade ning ruudustiku tundlikku paigutussüsteemi, mis võimaldab saidi paigutustel erineva ekraanisuurusega seadmetega (näiteks telefonide ja tahvelarvutitega) dünaamiliselt kohaneda. Alglaaduri paigutussüsteemi kasutamisega on võimalik arendada üks sait, mis pakub sobivat liidest kõigile seadmetele, mida teie kliendid kasutada võivad.

Portaalidega kaasnevad mallid juurutatakse kasutades standartseid Algalduri komponente koos minimaalselt lisatud kohandatud stiilidega. Seega saate mallide rakendamisel kasutada ära Algalduri kohandamisvõimalusi. Saate kujundust (fonte, värve jne) kiiresti kohandada, nii et see rakendub ühtlaselt kogu portaalis.

Kohanda Algaldur

Algaldur toetab kohandamist muutujate komplekti kaudu. Võite määrata ühele või kõigile muutujatele kohandatud väärtused ja siis laadida alla kohandatud versioon Algaldurist, mis on kohandatud neid väärtuiseid silmas pidades.

Algalduri muutujate võimsus seisneb selles, et nad ei määra ühegi elemendi stiili. Kõik raamistiku laadid luuakse ja tuletatakse nende väärtuste põhjal. Näiteks võtke arvesse muutuja @font-size-base. See määrab suuruse, mille Alglaadur rakendub tavapärasele kehatekstile. Siiski kasutab alglaadur seda muutujat ka pealkirjade ja muude elementide kirjasuuruse määramiseks. Elemendi H1 suurus võib olla määratletud kui 300 protsenti elemendi @font-size-base suurusest. Selle ühe muutuja määramisega juhite portaali kogu tüpograafilist skaalat ühtsel viisil. Sarnaselt kontrollib @link-color muutuja hüperlinkide värvi. Sellele väärtusele määratud värvi puhul määratleb Algaldur linkide kohal hõljumise värviks kohandatud väärtusest 15 protsenti tumedama.

Tavapärane viis Algaldurist kohandatud versiooni loomiseks on läbi ametliku Algalduri saidi. Tänu Algalduri populaarsusele on selleks loodud ka palju muude tootjate saite. Need saidid võivad Algalduri kohandamiseks pakkuda hõlpsamini kasutavat liidest või pakkuda allalaadimiseks Algalduri eelkujundatud versiooni. Ametlik Algalduri kohandaja saidilt leiate lisateavet Algalduri kohandamise kohta.

Kui laadite alla Algaldurii kohandatud versiooni, sisaldab see järgmist kataloogistruktuuri.

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

Olenevalt kasutatavast kohandaja rakendusest võib see sisaldada ka ainult faili bootstrap.min.css. Sellest olenemata on kohandusi sisaldavaks failiks bootstrap.min.css. Muud failid on kõigi kohandatud Algalduri versioonide puhul samad ja kuuluvad juba sinu portaali.

Vt ka

Märkus

Kas saaksite meile dokumentatsiooniga seotud keele-eelistustest teada anda? Osalege lühikeses uuringus. (Uuring on ingliskeelne.)

Uuringus osalemine võtab umbes seitse minutit. Isikuandmeid ei koguta (privaatsusavaldus).

Jagamisviis: