Rozložení s Twitter Bootstrap - 1. část

Obsah

Twitter Bootstrap je sbírka bezplatných softwarových nástrojů pro vytváření webových stránek a aplikací.
Je to rámec pro podporu konzistence prostřednictvím interních nástrojů. Před Bootstrapem byly pro vývoj uživatelského rozhraní použity různé knihovny, což vedlo k nekonzistencím a vysoké zátěži při údržbě.
Bootstrap je modulární a v podstatě se skládá z řady stylů, které implementují různé komponenty nástroje. Šablona stylů s názvem bootstrap.less obsahuje součásti šablony stylů. Vývojáři mohou přizpůsobit stejný soubor Bootstrap výběrem komponent, které chtějí použít ve svém projektu.
Nástroje a třídy jsou k dispozici v Bootstrapu
Gangový systém a responzivní design
Bootstrap je dodáván se standardním rozložením mřížky širokým 940 pixelů. Alternativně může vývojář použít rozložení s proměnnou šířkou. Tím se automaticky upraví šířka sloupců.
Šablona stylů CSS
Bootstrap poskytuje sadu stylů, které poskytují základní definice stylů pro všechny komponenty HTML. To dává prohlížeči a systému šířky jednotnost a poskytuje moderní vzhled pro formátování textových prvků, tabulek a formulářů.
Opakovaně použitelné součásti
Pravidelné prvky HTML, Bootstrap, obsahuje další běžně používané rozhraní prvků. Obsahuje tlačítka s pokročilými funkcemi, jako je skupina tlačítek nebo tlačítka s možností rozevírací nabídky, navigační seznamy, vodorovné a svislé popisky, drobečková navigace, stránkování, štítky, pokročilé funkce typografických miniatur, formáty výstražných zpráv a ukazatele průběhu.
Pluginy pro Javascript a jQuery
Komponenty Javascriptu pro Bootstrap jsou založeny na knihovně jQuery Javascript. Moduly plug-in se nacházejí v nástroji plug-in jQuery. Poskytují další prvky uživatelského rozhraní, jako jsou dialogy, popisy nástrojů a karusely.
Rovněž rozšiřují funkčnost některých stávajících prvků rozhraní, včetně například funkce automatického dokončování vstupních polí. Verze 2.0 podporuje následující pluginy Javascriptu: Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Collapse, Carousel a Typeahead.
Chcete -li použít Bootstrap na stránce HTML, stačí, aby si vývojář stáhnul šablonu CSS Bootstrap a propojil ji v souboru HTML.
Stáhněte si kompilovaný kód CSS a Javascript, což je nejjednodušší způsob, jak začít s Bootstrap. Temnější stránkou je, že tato verze neobsahuje původní soubory ani dokumentaci. Chcete -li si stáhnout tuto verzi, přejděte na getbootstrap.com a stiskněte tlačítko Stáhnout bootstrap.
Můžeme také zvolit propojení se soubory bootstrap z externích serverů následujícím způsobem:
Chcete -li tyto soubory použít, upravte na svých stránkách následující odkazy
 

Po rozbalení souboru, který jste stáhli pomocí kompilované verze nástroje Bootstrap, se vám zobrazí následující struktura souborů a adresářů:
bootstrap /
├── css /
│ ├── bootstrap.css
│ ├── bootstrap.min.css
│ ├── bootstrap-theme.css
│ └── bootstrap-theme.min.css
├── js /
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── písma /
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
└── glyphicons-halflings-regular.woff
Tyto soubory jsou knihovnami, které tvoří bootstrap, později uvidíme součásti a způsob jejich použití.Líbil se vám tento návod a pomohl mu?Autora můžete odměnit stisknutím tohoto tlačítka, čímž mu dáte kladný bod
wave wave wave wave wave