Fontos! - Alapvizsga HTML

1. box-shadow

.container{
    box-shadow: {h-offset} {v-offset} {blur} {color}
}

2. Grid

<div class="row row-cols-1 row-cols-md-2 row-cols-lg-4"></div>

Magyarázat:

• .row
• .row-cols-1 | Ez az alapot (jelenleg a telefonos szélesség) adja meg
• .row-cols-md-2 | ez a tabletes nézetet adja meg
• .row-cols-lg-4 | et a gépes nézetet adja meg

Bootstrapes grid méretek:

1. xs - telefonok, vagy 768px-nél keskenyebb kijelzők mérete
2. sm - szintén telefonok, vagy 768px-el egyenlő vagy annál szélesebb kijelzők mérete
3. md - tabletek, vagy 992px-el egyenlő, vagy annál szélesebb kijelzők mérete
4. lg - laptopok, asztali gépek, 1200px-el egyenlő vagy annál szélesebb kijelzők mérete

Ezeket lehet kombinálni is

3. Bootstrap:

Lépések:

1. Belinkelni a css-t
   ez történhet cdn-es linkkel, vagy helyileg megadott fájl segítségével

<link
    rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap.css" />

<link
    rel="stylesheet"
    href="bootstrap/css/bootstrap.css" />

4. Szöveghez:

Bootstrapes színek:

• .[text/bg]-danger
• .[text/bg]-info
• .[text/bg]-warning
• .[text/bg]-primary
• .[text/bg]-secondary
• .[text/bg]-success
• .[text/bg]-light
• .[text/bg]-dark
• .[text/bg]-muted
• .[text/bg]-white

Szöveg formázások

css:

• text-indent
• font-weight
• font-family
• font-size

bootstrap:

• fw-[bold/bolder/…]
• text-[center/left/right]