Dreamweaver CS6 For Dummies Cheat Sheet - dummies

Ved Janine Warner

Hvis du er ny for webdesign eller har opprettet HTML-sider i mange år, er Adobe Dreamweaver CS6 det ideelle verktøyet for å bygge ditt nettsted. I versjon CS6 finner du en ny velkomstskjerm og støtte for det siste i Cascading Style Sheets (CSS3) og HTML5. Dreamweaver er et populært program blant profesjonelle webdesignere, så vel som folk som ønsker å bygge nettsteder for sine hobbyer, klubber, familier og små bedrifter.

Adobe Dreamweaver CS6 velkomstskjerm

Dreamweaver er brukervennlig grafisk grensesnitt og kraftig liste over funksjoner som gjør det til et populært valg blant profesjonelle webdesignere, samt hobbyister. Med hver ny versjon tilbyr Dreamweaver CS6 nye funksjoner, men du finner fremdeles velkomstskjermbildet for å hjelpe deg med å komme i gang.

Dreamweaver CS6: Legge til tekstskygger med CSS3

I Dreamweaver CS6 kan du forbedre designene dine og gi sidene større dybde ved å legge til tekstskygger med CSS3-regler, det siste innen webteknologi. Hvis du legger til tekstskygger, blir ordene enklere å lese, spesielt hvis designen din har en komplisert bakgrunn, eller hvis bakgrunns- og tekstfarger mangler kontrast.

kreditt: Paul Gual, istockphoto. com

Dreamweaver CS6 inkluderer støtte for CSS3 tekstskygger når du bruker Egenskaper-panelet i CSS-stilpanelet. Du kan opprette klasse- eller ID-stiler med tekstskygger, og du kan legge til tekstskygger i eksisterende HTML-elementer ved å definere en tagstil, for eksempel overskriften 1-stil som brukes i bildet.

CSS3-koden som lager denne tekstskyggen, er

h1 {tekstskygge: 2px 2px 3px # 000;}

Tallene i koden angir at tekstskyggen skal strekke 2 piksler til høyre og 2 piksler under teksten med 3-piks-uskarphet. I tillegg er skyggen skapt med fargen svart, spesifisert av den forkortede heksadesimale fargekoden # 000.

Når du lager regler for tekstskygger, kan du angi opptil fire verdier:

• Horisontal og vertikal: De to første tallverdiene kreves og angir de horisontale og vertikale forskyvningene - avstanden som skyggeskyggen strekker seg under tekst (horisontal) og til høyre for teksten (vertikal).

• Blurradius: Den tredje verdien angir mengden av uskarphet i skyggen. Hvis du ikke inkluderer uskarphetradius, er standard 0, noe som gjør at skyggen vises som en solid farge.

• Farge: Den fjerde verdien spesifiserer fargen på skyggen og kan defineres ved hjelp av en heksadesimal fargekode eller en RGBa-fargekode.

Du kan legge til en tekstskygge ved hjelp av Egenskapsruten nederst på CSS-stilpanelet, som vist på bildet.For å gjøre dette, følg disse trinnene:

1. Klikk på Legg til eiendom-linken i venstre side av egenskapsruten for CSS-stiler.

2. Skriv inn CSS3-stilregelnavnet, tekstskyggen, eller velg stilregelen fra rullegardinlisten.

   Etter at navnet vises i venstre side, vises en liten pil til høyre.

3. Klikk for å velge pilen til høyre for tekstskygge.

   En boks vises.

4. Skriv inn X- og Y-kompensasjonene, uklarheten og fargen.

Nettsteder og ressurser for webdesignere

Erfarne webdesignere - uansett om de bruker Adobe Dreamweaver eller annen webdesignprogramvare - refererer ofte til elektroniske ressurser for å holde tritt med sine ferdigheter og legge til spesielle funksjoner på sine nettsteder. Denne listen gjør det enkelt for deg å finne noen nettsteder og elektroniske ressurser som kan hjelpe deg med dine webdesignprosjekter.

• Lyd og video-vertstjenester:

  • YouTube

  • Vimeo

  • SoundCloud

• Blogging og CMS-programmer

  • Blogger

  • Joomla

  • MovableType

  • TypePad

  • Tumblr > WordPress

  • Social Media Sharing Services

• Legg til dette

  • Lockerz Del

  • Trafikkrapporteringstjenester:

• Google Analytics

  • Yahoo! Web Analytics

  • HubSpot

  • Populære nettlesere:

• Apple Safari

  • Google Chrome

  • Microsoft Internet Explorer

  • Mozilla Firefox

  • Opera

  • Nettlesertestingstjenester:

• Adobe BrowserLab

  • BrowserShots

  • Kryss Browser Testing

  • Browser Sandbox fra Skjeen (tidligere Xenocode)

  • Dreamweaver, CSS og webdesignressurser:

• Dreamweaver Developer Center

  • Webdesign Training på DigitalFamily. com

  • W3 Konverteringer HTML5 og CSS3 Resources

  • En liste Apart