Designet til ethvert nettsted er basert på bakgrunnsbilder og farger, som et hus på et fundament. Hvis du har et ønske om å erstatte det typiske fundamentet til Internett-ressursen din med noe mer individuelt, bør du starte med utviklingen av designet. Og når den er klar, vil den rent tekniske delen forbli, det vil si å erstatte den gamle utformingen av nettstedsbakgrunnen spesifisert i kildekoden til sidene med den nye. Det er flere måter å implementere dette på i praksis.
Bruksanvisning
Trinn 1
Først må du finne ut hvilken av måtene bakgrunnen er satt i den gjeldende versjonen av nettstedet. For å gjøre dette, åpne HTML-koden til siden. Du kan gjøre dette med en enkel teksteditor ved å laste ned filen fra serveren på forhånd. Eller du kan bruke redigereren på sidene til innholdsstyringssystemet, hvis du bruker en. Sideditoren krever ikke nedlasting av filen, men endrer den direkte på serveren ved hjelp av nettleseren som et grensesnitt. HTML-koden (HyperText Markup Language) på siden du åpner, består av instruksjonslinjer for nettleseren. De beskriver typene, utseendet og plasseringen av hvert av elementene på en webside. Disse instruksjonene blir ofte referert til som "tags". Rekkefølgen på kodene selv i sidekoden overholder også reglene for HTML-språket - de er delt inn i blokker, hvorav den første må være en overskriftsblokk som starter med en kode og slutter. Det skal følges av blokken som interesserer deg mer nå - dokumentets hoveddel. Det er begrenset til koder og. I åpningskoden til denne blokken () kan du legge inn informasjon om bakgrunnen til siden. Slik informasjon i koder kalles "attributter". Attributtet til kroppskoden som setter bakgrunnsfargen er betegnet som bgfarge, og i koden kan det se slik ut: Her setter vi bakgrunnsfargen for siden til sølv. Nettleseren kan gjenkjenne noen av fargene ved navn, men for å ikke ta feil, er det bedre å indikere heksadesimale koder. Denne versjonen med sølvfarge i heksadesimalt uttrykk vil se slik ut: Så du må finne koden som begynner med <body i sidekoden og sjekke om den har en bakgrunnsfarge. I så fall erstatter du fargeindikasjonen i den med den nye versjonen og lagrer endringene på siden.
Steg 2
Bakgrunnen i det nåværende designet på nettstedet ditt kan ikke settes etter farge, men av et bilde. Tilsvarende attributt til kroppskoden kalles bakgrunn, og det kan se slik ut i koden: Her er bakgrunnen bg.jpg-bildet fra img-mappen på serveren din. Hvis dette attributtet er til stede, bytt ut bildefilnavnet med navnet på det nye bildet, og husk å laste det opp til serveren. Hvis du vil erstatte bildet med en farge, erstatter du bakgrunnsattributtet med attributtet bgcolor, som vi beskrev ovenfor.
Trinn 3
Når du beskriver utseendet til sider med relativt kompleks design, bruk "cascading style sheets" - CSS (Cascading Style Sheets). Blokker av CSS-kode kan inkluderes direkte i sidekoden eller inneholdes i en ekstern fil med "css" -utvidelsen. Du må se etter stilbeskrivelseskoden som begynner med <stil i toppteksten til sidekoden (mellom kodene og). Hvis den inneholder en lenke til en ekstern fil, vil den se slik ut: @import "style.css"; Her er en lenke til et stilark med navnet style.css. Du må åpne den angitte filen for redigering. Og hvis det ikke er noen lenke, og etter åpningen <style tag er det stilinstruksjoner, så må du redigere dem her. I begge alternativene, blant beskrivelsene av stiler, må du se etter de som er relatert til hoveddelen av dokumentet (brødtekst). Denne blokken med beskrivelser kan se slik ut: body {
bakgrunnsfarge: Sølv;
farge svart;
} Her må du erstatte verdien til bakgrunnsfargeparameteren med verdien av den nye fargen og bedre i samme heksadesimale verdier. Bakgrunnsbildealternativet i CSS-instruksjonene skal se slik ut: body {
bakgrunn: # C0C0C0 url (img / bg.jpg) repeat-y;
farge svart;
} Her er lenken til bildet lik den som er diskutert ovenfor, og # C0C0C0 før lenken betyr at sideplassen som ikke er okkupert av bakgrunnsbildet, vil ha en sølv bakgrunn. "Gjenta-y" indikerer at bakgrunnsbildet skal multipliseres langs Y (vertikal) akse."Repeat-y" kan erstattes med "repeat-x" (horisontal replikasjon) eller "no-repeat" (ikke replikere). Hvis du ikke spesifiserer gjenta i det hele tatt, vil bakgrunnsbildet bli flislagt til bakgrunnsområdet på siden i alle retninger.