Ez a cikk egy tükör gépi fordítás, kérjük, kattintson ide, hogy ugorjon az eredeti cikkre.

Nézet: 2539|Válasz: 0

[Bootstrap] Gyors áttekintést kapj a Bootstrap 5 fájltartalom szerkezetéről

[Linket másol]
Közzétéve 2024. 07. 25. 9:18:53 | | | |
Követelmények: A Bootstrap segít sok css stílust bekapálni, csak hivatkoznunk kell rájuk az osztályon. Amikor front-end UI keretrendszert használunk (pl. Angular Material UI, NG-ZORRO, Kendo UI), mi van, ha a Bootstrap stílusait szeretnénk használni? Hogyan tudtok együtt létezni a Bootstrap-tel és más UI keretrendszerekkel a projektetekben anélkül, hogy egymást zavarnánk?

A Bootstrap egy erős és funkciókkal gazdag front-end eszköztár. Bármit (a prototípustól a gyártásig) néhány perc alatt építs össze.

Telepítse a bootstrap 5.3.3-as verziót npm-mel a következő parancs segítségével:

Telepítés után a node_modules\bootstrap könyvtár szerkezete a következő:

A kötet sorozatszáma: AA1B-3F2F
D:.
│ ENGEDÉLY
│ package.json
│ README.md
│  
├─dista
│ ├─css
│ │ bootstrap-grid.css
│ │ bootstrap-grid.css.map
│ │ bootstrap-grid.min.css
│ │ bootstrap-grid.min.css.map
│ │ bootstrap-grid.rtl.css
│ │ bootstrap-grid.rtl.css.map
│ │ bootstrap-grid.rtl.min.css
│ │ bootstrap-grid.rtl.min.css.map
│ │ bootstrap-reboot.css
│ │ bootstrap-reboot.css.map
│ │ bootstrap-reboot.min.css
│ │ bootstrap-reboot.min.css.map
│ │ bootstrap-reboot.rtl.css
│ │ bootstrap-reboot.rtl.css.map
│ │ bootstrap-reboot.rtl.min.css
│ │ bootstrap-reboot.rtl.min.css.map
│ │ bootstrap-utilities.css
│ │ bootstrap-utilities.css.map
│ │ bootstrap-utilities.min.css
│ │ bootstrap-utilities.min.css.map
│ │ bootstrap-utilities.rtl.css
│ │ bootstrap-utilities.rtl.css.map
│ │ bootstrap-utilities.rtl.min.css
│ │ bootstrap-utilities.rtl.min.css.map
│ │ bootstrap.css
│ │ bootstrap.css.map
│ │ bootstrap.min.css
│ │ bootstrap.min.css.map
│ │ bootstrap.rtl.css
│ │ bootstrap.rtl.css.map
│ │ bootstrap.rtl.min.css
│ │ bootstrap.rtl.min.css.map
│  │
│ └─js
│ bootstrap.bundle.js
│ bootstrap.bundle.js.map
│ bootstrap.bundle.min.js
│ bootstrap.bundle.min.js.map
│ bootstrap.esm.js
│ bootstrap.esm.js.map
│ bootstrap.esm.min.js
│ bootstrap.esm.min.js.map
│ bootstrap.js
│ bootstrap.js.map
│ bootstrap.min.js
│ bootstrap.min.js.map

├─js
│ │ index.esm.js
│ │ index.umd.js
│  │
│ ├─dist
│ │ │ alert.js
│ │ │ alert.js.map
│ │ │ base-component.js
│ │ │ base-component.js.map
│ │ │ button.js
│ │ │ button.js.map
│ │ │ carousel.js
│ │ │ carousel.js.map
│ │ │ collapse.js
│ │ │ collapse.js.map
│ │ │ dropdown.js
│ │ │ dropdown.js.map
│ │ │ modal.js
│ │ │ modal.js.map
│ │ │ offcanvas.js
│ │ │ offcanvas.js.map
│ │ │ popover.js
│ │ │ popover.js.map
│ │ │ scrollspy.js
│ │ │ scrollspy.js.map
│ │ │ tab.js
│ │ │ tab.js.map
│ │ │ toast.js
│ │ │ toast.js.map
│ │ │ tooltip.js
│ │ │ tooltip.js.map
│  │  │
│ │ ├─dom
│ │ │ data.js
│ │ │ data.js.map
│ │ │ event-handler.js
│ │ │ event-handler.js.map
│ │ │ manipulator.js
│ │ │ manipulator.js.map
│ │ │ selector-engine.js
│ │ │ selector-engine.js.map
│  │  │
│ │ └─util
│ │ backdrop.js
│ │ backdrop.js.map
│ │ component-functions.js
│ │ component-functions.js.map
│ │ config.js
│ │ config.js.map
│ │ focustrap.js
│ │ focustrap.js.map
│ │ index.js
│ │ index.js.map
│ │ sanitizer.js
│ │ sanitizer.js.map
│ │ scrollbar.js
│ │ scrollbar.js.map
│ │ swipe.js
│ │ swipe.js.map
│ │ template-factory.js
│ │ template-factory.js.map
│  │
│ └─src
│ │ alert.js
│ │ base-component.js
│ │ button.js
│ │ carousel.js
│ │ collapse.js
│ │ dropdown.js
│ │ modal.js
│ │ offcanvas.js
│ │ popover.js
│ │ scrollspy.js
│ │ tab.js
│ │ toast.js
│ │ tooltip.js
│      │
│ ├─dom
│ │ data.js
│ │ event-handler.js
│ │ manipulator.js
│ │ selector-engine.js
│      │
│ └─util
│ backdrop.js
│ component-functions.js
│ config.js
│ focustrap.js
│ index.js
│ sanitizer.js
│ scrollbar.js
│ swipe.js
│ template-factory.js

└─scss
    │ bootstrap-grid.scss
    │ bootstrap-reboot.scss
    │ bootstrap-utilities.scss
    │ bootstrap.scss
    │ _accordion.scss
    │ _alert.scss
    │ _badge.scss
    │ _breadcrumb.scss
    │ _button-group.scss
    │ _buttons.scss
    │ _card.scss
    │ _carousel.scss
    │ _close.scss
    │ _containers.scss
    │ _dropdown.scss
    │ _forms.scss
    │ _functions.scss
    │ _grid.scss
    │ _helpers.scss
    │ _images.scss
    │ _list-group.scss
    │ _maps.scss
    │ _mixins.scss
    │ _modal.scss
    │ _nav.scss
    │ _navbar.scss
    │ _offcanvas.scss
    │ _pagination.scss
    │ _placeholders.scss
    │ _popover.scss
    │ _progress.scss
    │ _reboot.scss
    │ _root.scss
    │ _spinners.scss
    │ _tables.scss
    │ _toasts.scss
    │ _tooltip.scss
    │ _transitions.scss
    │ _type.scss
    │ _utilities.scss
    │ _variables-dark.scss
    │ _variables.scss
    │
    ├─formák
    │ _floating-labels.scss
    │ _form-check.scss
    │ _form-control.scss
    │ _form-range.scss
    │ _form-select.scss
    │ _form-text.scss
    │ _input-group.scss
    │ _labels.scss
    │ _validation.scss
    │
    ├─Segítők
    │ _clearfix.scss
    │ _color-bg.scss
    │ _colored-links.scss
    │ _focus-ring.scss
    │ _icon-link.scss
    │ _position.scss
    │ _ratio.scss
    │ _stacks.scss
    │ _stretched-link.scss
    │ _text-truncation.scss
    │ _visually-hidden.scss
    │ _vr.scss
    │
    ├─Mixins
    │ _alert.scss
    │ _backdrop.scss
    │ _banner.scss
    │ _border-radius.scss
    │ _box-shadow.scss
    │ _breakpoints.scss
    │ _buttons.scss
    │ _caret.scss
    │ _clearfix.scss
    │ _color-mode.scss
    │ _color-scheme.scss
    │ _container.scss
    │ _deprecate.scss
    │ _forms.scss
    │ _gradients.scss
    │ _grid.scss
    │ _image.scss
    │ _list-group.scss
    │ _lists.scss
    │ _pagination.scss
    │ _reset-text.scss
    │ _resize.scss
    │ _table-variants.scss
    │ _text-truncate.scss
    │ _transition.scss
    │ _utilities.scss
    │ _visually-hidden.scss
    │
    ├─Utilities
    │ _api.scss
    │
    └─árus
            _rfs.scss

ahol a dist mappa a lefordított fájl, az scss a js, a forráskód pedig CSS és JavaScript.

A lefordított Bootstrap css fájlszerkezete a következő:



Általánosságban, a saját helyzeted szerint, idézze:bootstrap-utilities.min.cssbootstrap-grid.min.cssTud.

Utalás:A hiperlink bejelentkezés látható.





Előző:Két-három dolog a Shared Memory-vel kapcsolatos
Következő:[Gyakorlás] Használd a Dappert SQLite adatbázisok kezelésére
Lemondás:
A Code Farmer Network által közzétett összes szoftver, programozási anyag vagy cikk kizárólag tanulási és kutatási célokra szolgál; A fenti tartalmat nem szabad kereskedelmi vagy illegális célokra használni, különben a felhasználók viselik az összes következményet. Az oldalon található információk az internetről származnak, és a szerzői jogi vitáknak semmi köze ehhez az oldalhoz. A fenti tartalmat a letöltés után 24 órán belül teljesen törölni kell a számítógépéről. Ha tetszik a program, kérjük, támogassa a valódi szoftvert, vásároljon regisztrációt, és szerezzen jobb hiteles szolgáltatásokat. Ha bármilyen jogsértés történik, kérjük, vegye fel velünk a kapcsolatot e-mailben.

Mail To:help@itsvse.com