Photoshop er et grafisk design og bilderedigering program utviklet av Adobe. Det er markedsleder i digital bilderedigering programvare. Sine evner inkluderer muligheten til å opprette og manipulere grafikk for print og web -bruk. Det inkluderer også mange funksjoner for å bistå brukere i webdesign og koding. Ikke bare kan programvaren optimalisere bilder for web -bruk, kan det også generere stilsett og HTML for å inkludere grafikk på websider . Du trenger
HTML-redigering programvare
Vis flere instruksjoner
en

Lag din image . Når du er ferdig , kan du bruke Photoshops " Slice "-verktøyet til å dele inn bildet i seksjoner . Bruk " Slice Select "-verktøyet til å endre navn på hver seksjon med navn som tilsvarer organiseringen av nettstedet. For eksempel, hvis ditt bilde inkluder navigasjonsknapper , navn seksjoner i dette området " nav . " Disse delene vil tilsvare " div " koder i CSS -kode.
2

På menylinjen klikk "File " og velg " Lagre for Web og enheter . " Velg " to - Up" eller " 4 -Up " fra kategoriene ovenfor bildeområdet for et utvalg av forhåndsvisninger . Velg alternativene du ønsker bildet i " Preset delen ." Velg forhåndsvisning av bildet som passer best til dine visuelle spesifikasjoner . Klikk på " Lagre".
3

Skriv inn navnet på filen i " File Name "-feltet . Velg " HTML og bilder" i "Lagre som type" feltet . Velg " Annet" i feltet Innstillinger . En " Output Settings" dialogen vises. I Innstillinger drop- down velg " Custom ." Velg "Next "-knappen til du ser " Slice Output" -delen. Velg " Generer CSS "-knappen .
4

Velg output format av CSS i Referenced menyen . For et eksternt stilark , velge " ID " eller "Ved Class. " Din CSS vil bli organisert av hva element du velger. Hvis du vil at CSS for å være inline ( inkludert på toppen av HTML-siden ) velg " Inline ".
5

Komplett velge andre alternativer i Output Settings . Når du er ferdig, klikk "OK. " I Slices feltet velge hvilke skiver du ønsker å bli inkludert i CSS utgang. Kontroller at du har navigert til stedet der du vil at filen skal ligge i "Lagre optimalisert som " filbehandler området . Klikk på " Lagre".
6

Åpne HTML -filen du nettopp laget i HTML- redigering program . HTML- kode , komplett med CSS, vil være uansett hvor du lagret det på datamaskinen og klar til å enten sette inn i en nettside du oppretter eller som en frittstående nettside . Endre koden , om nødvendig, til din smak.
7

Åpne filen i nettleseren av valget for å se filen for å sjekke for eventuelle problemer og å sørge for at den passer bildet du opprettet i Photoshop.