CSS je kaskadni slog, ki je jezik za opis videza spletnih strani. Ena glavnih prednosti CSS je možnost zamenjave postavitve tabele z blokovsko postavitvijo.
Potrebno je
Urejevalnik HTML kode
Navodila
Korak 1
Ustvari prvi blok. V obliki HTML bo videti kot oznaka div z id 'block01'. Tu identifikator block01 označuje, da so v opisu CSS vse lastnosti tega bloka podane za izbirnik # block01.
2. korak
Opišite blok v CSS. V slogih CSS določite ime identifikatorja (# block01) in v kodrastih oklepajih opišite njegove parametre - širina, položaj, odmik, barva ozadja itd. Na primer, lahko je videti tako: # block01 {width: 150px; višina: 150px; položaj: absolutno; zgoraj: 0px; levo: 0px; barva ozadja: roza}. Ta opis predvideva, da bo polje dolgo 150 in široko 150 slikovnih pik, togo bo postavljeno v zgornji levi kot dokumenta, njegovo ozadje pa bo obarvano rožnato.
3. korak
Dajte bloku relativno pozicioniranje. Če v opisu CSS ne uporabljate absolutnega, ampak relativnega pozicioniranja, lahko postavite bloke ne s togo zaskočitvijo v mrežo koordinat, temveč glede na druge že obstoječe bloke. Če želite to narediti, spremenite položaj kode: absolute; zgoraj: 0px; levo: 0px po položaju: relativno; zgoraj: 200 slikovnih pik; levo: 100 slikovnih pik.
4. korak
Dajte bloku zaokroževanje. V CSS je za to odgovoren stavek border-radius. V tabelo slogi dodajte naslednjo kodo: border-radius: 8px. Zdaj bo blok imel zaobljene vogale. Če želite zaokrožiti samo nekatere vogale, za vsakega posebej opišite polmer: border-radius: 8px 8px 0px 0px.
5. korak
Dajte bloku kap. Če želite poudariti obris bloka s tanko črto, v opis CSS dodajte naslednjo kodo: border-top: 1px dashed black. To navodilo pomeni, da bo obroba bloka črna in debela eno slikovno piko. V tem primeru bo kontura sama prikazana kot črtkana črta (črtkana - pikčasta črta, pikčasta - pike, polna - polna črta).
6. korak
Nastavite preostale lastnosti bloka. V opisu CSS določite, katero pisavo naj uporablja besedilo v bloku, kakšna naj bo velikost pisave, poravnava in zamik od robov bloka. Te lastnosti so opisane v definicijah družina pisav, velikost pisave, poravnava besedila in oblazinjenje.
7. korak
Lastnost float lahko uporabite za prilagajanje toka enega bloka nad drugim. Če jo nastavite na "levo", bodo preostali elementi tekali okoli bloka na levi in "desno" - na desni. Če plavajočo vrednost nastavite na »nič«, poravnava bloka ne bo nastavljena. Lastnost clear v CSS preprečuje, da blok teče na desno, levo ali obe strani, in preglasi stavek float.
