Rame rondom prente of teks versier die webwerf en gee 'n verskeidenheid van ontwerp. As u tabelle gebruik om rande te skep, neem die kode vir elke rand te veel ruimte in beslag. In hierdie geval moet u die HTML-kode vir elke raamwerk herskryf. Met CSS kan u maklik 'n rand van elke dikte en kleur skep wat u wil hê deur een keer 'n eenvoudige kode te skryf vir al die elemente wat deur hierdie rand omring word. Met hierdie tegnologie kan, indien nodig, die tipe rame op die werf binne 'n paar minute verander word.
Dit is nodig
- - u eie webwerf hê;
- - weet wat CSS is en waar hierdie style op die webwerf geskryf word.
Instruksies
Stap 1
Om 'n rand te skep, skryf eers die volgende kode in CSS:
ramka {}
Stap 2
Om die rand die grootte te maak, gebruik die parameter grenswydte, wat die lynwydte in pixels stel. As die raamlyn byvoorbeeld 3 pixels breed moet wees, sal die invoer so lyk:
ramka {grenswydte: 3px;}
Stap 3
Definieer nou die styl van die rand met behulp van die grensstylparameter. As u 'n rand wil skep waarvan die sye gewone, effense lyne het, plaas dan die volgende in die kode tussen die krullerige hakies - randstyl: solied.
Stap 4
'N Stippelrand kan verkry word deur dit so te skryf: grensstyl: gestippeld. Kontrolering van grensstyl: gestippel sal u 'n stippellyn gee.
Stap 5
U kan die rand so 'n dubbele soliede lyn maak: randstyl: dubbel. Gebruik randstyl: groef of randstyl: rand om teks of beelde in raamwerke met 3D-newe-effekte te raam. Die verskil tussen hierdie twee opsies is dat die raam in die eerste geval bestaan uit ingespringde lyne, en in die tweede, konvekse.
Stap 6
Gebruik hierdie kode: border-style: inset om die effek van 'n inlas met die rand van 'n webwerf-element te skep. Om die inhoud van die rand, tesame met die grens, integendeel konveks te maak, skryf grensstyl: begin.
Stap 7
U kan die gewenste kleur by die raam voeg deur die randkleurparameter te gebruik, ook tussen die krullerige hakies geplaas. As u die rand rooi wil maak, skryf dan randkleur: rooi, blou - randkleur: blou, oranje - randkleur: oranje.
Stap 8
Die CSS-grenskode, insluitend alle opsies, lyk soos volg:
ramka {grenswydte: 3px; grensstyl: solied; randkleur: blou;}
Stap 9
Skryf dit nou in HTML:
Raaminhoud Plaas die teks of kode van die gewenste prentjie in plaas van die frase "Raaminhoud".
Stap 10
U kan dus 'n onbeperkte aantal elemente op die webwerf ontwerp. Om die voorkoms van die raam te verander, hoef u slegs die CSS-kode te verander.
