Hvordan Lage Modulære Nett

Innholdsfortegnelse:

Hvordan Lage Modulære Nett
Hvordan Lage Modulære Nett

Video: Hvordan Lage Modulære Nett

Video: Hvordan Lage Modulære Nett
Video: DIY Room Decor! 10 DIY Room Decorating Ideas for Teenagers (DIY Wall Decor, Pillows, etc.) 2024, Kan
Anonim

Det er praktisk å bruke modulære nett når du utvikler et design eller lager et komplekst bilde. De tjener som grunnlag for sammensetningen, og deler arket i et spesifisert antall vertikale og horisontale trinn med samme eller forskjellige avstander.

Hvordan lage modulære nett
Hvordan lage modulære nett

Nødvendig

Abode Photoshop-program

Bruksanvisning

Trinn 1

Alle moderne grafiske redaktører og webdesignprogrammer har innebygde modulære nett. Hvis du jobber i Adobe Photoshop, slår du på rutenettet for enkel plassering av bildeobjekter og deres nøyaktige plassering på arket. For å gjøre dette, gå til menyelementet Rediger og flytt musen over preferanseteksten. I menyen som vises velger du elementet Guides, Grid & Slices (avhengig av programversjonen, kan dette elementet ha forskjellige navn, velg ordet Grid).

Steg 2

I innstillingsvinduet som åpnes, angir du parametrene til modulrutenettet. I rutenettet velger du fargen på linjene som danner rutenettelementene og linjeavstanden. Klikk "OK", og sjekk hvordan endringene som er gjort vil påvirke utseendet på bildet. I Adobe DreamWeaver webutviklingsmiljø er rutenettet som standard inkludert i utformingen av siden du utvikler.

Trinn 3

Du kan legge til forskjellige tabeller (rutenettelementer) med ethvert sett med rader og kolonner ved hjelp av elementet Sett inn tabell, samt sette inn nye tabeller i celler, og derved skape et komplekst nettverk for å bygge sideelementer.

Trinn 4

Du kan opprette et modulært rutenett manuelt ved hjelp av CSS-stiler. For å gjøre dette, bruk verktøyene #grid, Gridmaker, CSS Grid Builder, 1 KB CSS Grid, Gridr Buildrrr og andre moduler. Følgende kodebit oppretter for eksempel et rutenett med fire moduler med en gitt bredde:.page-layout {margin-right: -5px; }.layout-box {float: left; margin: 0 5px 5px 0; }.lb-1 {bredde: 779px; } / * 100% * /. Lb-2 {bredde: 583px; } / * 75% * /. Lb-3 {bredde: 387px; } / * 50% * /. Lb-4 {bredde: 191px; } / * 25% * /

Trinn 5

Tilstedeværelsen av et modulært rutenett gjør det lettere for både nybegynnere og webutviklere, og erfarne mestere innen dette feltet. Prosjekter laget på grunnlag av et modulært rutenett er enkle å redigere og overføre, noe som er veldig praktisk for store mengder arbeid. Du kan også når som helst stoppe arbeidet og fortsette å bruke den lagrede filen.

Anbefalt: