CSS is 'n kaskadende stylblad, wat 'n taal is om die voorkoms van webblaaie te beskryf. Een van die belangrikste voordele van CSS is die vermoë om tafeluitleg deur blokuitleg te vervang.
Dit is nodig
HTML-kode redakteur
Instruksies
Stap 1
Skep die eerste blok. In HTML-vorm sal dit lyk soos 'n div-tag met die id 'block01'. Hier dui die block01-identifiseerder aan dat in die CSS-beskrywing al die eienskappe van hierdie blok vir die # block01-kieser gespesifiseer word.
Stap 2
Beskryf die blok in CSS. Spesifiseer die naam van die identifiseerder in die CSS-style (# blok01) en beskryf die parameters in krullerige hakies - breedte, posisionering, offset, agtergrondkleur, ens. Dit kan byvoorbeeld soos volg lyk: # block01 {width: 150px; hoogte: 150px; posisie: absoluut; bo: 0px; links: 0px; agtergrondkleur: pienk}. Hierdie beskrywing gaan van die veronderstelling uit dat die kassie 150 pixels lank en 150 pixels breed is, dat dit styf in die linkerbovenhoek van die dokument geplaas word, en die agtergrond daarvan sal pienk gekleur wees.
Stap 3
Gee die blok 'n relatiewe posisie. As u nie absolute, maar relatiewe posisionering in die CSS-beskrywing gebruik nie, kan u blokke plaas, nie met 'n stewige breek na 'n rooster van koördinate nie, maar relatief tot ander bestaande blokke. Verander die kode-posisie om dit te doen: absoluut; bo: 0px; links: 0px per posisie: relatief; bo: 200 px; links: 100 px.
Stap 4
Gee die blok 'n afronding. In CSS is die grensradiusverklaring hiervoor verantwoordelik. Voeg die volgende kode by u stylblad: grensradius: 8 px. Die blok sal nou afgeronde hoeke hê. As u net enkele hoeke wil afrond, moet u die radius vir elkeen afsonderlik beskryf: grensradius: 8px 8px 0px 0px.
Stap 5
Gee die blok 'n beroerte. Om die buitelyn van 'n blok met 'n dun lyn uit te lig, voeg u die volgende kode by die CSS-beskrywing: rand bo: 1px swart gestippel. Hierdie instruksie beteken dat die rand van die blok swart sal wees en een pixel in dikte sal wees. In hierdie geval sal die kontoerlyn self as 'n stippellyn vertoon word (stippel - 'n stippellyn, stippel - kolletjies, solied - 'n soliede lyn).
Stap 6
Stel die oorblywende blokkeienskappe in. Spesifiseer in die CSS-beskrywing watter lettertipe vir die teks binne die blok gebruik moet word, wat die lettergrootte, belyning en inspringing vanaf die rand van die blok moet wees. Hierdie eienskappe word beskryf in die definisies font-family, font-size, text-align en padding.
Stap 7
U kan die float-eienskap gebruik om die vloei van een blok oor 'n ander aan te pas. As u dit op "links" stel, dan vloei die res van die elemente links om die blok en "regs" - aan die regterkant. As u die drywingswaarde as "geen" stel, sal die blokbelyning nie ingestel word nie. Die duidelike eienskap in CSS verhoed dat die blok na regs, links of beide kante toe vloei, en vervang die float-stelling.
