|
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
 |
Reboot | Generel intro til håndteringen af tekster med Bootstrap | |
|
Typography | Håndtering af typografi. - baggrundsfarve - H1 - H6 incl. sekundær tekst - 'Display headings'. (Headings større end H1) - Fremhæv data i et tag. (størrelse og 'weight') - Tags omkring inline tekster. - Tooltip til forkortelser - Citater (forlæns og baglæns) - Lister uden style - Inline liste - Beskrivelsesliste anvendt horisontalt. | |
|
Code | Om brugen af forskellige tags primært af typen 'tekstindlejringer': <code>, <pre>, <var>, <kbd> og <samp>, | |
|
Images | Håndtering af billeder. Gøre dem responsive, former og horisontal placering. - responsive billeder - Billed former (runde hjørne, runde og thumbnail) - Højre- / venstrestilling og centrering. | |
|
Tables | Håndtering af traditionel <table ... - Basis - Invers - Tabel header - Zebra striber - Border - Hover-effekt på rækker - Kompakt tabel - Farvelægning af rækker eller celler - Responsive tabeller - Reflow !!!!! | |
|
Figures | Håndtering af <figure .... Omkring billede / figur, når der med figcaption skal tilknyttes tekst over eller under billedet. (fieldset kan yderligere placeres som en "kasse" udenom). | |
|
Utilities |
Generel værktøjskasse. - adskillige default selektorer til margin - adskillige default selektorer til padding - sidelæns placering af tekst - Ændring af case på tekst - Farver på tekster - Farver på baggrunde i felter - Close !!!!! - Float left og right - Centrer en display-blok - Skjul indhold i HTML-tag - Usynliggør indhold i HTML-tag - Vis kun på skærm - Billede !!!!! - Responsiv indsætning af Youtube o.lign. . |
em/rem kan valgfrit anføres med afrundede eller det fulde antal decimaler (= max. 4).
| Pixel | Em Rem | Pixel | Em Rem | Pixel | Em Rem |
|---|---|---|---|---|---|
| 1 - 16 | 32 - 160 | 320 - 1600 | |||
| 1 | .0625 | 32 | 2 | 320 | 20 |
| 2 | .125 | 48 | 3 | 480 | 30 |
| 3 | .1875 | 64 | 4 | 640 | 40 |
| 4 | .25 | 80 | 5 | 800 | 50 |
| 5 | .3125 | 96 | 6 | 960 | 60 |
| 6 | .375 | 112 | 7 | 1120 | 70 |
| 7 | .4375 | 128 | 8 | 1280 | 80 |
| 8 | .5 | 144 | 9 | 1440 | 90 |
| 9 | .5625 | 160 | 10 | 1600 | 100 |
| 10 | .625 | ||||
| 11 | .6875 | ||||
| 12 | .75 | ||||
| 13 | .8125 | ||||
| 14 | .875 | ||||
| 15 | .9375 | ||||
| 16 | 1.0 | ||||
Omregner 
(max. 3 decimaler)
6 tekststørrelser kan angives med nøgleord:
| Keyword | pixel | em/rem | |
|---|---|---|---|
| x-small | 10 | 0.625 | |
| small | 13 | 0.8125 | |
| medium | 16 | 1.0 | |
| large | 18 | 1.125 | |
| x-large | 24 | 1.5 | |
| xx-large | 32 | 2.0 |
H1 - H6 teksterne har følgende størrelser.
| Tekst | Rem |
|---|---|
| H1 | 2.5 |
| H2 | 2 |
| H3 | 1.75 |
| H4 | 1.5 |
| H5 | 1.25 |
| H6 | 1 |
Bootstrap 4 - Tekster