CSS (kaskadni slogovni list) opisuje elemente HTML, ki so prikazani na zaslon, papir , ali v drugih medijev . Prihrani veliko časa. Nadzira postavitev več spletnih strani hkrati. Določa velikost pisave, družina pisav, barva, barva ozadja na strani.
Omogoča nam dodajanje učinki oz animacije na spletno stran. Uporabljamo CSS prikazati animacije kot gumbi, učinki, nalagalniki oz vrtavke , in tudi animirana ozadja .
Brez uporabe CSS , spletno mesto ne bo videti privlačno. obstajajo 3 vrste CSS ki so spodaj:
- Vgrajeni CSS
- Notranji/vdelani CSS
- Zunanji CSS
1. Notranji CSS
Notranji CSS ima oznako v del od HTML dokument. Ta slog CSS je učinkovit način za oblikovanje posameznih strani. Uporaba sloga CSS za več spletnih strani je zamudna, ker zahtevamo umestitev stil na vsaki spletni strani.
Notranji CSS lahko uporabimo z naslednjimi koraki:
1. Najprej odprite HTML strani in poiščite
2. Za
3. Dodajte pravila CSS v novi vrstici.
primer:
body { background-color: black; } h1 { color: white; padding: 50px; }
4. Zaprite oznako sloga.
Po dodajanju notranjega CSS je celotna datoteka HTML videti takole:
body { background-color: black; } h1 { color: red; padding: 50px; } <h2>CSS types</h2> <p>Cascading Style sheet types: inline, external and internal</p>
Uporabljamo lahko tudi izbirnike (razred in ID) v slogovnem listu.
primer:
.class { property1 : value1; property2 : value2; property3 : value3; } #id { property1 : value1; property2 : value2; property3 : value3; }
Prednosti notranjega CSS
Slabosti notranjega CSS:
- Dodajanje kode v HTML dokument bo zmanjšal velikost strani in čas nalaganja spletne strani.
2. Zunanji CSS
V zunanjem CSS povezujemo spletne strani z zunanjim .css mapa. Ustvarja ga urejevalnik besedil . CSS je učinkovitejša metoda za oblikovanje spletnega mesta. Z urejanjem .css datoteke, lahko spremenimo celotno spletno stran hkrati.
Če želite uporabiti zunanji CSS, sledite spodnjim korakom:
1. Ustvarite novo .css datoteka z urejevalnik besedil , in dodajte Kaskadni slogovni list tudi pravila.
Na primer:
.xleftcol { float: right; width: 35%; background:#608800; } .xmiddlecol { float: right; width: 35%; background:#eff3df; }
2. Dodajte sklic na zunanje .css datoteko takoj zatem oznako v del od HTML list :
Prednosti zunanjega CSS:
- Naše datoteke imajo čistejšo strukturo in manjše velikosti.
- Uporabljamo enako .css datoteko za več spletnih strani v zunanjem CSS.
Slabosti zunanjega CSS:
- Strani ni mogoče pravilno dostaviti, preden se naloži zunanji CSS.
- V zunanjem CSS lahko nalaganje številnih datotek CSS podaljša čas prenosa spletnega mesta.
3. Vgrajeni CSS
Vgrajeni CSS se uporablja za oblikovanje posebnega HTML element. Dodaj a stil vsaki oznaki HTML brez uporabe izbirnikov. Upravljanje spletne strani je lahko težavno, če uporabljamo samo inline CSS . Vendar Inline CSS v HTML je uporaben v nekaterih situacijah. Nimamo dostopa do datoteke CSS ali uporabiti sloge za element.
V naslednjem primeru smo uporabili vgrajeni CSS Tukaj bo koristno. Prednosti inline CSS: Slabosti inline CSS: topologija omrežja
in