Miért kellenek nekünk CSS osztályok? És hogyan használjuk?
Forráskód:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> Mátyás király mese </title>
<style>
.sargaj {
background-color: yellow;
text-align: right;
}
</style>
</head>
<body>
<p>
<div class="sargaj">
S a két király fél országát tette igazának. Abban egyezkedtek, hogy a huszár megy el a Burkus királyhoz a nagy próbára.<br/> Volt egy nagy hiba. Burkus nem tudott magyarul, a huszár meg burkusul. A király ugyancsak törte az eszét, amivel tőrbe csalja a huszárt.<br/>
</div>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/48/Andrea_Mantegna_-_King_Matthias_Corvinus_of_Hungary.jpg/375px-Andrea_Mantegna_-_King_Matthias_Corvinus_of_Hungary.jpg" />
</p>
<div style="background-color:red; width:50%;border:5px solid blue;margin:30px;padding:45px">
<p>
Megérkezik a huszár Burkus dísztermébe.<br/> Keményen megáll és várja a következendőket.<br/> A király jelekkel értekezik a huszárral. Jobb kezét felemeli és hüvelykujjával egyet mutat. A huszár ugyancsak válaszol, és kettőt mutat. Erre a király kitárja két karját. A huszár válaszol: felemeli ökölbe szorított kezét. A király felemel egy nagy törvénykönyvet az asztalról, a huszár erre hüvelyéből kivonja a kardját, és négyfelé vág a levegőbe véle.
</p>
</div>
<p>
<div class="sargaj">
Ezzel megfelelt a király kitűzött három jelére, s győzött a huszár. Tarisznyáját mindjárt arannyal tömték meg és hazabocsátották egy levéllel, amit Mátyásnak küldte
</div>
</p>
<img src="kep/cimer.jpg" />
</body>
</html>
Videók: