Hvordan Man Laver En Ramme På Et Websted

Indholdsfortegnelse:

Hvordan Man Laver En Ramme På Et Websted
Hvordan Man Laver En Ramme På Et Websted

Video: Hvordan Man Laver En Ramme På Et Websted

Video: Hvordan Man Laver En Ramme På Et Websted
Video: Я сделал свою собственную перетаскиваемую мышь (A4tech Bloody ABedless) 2024, November
Anonim

Rammer placeret omkring billeder eller tekst dekorerer stedet og tilføjer variation i dets design. Hvis du bruger tabeller til at oprette kanter, tager koden for hver kant for meget plads. I dette tilfælde skal du også omskrive HTML-koden for hver ramme. Med CSS kan du nemt oprette en kant med en hvilken som helst tykkelse og farve, du ønsker ved at skrive en enkel kode en gang for alle de elementer, der vil være omgivet af denne kant. Denne teknologi giver om nødvendigt mulighed for at ændre typen af rammer på webstedet om et par minutter.

Hvordan man laver en ramme på et websted
Hvordan man laver en ramme på et websted

Er det nødvendigt

  • - have dit eget websted;
  • - ved hvad CSS er, og hvor disse stilarter er skrevet på webstedet.

Instruktioner

Trin 1

For at oprette en grænse skal du først skrive følgende kode i CSS:

ramka {}

Trin 2

For at gøre rammen til den ønskede størrelse skal du bruge parameteren border-width, der angiver linjebredden i pixels. For eksempel, hvis rammelinjen skal være 3 pixels bred, vil posten se sådan ud:

ramka {border-width: 3px;}

Trin 3

Definer nu grænsestilen ved hjælp af parameteren grænsestil. Hvis du vil oprette en grænse, hvis sider er regelmæssige faste linjer, skal du sætte følgende post i koden mellem de krøllede seler - kantstil: solid.

Trin 4

En prikket kant kan opnås ved at skrive den således: border-style: prikket. Kontrol af kantstil: stiplet giver dig en stiplet kant.

Trin 5

Du kan gøre rammen til en dobbelt fast linje som denne: border-style: double. Brug kantstil: rille eller kantstil: kant for at indramme tekst eller billeder i rammer med 3D-bivirkninger. Forskellen mellem disse to muligheder er, at rammen i det første tilfælde består af indrykkede linjer og i den anden konvekse.

Trin 6

Brug denne kode: border-style: inset for at skabe effekten af et inset med grænsen til et sideelement. For at gøre indholdet af grænsen sammen med grænsen tværtimod konveks, skriv kantstil: udgangspunkt.

Trin 7

Du kan tilføje den ønskede farve til rammen ved hjælp af parameteren kant-farve, også placeret mellem de krøllede seler. Hvis du vil gøre rammen rød, skal du skrive kantfarve: rød, blå - kantfarve: blå, orange - kantfarve: orange.

Trin 8

CSS-grænsekoden, inklusive alle indstillinger, ser sådan ud:

ramka {kantbredde: 3 pixel; kant-stil: solid; kantfarve: blå;}

Trin 9

Skriv nu dette i HTML:

Rammeindhold I stedet for sætningen "Rammeindhold" skal du indsætte teksten eller koden på det ønskede billede.

Trin 10

Således kan du designe et ubegrænset antal elementer på webstedet. For at ændre rammens udseende behøver du kun ændre CSS-koden.

Anbefalede: