Slik bruker du tekstpanelet i Dreamweavers CSS Property Panel

Dreamweaver Tekst-panelet har en samling alternativer som kontrollerer visningen av teksten på sidene dine. Du kan få tilgang til tekstpanelalternativene ved å rulle nedover egenskapspanelet til du kommer under layoutalternativene, eller ved å klikke på T-ikonet øverst i panelet.

Tekstpanelet inneholder følgende formateringsalternativer:

• Farge: Angi tekstfargen. Du kan klikke på fargebrønnen og velge en farge, bruke pipetten til å prøve en hvilken som helst farge på skjermen, eller angi en heksadesimal fargekode i fargefeltet. Hvis du angir en heksadesimal fargekode, inkluderer du begynnende pundtegnet (#).

• Font-Family: Definer en skriftfamilie eller en serie med familier. Du kan legge til skrifter fra din lokale harddisk eller fra Adobe TypeKit ved å velge Administrer fonter nederst i rullegardinlisten og åpne dialogboksen Administrer fonter.

  

• Skriftstil: Skriv inn Normal, Kursiv eller Skrå. Kursiv og skrå er imidlertid sjelden forskjellige i en nettleser, så hold deg til kursiv med mindre du har en spesifikk grunn til å la være.

• Skriftvariant: Endre tekst til små bokstaver. Test designene dine nøye fordi dette attributtet ikke støttes av alle nettlesere.

• Skriftvekt: Få tekst til å se fet ut ved å velge fet eller fet fra rullegardinlisten. Du kan også angi et tall mellom 100 og 900 for mer presist å kontrollere hvor fet teksten vises. For å fjerne fet formatering, velg Normal eller Lysere.

• Skriftstørrelse: Definer størrelsen på teksten. Du kan velge en spesifikk numerisk størrelse eller en relativ størrelse. Størrelsesalternativer er piksel (px), punkt (pt), pica (pc), prosent (%), em, rem, ex og ch. Piksler, ems og prosenter er de mest brukte alternativene for tekststørrelser.

• Linjehøyde: Angi høyden på linjen som teksten er plassert på. På samme måte som tekststørrelse, kan du spesifisere linjehøyde på en rekke måter, inkludert piksler, ems og prosenter. Det er god praksis på nettet å legge til linjehøyde fordi økende plass rundt teksten din gjør det lettere å lese på en dataskjerm.

• Tekstjustering: Venstrejuster, høyrejuster, sentrer eller juster teksten ved å klikke på det tilsvarende ikonet. Det første ikonet, for Inherit, er standard. Du kan for eksempel sentrere teksten i bunnteksten på nettsiden din ved å inkludere Text-Align satt til Sentrering i definisjonen av en stil du bruker på

  tag nederst på siden.

• Tekstdekorering: Angi om tekst skal understrekes, overstrekes, vises med gjennomstreking eller vises med blinkeffekten. Du kan også velge Ingen, som ofte brukes til å fjerne understreking fra lenket tekst.

• Tekstinnrykk: Angi hvor mye tekst skal rykkes inn fra venstre side av siden ved å skrive inn et tall i ett av størrelsesalternativene, for eksempel piksler, ems eller prosenter.

Hvorfor så mange fonter?

Du har kanskje hørt at du nå kan bruke hvilken som helst skrift du vil på nettsidene dine, takket være den nyeste versjonen av Cascading Style Sheets, CSS3. Denne påstanden er sann, men med noen begrensninger: Du må ha lovlig rett til å publisere skriften, og skriften må ligge på en webserver.

For å sikre at teksten vises slik du har tenkt, inkluderer Dreamweaver samlinger av de vanligste skriftene på Windows- og Macintosh-datamaskiner. Disse skriftene er gruppert i familier, som f.eks

• Gotham, Helvetica Nue, Helvetica, Arial, sans serif

• Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, Times og serif

Du kan lage dine egne skriftsamlinger ved å bruke dialogboksen Administrer skrifter, som er tilgjengelig ved å velge alternativet Administrer fonter nederst i rullegardinlisten Font-Family i Tekst-panelet i CSS Designer-panelet.

Tekst-skygge-delen av tekstpanelet

Tekst-Shadow-delen av Tekst-panelet inneholder verktøy for å legge til tekstskygger, en av de nyeste CSS-egenskapene inkludert i CSS3-definisjonen. De mest populære alternativene er følgende:

• H-skygge: Legg til en skygge til teksten din på den horisontale aksen. Velg først et størrelsesalternativ, og skriv deretter inn et tall i feltet. Skriv for eksempel inn 2px for å legge til en horisontal skygge som er 2 piksler bred.

• V-skygge: Legg til en skygge til teksten din på den vertikale aksen. Velg først et størrelsesalternativ, og skriv deretter inn et tall i feltet.

• Uskarphet: Kontroller mengden uskarphet i skyggen. Jo større tall, jo mer er skyggen spredt ut eller uskarp.

• Farge: Angi en heksadesimal fargekode for å spesifisere fargen på skyggen, eller bruk pipetten til å prøve hvilken som helst farge på skjermen.

  

Funksjonene nederst i tekstpanelet, som ikke er like vanlige som de andre tekstpanelalternativene, er som følger:

• Tekst-transform: Endre store og små bokstaver i teksten. Alternativene er store bokstaver, store bokstaver og små bokstaver. Klikk på det tilsvarende ikonet for å angi denne egenskapen.

• Bokstavavstand: Definerer hvor mye mellomrom som settes inn mellom bokstaver. Størrelsesalternativer er piksel (px), punkt (pt), pica (pc), prosent (%), em, rem, ex og ch.

• Ordavstand: Definerer mengden mellomrom som settes inn mellom ordene. Størrelsesalternativer er piksel (px), punkt (pt), pica (pc), prosent (%), em, rem, ex og ch. (Se forrige sidefelt "Sammenligning av CSS-størrelsesalternativer.")

• White-Space: Fortell nettleseren hvordan den skal håndtere linjeskift og mellomrom i en tekstblokk. Alternativene dine er Arv, Normal, Nowrap, Pre, Pre-line eller Pre-wrap. Nowrap er spesielt nyttig fordi det forhindrer at elementer separeres hvis de må pakkes inn for å passe inn i et nettleservindu eller en annen beholder.

• Vertical-Align: Juster innebygde elementer, som tekst og bilder, i forhold til elementene som omgir dem. Du kan angi en numerisk verdi eller velge Baseline, Sub, Super, Top, Text-Top, Middle, Bottom og Text-Bottom.