Typography Heading Texth1. Heading Secondary texth2. Heading Secondary texth3. Heading Secondary texth4. Heading Secondary texth5. Heading Secondary texth6. Heading Secondary textTIPS: Create lighter, secondary text in any heading with a generic <small> tag or the .small class.Example body textThis is a lead paragraph. Make a paragraph stand out by adding .lead.Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus.Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.The following snippet of text is rendered as bold text.The following snippet of text is rendered as italicized text.An abbreviation of the word attribute is attr. Address Company Name 795 Folsom Ave, Suite 600 San Francisco, CA 94107 P: (123) 456-7890Full Name P: (123) 456-7890 Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser.Emphasis classesThis is a .mute paragraph.This is a .text-primary paragraph.This is a .text-warning paragraph.This is a .text-danger paragraph.This is a .text-success paragraph.This is a .text-info paragraph.Alignment classesThis is a left aligned text .text-leftThis is a center aligned text .text-centerThis is a right aligned text .text-rightThis is a justify aligned text which is often used in Book Design, Magazine or special Typo Pages. Create a justify aligned text with .text-justify class. BlockquotesLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Quote's author in Source TitleLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Quote's author in Source Title Tagshotel booking discount location map travel Color SwatchesBrand Colors#3061ffBrand Primary#ff3333Brand Secondary#f0ad4eBrand Warning#d9534fBrand Danger#5bc0deBrand Info#5cb85cBrand Success Grayscale Levels#1a1a1aGray Darker#333Gray Dark#555Gray#999Gray Light#e8e8e8Gray Lighter#f7f7f7Gray Lightest ButtonsNormal Button Primary Button Success Button Warning Button Danger Button Info Button NavigationsTabsHomeProfileDisabled Dropdown ActionAnother actionAnother actionIn the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes.GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor).In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes.GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor).In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes.GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor).In the area of graphical user interfaces (GUI), a tabbed document interface (TDI) or a Tab is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes.GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor).Vertical MenusActive Menu ItemMenu ItemMenu ItemDisabled Menu Item Dropdown ActionAnother actionSomething else hereSeparated link InputsInput success Input error Input warning Disabled input IndicatorsAlerts and NotificationsError message titleCras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus.Sussess message titleCras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus.Info message titleCras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus.Warning message titleCras ac dignissim mauris. Duis odio diam, rutrum ut est at, scelerisque malesuada risus. BadgesHome 42Profile Messages 25Notices 2LabelsDefault Primary Success Info Warning Danger MiscList groups14 Cras justo odio2 Dapibus ac facilisis inMorbi leo risus1 Morbi leo risus2 Dapibus ac facilisis in9 Cras justo odio Dapibus ac facilisis in Morbi leo risus Porta ac consectetur ac Vestibulum at erosList group item headingDonec id elit non mi porta gravida at eget metus risus varius blandit.List group item headingDonec id elit non mi porta gravida at eget metus.List group item headingDonec id elit non mi porta gravida at eget metus. PanelsPanel headingPanel contentPanel primaryPanel contentPanel successPanel contentPanel warningPanel contentPanel dangerPanel contentPanel infoPanel content WellsLook, I'm in a small well!Look, I'm in a well!Look, I'm in a large well! Précédent Suivant
