Source

Reboot

Reboot, una cullizzioni di cambiamenti CSS specifichi di l'elementu in un unicu schedariu, kickstart Bootstrap per furnisce una linea di base elegante, coherente è simplice per custruisce.

Avvicinamentu

Reboot si basa nantu à Normalize, chì furnisce parechji elementi HTML cù stili un pocu opinioni chì utilizanu solu selettori di elementi. Stile supplementu hè fattu solu cù classi. Per esempiu, riavviamu certi <table>stili per una basa più simplice è più tardi furnisce .table, .table-bordered, è più.

Eccu i nostri linee guida è motivi per sceglie ciò chì annullà in Reboot:

Aghjurnate alcuni valori predeterminati di u navigatore per utilizà rems invece di ems per u spaziu di cumpunenti scalabile.
Evite margin-top. I margini verticali ponu colapsà, dendu risultati inespettati. A più impurtante però, una sola direzzione di marginhè un mudellu mentale più simplice.
Per una scala più faciule trà e dimensioni di u dispositivu, l'elementi di bloccu duveranu aduprà rems per margins.
Mantene dichjarazioni di fontpruprietà -related à u minimu, usendu inheritsempre chì pussibule.

Pagina predefinita

L' elementi <html>è <body>sò aghjurnati per furnisce megliu predefiniti in tutta a pagina. Più specificamente:

U box-sizinghè stabilitu globalmente nantu à ogni elementu, cumpresu *::beforeè *::after, à border-box. Questu assicura chì a larghezza dichjarata di l'elementu ùn hè mai superata per via di padding o frontiere.
Nisuna basa font-sizehè dichjarata nantu à u <html>, ma 16pxhè assunta (u navigatore predeterminatu). font-size: 1remhè appiicata nantu à u <body>tippu di rispunsabilità faciule per una scala di tippu per mezu di e dumande di media mentre rispettendu e preferenze di l'utilizatori è assicurendu un approcciu più accessibile.
U <body>stabilisce ancu un globale font-family, line-height, è text-align. Questu hè ereditatu dopu da alcuni elementi di forma per prevene inconsistenzi di font.
Per a sicurità, <body>hà una dichjarazione background-color, predeterminata à #fff.

Pila di font nativa

I fonti web predeterminati (Helvetica Neue, Helvetica, è Arial) sò stati abbandunati in Bootstrap 4 è rimpiazzati cù una "pila di font nativa" per una resa di testu ottimali in ogni dispositivu è OS. Leghjite più nantu à stacks di font nativu in questu articulu di Smashing Magazine .

$font-family-sans-serif:
  // Safari for macOS and iOS (San Francisco)
  -apple-system,
  // Chrome < 56 for macOS (San Francisco)
  BlinkMacSystemFont,
  // Windows
  "Segoe UI",
  // Android
  "Roboto",
  // Basic web fallback
  "Helvetica Neue", Arial, sans-serif,
  // Emoji fonts
  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;

Questu font-familyhè appiicatu à u <body>è ereditatu automaticamente in u mondu in tuttu Bootstrap. Per cambià u glubale font-family, aghjurnà $font-family-baseè ricumpila Bootstrap.

Intestazioni è paragrafi

Tutti l'elementi di l'intestazione - per esempiu - <h1>è <p>sò resettati per esse margin-topeliminati. Intestazioni anu margin-bottom: .5remaghjustatu è paragrafi margin-bottom: 1remper un spaziu faciule.

Titulu	Esempiu
`<h1></h1>`	h1. Titulu Bootstrap
`<h2></h2>`	h2. Titulu Bootstrap
`<h3></h3>`	h3. Titulu Bootstrap
`<h4></h4>`	h4. Titulu Bootstrap
`<h5></h5>`	h5. Titulu Bootstrap
`<h6></h6>`	h6. Titulu Bootstrap

Listi

Tutti i listi <ul>- , <ol>, è <dl>- sò margin-topstati eliminati è un margin-bottom: 1rem. Listi nidificati ùn anu micca margin-bottom.

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem à massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
Faucibus porta lacus fringilla vel
Aenean sit amet erat nunc
Eget porttitor lorem

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem à massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit
Faucibus porta lacus fringilla vel
Aenean sit amet erat nunc
Eget porttitor lorem

Per un stilu più simplice, una ghjerarchia chjara, è un spaziu megliu, i listi di descrizzione anu aghjurnatu margins. <dd>s resetta margin-leftè 0aghjunghje margin-bottom: .5rem. <dt>s sò in grassetto .

Lista di descrizzione: Una lista di descrizzione hè perfetta per definisce i termini.
Euismod: Vestibulum id ligula porta felis euismod sempre eget lacinia odio sem.; Donec id elit non mi porta gravida at eget metus.
Malesuada porta: Etiam porta sem malesuada magna mollis euismod.

Testu preformattatu

L' <pre>elementu hè resettatu per sguassà u so margin-topè aduprà remunità per u so margin-bottom.

.elementu-esempiu {
  margin-bottom: 1rem;
}

Tavule

I tavule sò ligeramente adattati à u stilu <caption>s, colapsanu e fruntiere, è assicuranu a coherenza text-alignin tuttu. Cambiamenti supplementari per e fruntiere, padding, è più venenu cù a .tableclasse .

Questa hè una tabella di esempiu, è questu hè u so didascalia per discrìviri u cuntenutu.
Titulu di a tavula	Titulu di a tavula	Titulu di a tavula	Titulu di a tavula
Cellula di a tavula	Cellula di a tavula	Cellula di a tavula	Cellula di a tavula
Cellula di a tavula	Cellula di a tavula	Cellula di a tavula	Cellula di a tavula
Cellula di a tavula	Cellula di a tavula	Cellula di a tavula	Cellula di a tavula

Forme

Diversi elementi di forma sò stati riavviati per stili di basa più simplici. Eccu alcuni di i cambiamenti più notevuli:

<fieldset>s ùn anu micca cunfini, padding, o margini cusì ponu esse facilmente utilizati cum'è wrappers per inputs individuali o gruppi di inputs.
<legend>s, cum'è fieldsets, sò stati ancu rimodellati per esse affissati cum'è una sorta di intestazione.
<label>s sò messe à display: inline-blockpermette marginà esse applicata.
<input>s, <select>s, <textarea>s, è <button>s sò principalmente indirizzati da Normalize, ma Reboot sguassate ancu i so margine set line-height: inherit.
<textarea>s sò mudificate per esse ridimensionabili solu verticalmente cum'è ridimensionamentu horizontale spessu "rompe" u layout di pagina.
<button>s è <input>l'elementi di buttone anu cursor: pointerquandu :not(:disabled).

Questi cambiamenti, è più, sò dimustrati quì sottu.

Vari elementi

Indirizzu

L' <address>elementu hè aghjurnatu per resettate u navigatore predeterminatu font-styleda italicà normal. line-heighthè ancu avà ereditatu, è margin-bottom: 1remhè statu aghjuntu. <address>s sò per presentà l'infurmazioni di cuntattu per l'antenatu più vicinu (o un corpu tutale di travagliu). Preservate u furmatu finendu e linee cù <br>.

Twitter, Inc.
1355 Market St, Suite 900
San Francisco, CA 94103
P: (123) 456-7890

Nome
pienu [email protected]

Blockquote

U predeterminatu marginnantu à i blockquotes hè 1em 40px, cusì avemu resettatu quellu 0 0 1remper qualcosa più coherente cù altri elementi.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Qualchissia famosu in Source Title

Elementi in linea

L' <abbr>elementu riceve un stilu di basa per fà si distingue trà u testu di paragrafu.

Nulla attr vitae elit libero, a pharetra augue.

Riassuntu

U predeterminatu cursorin u riassuntu hè text, cusì avemu resettatu chì pointerper trasmette chì l'elementu pò esse interattuatu cù clicchendu nantu à ellu.

Certi dettagli

Più infurmazione nantu à i dettagli.

Ancu più dettagli

Eccu ancu più dettagli nantu à i dettagli.

`[hidden]`attributu HTML5

HTML5 aghjunghjenu un novu attributu globale chjamatu[hidden] , chì hè stilatu cum'è display: nonepredeterminatu. Prestu un'idea da PureCSS , migliuramu stu predefinitu [hidden] { display: none !important; }per aiutà à prevene ch'ella displaysia annullata accidentalmente. Mentre [hidden]ùn hè micca supportatu nativamente da IE10, a dichjarazione esplicita in u nostru CSS risolve stu prublema.

<input type="text" hidden>

Incompatibilità di jQuery

[hidden]ùn hè micca cumpatibile cù jQuery $(...).hide()è $(...).show()i metudi. Dunque, attualmente ùn appruvemu micca sopra [hidden]à altre tecniche per gestisce l' displayelementi.

Per solu bascà a visibilità di un elementu, vale à displaydì chì ùn hè micca mudificatu è l'elementu pò ancu influenzà u flussu di u documentu, utilizate a .invisibleclassa invece.