CSS szerkesztése témákhoz
Megjegyzés
-
- októbertől a Power Apps-portálok a Power Pages nevet kapják.
-
- február 26-tól az örökölt Power Apps-portálok stúdió megszűnik. Ehelyett használja a Power Pages tervezőstúdiót webhelyei szerkesztéséhez. További információ: Power Apps-portálok stúdió megszűnése
- Ez a témakör az örökölt képességekre vonatkozik. A legfrissebb információkért menjen a Microsoft Power Pages-dokumentációhoz.
Az egymásra épülő stíluslapok (CSS) segítségével szabályozhatja webhelye formázását. Alapértelmezés szerint a bootstrap.min.css és theme.css fájlok érhetők el. A létező CSS fájlokat szerkesztheti, és új CSS fájlokat tölthet fel. Egy új CSS fájl feltöltésekor a fájl a Portálfelügyelet alkalmazásban webfájlként válik elérhetővé.
Fontos
Power Apps a portálok a Bootstrap 3.3. x verzión alapulnak, kivéve az Eseményportál. A portál fejlesztői nem helyettesíthetik a Bootstrap 3-at más CSS-tárakkal, mivel a Power Apps portálok egyes forgatókönyvei a Bootstrap 3.3. x-tól függnek. További információkat a jelen cikk A Bootstrap-keretrendszer megértése és a Bootstrap testreszabása szakaszaiban talál.
A kódszerkesztő megnyitásához CSS szerkessze a portált úgy, hogy a portals Studio alkalmazásban Power Apps nyissa meg.
Válasszon Témát A képernyő bal oldaláról számított pozíció. A rendszer megjeleníti az elérhető témákat.
Válassza ki a kívánt CSS elemet a kódszerkesztőben való megnyitáshoz.
Szerkessze a kódot, és mentse el a módosításokat.
Új CSS fájl feltöltéséhez szerkessze a portált úgy, hogy megnyissa azt a Portals Studio alkalmazásban Power Apps .
Válasszon Témát A képernyő bal oldaláról számított pozíció. A rendszer megjeleníti az elérhető témákat.
Válassza az Egyéni CSS feltöltése lehetőséget.
Tallózással keresse meg és válassza ki a feltöltendő CSS fájlt.
A CSS-fájlok webes fájlokként tárolódnak.
A CSS-fájl eltávolításához menjen a Portálkezelő alkalmazáshoz, és válassza ki a webes fájlokat.
Keresse meg a CSS-fájlrekordot. Előfordulhat, hogy a helyes bejegyzés kereséséhez szűrni kell a név és a webhely értékeit.
A webfájl-bejegyzés kijelölését után válassza a Törlés lehetőséget.
A portálstúdióban válassza a Szinkronizálás konfigurációt, hogy törölje a változásokat az egyéni CSS-alkalmazásból.
A Bootstrap egy front-end keretrendszer, amely CSS-t és JavaScript-komponenseket tartalmaz a közös webes alkalmazás interfészelemekhez. Stílusokat tartalmaz navigációs elemekhez, űrlapokhoz, gombokhoz és egy reszponzív rácselrendezés-rendszert, amely lehetővé teszi, hogy a webhely-elrendezések dinamikusan módosuljanak a különböző méretű képernyővel rendelkező telefonok és táblagépek esetén. A Bootstrap elrendezési rendszer segítségével képes egy önálló webhelyet létrehozni, amely megfelelő felületet biztosít az összes, ügyfelek által használható eszköznek.
A portálokhoz mellékelt sablonok szabvány Bootstrap-összetevőkkel valósulnak meg, minimális további egyéni stílusokkal. Így, amikor megvalósítja a sablonokat, akkor igénybe veheti a Bootstrap testreszabási beállításait. Gyorsan személyre szabhatja a témát (betűtípusok, színek, stb.) úgy, hogy az az egész portálon konzisztensen módosuljon.
A Bootstrap változók egy csoportján keresztül támogatja a testreszabást. Ezen változók valamelyike vagy mindegyike egyéni értéket kaphat, és letölthető a Bootstrap ezen értékek alapján testreszabott verziója.
A Bootstrap-változók ereje az, hogy nem diktálják egy elem stílusát. A keretrendszer összes eleme ezen értékeken alapul, és ezekből származik. Vegyük például a @font-size-base
változót. Ez azt a méretet adja meg, amelyet a Bootstrap a normál szöveghez rendel. Azonban a Bootstrap arra is használja ezt a változót, hogy jelezze a fejlécek és egyéb elemek betűméretét. Egy H1 elem mérete meghatározható a @font-size-base
méretének 300 százalékaként. Ennek az egy változónak a beállításával következetes módon szabályozható a portál teljes tipográfiai skálája. Hasonlóképpen a @link-color
változó határozza meg a hivatkozások színét. Az ehhez az értékhez rendelt színhez a Bootstrap a hivatkozások rámutatási színét az egyéni érték 15 százalékkal sötétebbre állítja be.
A Bootstrap testreszabott verziója létrehozásának szokásos módja a hivatalos Bootstrap-webhelyen keresztül történik. Azonban a Bootstrap népszerűsége miatt több külső webhely is készült erre a célra. Ezek a webhelyek könnyebben kezelhető felületet biztosíthatnak a Bootstrap testreszabásához, vagy a Bootstrap előre megtervezett változatainak letöltését tehetik lehetővé. A hivatalos Bootstrap-testreszabó webhely további információkkal rendelkezik a Bootstrap testreszabásához.
Amikor letölti a Bootstrap testreszabott verzióját, az a következő könyvtárszerkezetet tartalmazza.
css/
|-- bootstrap.min.css
img/
|-- glyphicons-halflings-white.png
|-- glyphicons-halflings.png
js/
|-- bootstrap.min.js
Vagy a használt testreszabó alkalmazástól függően előfordulhat, hogy csak bootstrap.min.css-t tartalmaz. Ettől függetlenül a bootstrap.min.css fájl tartalmazza a testreszabásokat. A többi fájl azonos a Bootstrap minden egyéni verziója esetén, és így már szerepelnek a portálon.
Megjegyzés
Megosztja velünk a dokumentációja nyelvi preferenciáit? Rövid felmérés elvégzése. (ne feledje, hogy ez a felmérés angol nyelvű)
A felmérés elvégzése körülbelül hét percet vesz igénybe. Semmilyen személyes adatot nem gyűjtünk (adatvédelmi nyilatkozat).