Rammer plassert rundt bilder eller tekst dekorerer nettstedet og tilfører variasjon i designet. Hvis du bruker tabeller for å lage rammer, vil koden for hver ramme ta for mye plass. I dette tilfellet må du også skrive om HTML-koden for hver ramme. Med CSS kan du enkelt lage en kant av hvilken tykkelse og farge du vil ved å skrive en enkel kode en gang for alle elementene som vil være omgitt av denne kanten. Denne teknologien vil, om nødvendig, endre typen rammer på nettstedet i løpet av et par minutter.
Det er nødvendig
- - ha din egen nettside;
- - vet hva CSS er og hvor disse stilene er skrevet på nettstedet.
Bruksanvisning
Trinn 1
For å lage en grense, skriv først følgende kode i CSS:
ramka {}
Steg 2
For å gjøre rammen til den størrelsen du vil bruke, bruk parameteren border-width, som angir linjebredden i piksler. Hvis for eksempel rammelinjen skal være 3 piksler bred, vil oppføringen se slik ut:
ramka {border-width: 3px;}
Trinn 3
Definer nå stilen til rammen ved hjelp av parameteren border-style. Hvis du vil lage en kant med sidene som er jevne med faste linjer, legger du følgende oppføring i koden mellom krøllete bukseseler - kantlinjestil: solid.
Trinn 4
En stiplet kant kan fås ved å skrive den slik: border-style: stiplet. Kontroll av kantstil: stiplet vil gi deg en stiplet kant.
Trinn 5
Du kan gjøre rammen til en dobbel hel linje som dette: border-style: double. Bruk border-style: groove eller border-style: ridge for å ramme inn tekst eller bilder i rammer med 3D-bivirkninger. Forskjellen mellom disse to alternativene er at rammen i det første tilfellet består av innrykkede linjer, og i det andre konvekse.
Trinn 6
Bruk denne koden: border-style: inset for å skape effekten av et innlegg med rammen til et nettstedselement. For å gjøre innholdet på grensen, sammen med grensen, tvert imot, konveks, skriv kantstil: utgangspunkt.
Trinn 7
Du kan legge til ønsket farge i rammen ved hjelp av parameteren border-color, også plassert mellom de krøllete bukseselene. Hvis du vil gjøre grensen rød, så skriv kantfarge: rød, blå - kantfarge: blå, oransje - kantfarge: oransje.
Trinn 8
CSS-grensekoden, inkludert alle alternativer, ser slik ut:
ramka {kant-bredde: 3px; border-stil: solid; kantfarge: blå;}
Trinn 9
Nå, i HTML, skriv dette:
Rammeinnhold I stedet for uttrykket "Rammeinnhold", sett inn teksten eller koden til ønsket bilde.
Trinn 10
Dermed kan du designe et ubegrenset antall elementer på nettstedet. For å endre utseendet på rammen, trenger du bare å endre CSS-koden.