[ 30. November 1999]
- Martin_Nemecek
CSS - Cascading Style Sheets [·vod do problematiky]
KaskßdovΘ Üt²ly, alebo CSS [ Cascading Style Sheets], s· ve╛mi siln²m nßstrojom pre v²vojßrov a tvorcov web strßnok.
PovedanΘ trochu nadsadene, CSS vytvßraj· konzistenciu medzi videnφm, cφtenφm html strßnok a ich zobrazenφm. Ich silnou zbra≥ou s· ve╛kΘ mo₧nosti
kontroly nad designom a samotn²m tvorenφm strßnky.
V tomto serißly Vßs nauΦφme ako pracova¥ s CSS, na Φo si treba dßva¥ pozor pri Üt²loch a ako ich zaΦle≥ova¥ do VaÜich strßnok.
Na zobrazenie strßnok a vÜetk²ch nov²ch vlastnostφ, obohaten²ch o CSS, treba pou₧i¥ prehliadaΦe MS Internet Explorer 4.0+,5.0+, alebo
Netscape 4.0+. Aj ke∩ treba poveda¥, ₧e Netscape v terajÜej verzii svojich prehliadaΦov, nepodporuje CSS v takej miere ako MS IE a je od neho v tejto oblasti troÜku pozadu. Pln· podporu CSS sσubuje Netscape v pΣ¥kovej verzii svojho prehliadaΦa, ktor² ma by¥ k dispozφcii koncom tohto roku.
Dnes sa zameriame na prvΘ ·vodnΘ slovß o Kakßdov²ch Üt²loch.
CSS pon·kaj· web designΘrom dos¥ nßstrojov a funkciφ na publikovanie a sprßvu web sajtov. S CSS m⌠₧eme Üpecifikova¥ naprφklad ve╛kos¥ FONTov pφsma,
atrib·ty FONTu (italics, podΦiarknut², at∩.), zarovnanie odstavcov, farby, medzery, pozφcie a ve╛a ∩alÜφch.
Pou₧itφm CSS m⌠₧eme aplikova¥ r⌠zne atrib·ty jednotliv²ch tagov na strßnke. Tieto atrib·ty sa vyjadruj· pomocou
"predpisov". Ka₧d² predpis je priraden² jednΘmu selektoru, naprφklad P, FONT, A a podobne, ktorΘ sa nßsledne na to pou₧ij· na strßnke. Naprφklad chceme nastavi¥ tag <P> na zobrazenie nasledovn²ch parametrov textu: pφsmo font - Ms Sans Serif, ve╛kos¥ 12 bodov, so ₧lt²m pozadφm.
Pou₧ijeme nasledovn² predpis:
P { font-family: "ms sans serif";
font-size: 12pt; background-color: yellow; }
Po∩me si sk·si¥ zaΦleni¥ nejak² Üt²l do html strßnky. Najsk⌠r si ukß₧eme klasick· html strßnku bez Üt²lov.
<html>
<head>
<title>Vitajte na mojej domovskej strßnke</title>
</head>
<body>
<h1>Vitajte na mojej domovskej strßnke</h1>
<p>Dnes si sk·Üame CSS</p>
</body>
</html>
V²sledn² HTML s·bor..
No a teraz ideme na ostro u₧ s Cascading Style Sheets:
<STYLE TYPE="text/css"><!--
P { font-family: "ms sans serif";
font-size: 12pt;
background-color: yellow; }
H1 { font-family: "impact, arial";
font-size: 35pt;
color: red; }
--></STYLE>
V²sledn² HTML s·bor..
D⌠le₧itΘ je dodr₧a¥ medzery a znakovΘ konvencie, inak by zobrazenie strßnky nemuselo zodpoveda¥ nastaveniu CSS.
To╛ko na dnes, na bud·ce budeme pokraΦova¥ druhou Φas¥ou o CSS, tak₧e dovtady sa majte krßsne :-)
|
|
|