Buttons

Default buttons

Button styles can be applied to anything with the .btn class applied. However, typically you'll want to apply these to only <a> and <button> elements for the best rendering.

Buttonclass=""Description
btn Standard gray button with gradient
btn btn-primary Provides extra visual weight and identifies the primary action in a set of buttons
btn btn-info Used as an alternative to the default styles
btn btn-success Indicates a successful or positive action
btn btn-warning Indicates caution should be taken with this action
btn btn-danger Indicates a dangerous or potentially negative action
btn btn-inverse Alternate dark gray button, not tied to a semantic action or use
btn btn-link Deemphasize a button by making it look like a link while maintaining button behavior

Cross browser compatibility

IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled button elements, rendering text gray with a nasty text-shadow that we cannot fix.

Button sizes

Fancy larger or smaller buttons? Add .btn-large, .btn-small, or .btn-mini for additional sizes.

<p>
  <button class="btn btn-large btn-primary" type="button">Large button</button>
  <button class="btn btn-large" type="button">Large button</button>
</p>
<p>
  <button class="btn btn-primary" type="button">Default button</button>
  <button class="btn" type="button">Default button</button>
</p>
<p>
  <button class="btn btn-small btn-primary" type="button">Small button</button>
  <button class="btn btn-small" type="button">Small button</button>
</p>
<p>
  <button class="btn btn-mini btn-primary" type="button">Mini button</button>
  <button class="btn btn-mini" type="button">Mini button</button>
</p>

Create block level buttons—those that span the full width of a parent— by adding .btn-block.

<button class="btn btn-large btn-block btn-primary" type="button">Block level button</button>
<button class="btn btn-large btn-block" type="button">Block level button</button>

 


Condividi su

Submit to FacebookSubmit to Google BookmarksSubmit to TwitterSubmit to LinkedIn

Referenze

I prodotti SICE sono utilizzati dalle più importanti Aziende e Istituzioni civili e militari.

Diventa Partner

diventa partner modIscriviti ai Corsi SICE per diventare Partner di prodotti professionali per Telecomunicazioni e Videosorveglianza

AirGHz Web

airghz 263-01App AirGHz: professionale, gratuita, per Apple, Android e WEB dedicata al settore Telecomunicazioni

SICE Newsletter

Iscriviti per ricevere aggiornamenti su nuovi prodotti, corsi e promozioni...

Iscriviti per ricevere aggiornamenti su nuovi prodotti, corsi e promozioni.

app apple white 64 android-white-64 web-white-64

SICE Telecomunicazioni
Via Tazio Nuvolari, 53 - 55061
Carraia - Lucca, Italy  (google placemark)

Tel: 
(+39) 0583 980787
Fax: (+39) 0583 981495
Questo indirizzo email è protetto dagli spambots. E' necessario abilitare JavaScript per vederlo.
Questo indirizzo email è protetto dagli spambots. E' necessario abilitare JavaScript per vederlo.
P.I. 00871160461
REA n.103668