HTML feladatok

09 Internal és external CSS URL

09-00 Internal és external CSS - teszt URL

Feladat leírás:

<head>
<link rel="stylesheet" href="style.css" /> - External (külső) CSS fájlra hivatkozás.
<style> </style> - Internal (belső) CSS kód beszúrása a weboldalba.
</head>

Jelölők, azaz hivatkozások CSS-ben a HTML oldal elemeire:

body, div stb. - típusjelölők, azaz a HTML elemekre azok nevével hivatkozunk és kapcsos zárójelek között adjuk meg a formázást, mindegyiket pontosvesszővel lezárva.
Ha több elemet formázunk ugyanúgy, akkor azokat vesszővel elválasztva soroljuk fel. Például:
body {
background-color: lightyellow;
}
div, p, table {
color: blue;
font-style: italic;
}
# - azonosítóra (id) hivatkozás.
Például, ha van egy "piros" azonosítójú konténer a HTML-ben:
<div id="piros">aaaaaa</div>, arra így hivatkozhatunk:
#piros {
color: red;
}
. - osztályra (class) hivatkozás.
Stílusosztályokat akkor alkalmazunk, ha a formázást több helyen is szeretnénk használni.
Például, ha van két "lila" stílusosztállyal formázott elem a HTML-ben:
<div class="lila">aaaaaa</div>
<p class="lila">aaaaaa</p>, arra így hivatkozhatunk:
.lila {
color: purple;
}
Számtalan egyéb hivatkozási lehetőség van még, és azok kombinációi is, ezekről lásd részletesen a W3Schools: CSS Selectors oldalát.

Néhány CSS formázási lehetőség:

border: - keret rajzolása
width: - szélesség megadása
height: - magasság megadása
margin: - külső margó megadása
padding: - belső margó megadása
border-radius: - sarkok lekerekítése
/* megjegyzés */ - megjegyzés beszúrása

W3Schools: CSS How to
W3Schools: CSS Selectors

Oldd meg az alábbi űrlap feladatait: 09 HTML internal CSS - teszt

Ugrás az elejére

HTML feladatok (77 feladat)

Tartalomjegyzék

09 Internal és external CSS URL

09-00 Internal és external CSS - teszt URL