Az órán megismerkedtünk a CSS stílussablonokkal. Külön felületen módosíthatjuk a betűtípusokat, azok méretét, stílusát, színét, valamint szövegigazítás, keretezés, árnyék készítése is lehetséges.
Mozis oldalunkon alapvető módosításokat hajtottunk végre. Emlékeztetőül itt láthatjátok:
html {
background: #e6e9e9; / az oldal háttérszíne
}
body {
background: #F5E7C8; /a megjelenő felület háttérszíne
box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
color: #545454; /betűszín
font-family: “Franklin gothic”, Helvetica, Arial, sans-serif; /betűtípus
font-size: 16px; /betűméret
line-height: 2; /sortávolság
margin: 0 auto; /margó
max-width: 800px; /dokumentum szélessége
padding: 2em 2em 4em;
}
h1, h2, h3, h4, h5, h6 { /címsorokra vonatkozó beállítások
color: #220891;
font-family: monospace;
font-weight: 600; /betűk vastagsága
line-height: 1.3; /sortávolság
}
h2 {
margin-top: 1.3em;
}
h1{
text-align: center; /szövegigazítás
border: 2px solid rgba(0,0,0,12) /keretezés
}
img { /képre vonatkozó beállítások
animation: colorize 2s cubic-bezier(0, 0, .78, .36) 1;
background: transparent;
border: 10px solid rgba(0, 0, 0, 0.12);
border-radius: 4px;
display: block;
margin: 1.3em auto;
max-width: 95%;
}
button { /gombra vonatkozó beállítások
background-color: #545454;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
}
Az alábbi oldal nagy segítségedre lehet különböző beállítások végrehajtásában:
https://www.w3schools.com/css/default.asp