Prezentare generală Bootstrap
Bootstrap este un cadru front-end care vă ajută să proiectați interfețe web cu componente gata făcute CSS și JavaScript pentru elemente comune, cum ar fi navigarea, formulare și butoane. De asemenea, are un sistem de aspect al grilei receptiv care vă ajustează site-ul pentru dispozitive cu diferite dimensiuni de ecran, cum ar fi telefoanele și tabletele. Folosind sistemul de aspect Bootstrap, puteți crea un singur site care arată bine pe orice dispozitiv pe care clienții dvs. l-ar putea folosi.
Power Pages șabloanele folosesc componente Bootstrap standard cu stiluri personalizate minime. Folosind aceste șabloane, puteți schimba cu ușurință tema (fonturi, culori și așa mai departe) pentru a se potrivi cu brandul și preferințele în mod constant pe întregul site.
Power Pages acceptă versiunea Bootstrap 3.3.6 și versiunea Bootstrap 5. Versiunea Bootstrap 5 oferă caracteristici îmbunătățite pentru experiența utilizatorului (UX) și componente noi precum acordeon, offcanvas și suport RTL.
Pentru site-urile Power Pages noile, va trebui să configurați versiunea 5 a Bootstrap în mediul dvs.. De asemenea, puteți să migrați site-urile web Bootstrap versiunea 3 existente la versiunea 5.
Personalizare Bootstrap
Pentru a personaliza Bootstrap, modificați valorile variabilelor și apoi descărcați o versiune de Bootstrap compilată cu valorile dvs. personalizate.
Puterea variabilelor Bootstrap este că ele definesc toate stilurile din cadru, nu doar un element. De exemplu, variabila @font-size-base
specifică dimensiunea implicită a textului de pe site-ul dvs. — textul corpului, titlurile și toate celelalte elemente de text. Un titlu H1 poate fi definit ca 300% din @font-size-base
. Prin setarea acestei variabile, controlați întreaga scară tipografică a site-ului dvs. într-un mod consistent.
Puteți crea o versiune personalizată de Bootstrap prin site-ul oficial Bootstrap sau puteți utiliza un site terță parte care ar putea oferi o interfață mai ușoară sau teme preproiectate. Site-ul oficial de personalizare Bootstrap are mai multe informații despre personalizarea Bootstrap.
Când descărcați o versiune personalizată de Bootstrap, aceasta conține următoarea structură de directoare:
css/
|-- bootstrap.min.css
img/
|-- glyphicons-halflings-white.png
|-- glyphicons-halflings.png
js/
|-- bootstrap.min.js
În funcție de aplicația de personalizare pe care ați folosit-o, structura de directoare poate conține numai bootstrap.min.css
. Este fișierul care conține personalizările dvs. Celelalte fișiere sunt aceleași pentru toate versiunile personalizate de Bootstrap și sunt deja incluse pe site-ul dvs. web.