Tooltip

Aseta mille tahansa sivuelementille linkkivihje käyttäjää opastamaan.

  Lisätietoja

Malli

 

tooltip-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left"
 
 
 
 
 
 
 
 
 
 
 
 

Popover

Popover on Tooltipia monipuolisempi, joka voi sisältää myös HTML-koodia ja noudattaa template-mallia. Erinomainen esim. toimintojen ohjeistamiseen.
Oletuksena Popover pitää napista/elementistä klikkaamalla avata ja sulkea, mutta näitä asetuksia on mahdollista muuttaa.

Lisätietoja

Malli

 

data-container="body" data-toggle="popover" data-placement="right" data-content="foo"
 
 
 
 
 
 
 
 
 
 
 
 

Collapse

Malli

Collapsible Group Item #1

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Collapsible Group Item #2

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Collapsible Group Item #3

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
 
 
 
 
 
 
 
 
 
 
 
 

Modal-ikkunat

 
 
 
 
 
 
 
 
 
 
 
 

Napit ja nappiryhmät

Malli


Left Middle Right

1 2

 

 
 
 
 
 
 
 
 
 
 
 
 

Breadcrumbs

Malli

  1. Home
  2. Library
  3. Data
 
 
 
 
 
 
 
 
 
 
 
 

Paneelit

Malli

Panel success

Panel content

 

 
 
 
 
 
 
 
 
 
 
 
 

Taulukot

Table classes

Use .table-striped to add zebra-striping to any table row within the .

Add .table-hover to enable a hover state on table rows within a .

Add .table-condensed to make tables more compact by cutting cell padding in half.

Contextual classes

Use contextual classes to color table rows or individual cells.

  • .active Applies the hover color to a particular row or cell
  • .success Indicates a successful or positive action
  • .info Indicates a neutral informative change or action
  • .warning Indicates a warning that might need attention
  • .danger Indicates a dangerous or potentially negative action

 

Malli

Column Column Column
Column Column Column
Column Column Column