Susipažinkite su pakopiniais stiliaus lapais naudodami šį CSS kodų lapą

Apibrėžkite pagrindinius kiekvienos kuriamos svetainės stilius

TurinysIšskleisti

• Simbolių rinkinys
• Puslapio korpuso stiliaus kūrimas
• Numatytieji šriftų stiliai
• Antraštės
• Stiliaus nuorodos
• Visas stiliaus lapas

Kada tu sukurti svetainę nuo nulio , protinga pradėti nuo pagrindinių apibrėžtų stilių. Tai tarsi pradžia nuo švarios drobės ir šviežių šepečių. Viena iš pirmųjų problemų, su kuria susiduria interneto dizaineriai, yra ta žiniatinklio naršyklės visi yra skirtingi. Numatytasis šrifto dydis įvairiose platformose skiriasi, numatytoji šriftų šeima skiriasi, kai kurios naršyklės apibrėžia teksto žymos paraštes ir užpildymą, o kitos – ne ir pan. Apeikite šiuos neatitikimus nustatydami numatytuosius savo tinklalapių stilius.

CSS ir simbolių rinkinys

Pirmiausia nustatykite savo CSS dokumentų simbolių rinkinį utf-8 . Nors tikėtina, kad dauguma jūsų sukurtų puslapių yra parašyti anglų kalba, kai kurie gali būti lokalizuoti – pritaikyti įvairiam kalbiniam ir kultūriniam kontekstui. Kai jie yra, utf-8 supaprastina procesą. Simbolių rinkinio nustatymas išorinis stiliaus lapas neturės viršenybės prieš HTTP antraštę, bet visose kitose situacijose taip bus.

Nesunku nustatyti simbolių rinkinį. Pirmoje CSS dokumento eilutėje parašykite:

|_+_|

Tokiu būdu, jei naudojate tarptautinius simbolius turinio nuosavybėje arba kaip klasių ir ID pavadinimai , stiliaus lapas vis tiek veiks tinkamai.

Puslapio korpuso stiliaus kūrimas

Kitas dalykas, kurio reikia numatytojo stiliaus lapo, yra stiliai nulinės paraštės, užpildymas ir kraštinės . Taip užtikrinama, kad visos naršyklės turinį patalpins toje pačioje vietoje, o tarp naršyklės ir turinio nėra paslėptų tarpų. Daugumoje tinklalapių tai yra per arti teksto krašto, tačiau svarbu pradėti ten, kad fono paveikslėliai ir išdėstymo skyriai būtų tinkamai išdėstyti.

|_+_|

Nustatykite numatytąją priekinio plano arba šrifto spalvą į juodą ir numatytąją fono spalvą į baltą. Nors tai greičiausiai pasikeis daugeliui tinklalapių dizaino, tačiau šios standartinės spalvos bus nustatytos ant korpuso ir HTML žyma iš pradžių palengvina puslapio skaitymą ir darbą.

|_+_|

Numatytieji šriftų stiliai

Šrifto dydis ir šriftų šeima neišvengiamai pasikeis, kai tik dizainas įsigalios, bet pradėkite nuo numatytojo šrifto dydžio 1 in ir numatytasis šrifto šeima Arial, Ženevos ar kai kurių kitų sans serif šriftas . Naudojant ems, puslapis yra kiek įmanoma lengviau pasiekiamas, o šriftas be serifo yra geriau įskaitomas ekrane.

|_+_|

Nepamirškite nuorodų

Nuorodų spalvų stiliaus kūrimas beveik visada yra esminė dizaino dalis, tačiau jei jų neapibrėžsite pagal numatytuosius stilius, tikėtina, kad pamiršite bent vieną iš pseudoklasių. Apibrėžkite juos su nedideliu mėlynos spalvos variantu ir pakeiskite, kai nustatysite svetainės spalvų paletę.

Norėdami nustatyti nuorodos mėlynų atspalvių, rinkinys:

nuorodoskaip mėlynaaplankytos nuorodoskaip tamsiai mėlynaužveskite nuorodaskaip šviesiai mėlynaaktyvios nuorodoskaip dar blyškesnė mėlyna

Kaip parodyta šiame pavyzdyje:

|_+_|