Tekstipaneelin käyttäminen Dreamweaverin CSS-ominaisuuspaneelissa

Dreamweaver Text -paneelissa on kokoelma vaihtoehtoja, jotka ohjaavat tekstin näyttämistä sivuillasi. Pääset tekstipaneelin asetuksiin rullaamalla Ominaisuudet-paneelia alaspäin, kunnes tulet Asettelu-asetusten alapuolelle, tai napsauttamalla T-kuvaketta paneelin yläosassa.

Teksti-paneeli sisältää seuraavat muotoiluvaihtoehdot:

• Väri: Aseta tekstin väri. Voit napsauttaa väriä ja valita värin, käyttää pipettiä näyttelemään mitä tahansa väriä näytöllä tai syöttää heksadesimaalivärikoodin värikenttään. Jos syötät heksadesimaalivärikoodin, sisällytä aloitusmerkki (#).

• Font-Family: Määritä kirjasinperhe tai sarja perheitä. Voit lisätä fontteja paikalliselta kiintolevyltäsi tai Adobe TypeKitistä valitsemalla avattavan luettelon alareunasta Hallitse kirjasimia ja käynnistämällä Hallitse fontteja -valintaikkunan.

  

• Fonttityyli: Syötä Normaali, Kursivointi tai Vino. Kursivointi ja vino ovat kuitenkin harvoin erilaisia ​​verkkoselaimessa, joten pysy kursiivilla, ellei sinulla ole erityistä syytä olla tekemättä.

• Fonttivariantti: Muuta teksti pieniksi kirjaimille. Testaa mallisi huolellisesti, koska kaikki selaimet eivät tue tätä määritettä.

• Fontin paino: Tee tekstistä lihavoitu valitsemalla Lihavoitu tai Lihavoitu avattavasta luettelosta. Voit myös kirjoittaa numeron väliltä 100–900 hallitaksesi tarkemmin, kuinka lihavoitu teksti näkyy. Voit poistaa lihavoitun muotoilun valitsemalla Normaali tai Vaaleampi.

• Font-Size: Määritä tekstin koko. Voit valita tietyn numeerisen koon tai suhteellisen koon. Kokovaihtoehdot ovat pikseli (px), piste (pt), pica (pc), prosentti (%), em, rem, ex ja ch. Pikselit, ems ja prosenttiosuudet ovat yleisimmin käytettyjä tekstikokojen asetuksia.

• Line-Height: Määritä sen rivin korkeus, jolle teksti sijoitetaan. Tekstin koon tapaan voit määrittää rivin korkeuden useilla eri tavoilla, mukaan lukien pikselit, ems ja prosentit. Verkossa on hyvä käytäntö lisätä rivin korkeutta, koska tekstin ympärillä olevan tilan lisääminen helpottaa lukemista tietokoneen näytöltä.

• Tekstin tasaus: Tasaa vasemmalle, tasaa oikealle, keskitä tai tasaa tekstiä napsauttamalla vastaavaa kuvaketta. Ensimmäinen Peri-kuvake on oletusarvo. Voit esimerkiksi keskittää tekstin verkkosivusi alatunnisteeseen sisällyttämällä tekstin tasauksen asetukseksi Center sen tyylin määritelmään, jota käytät

  tagi sivun alalaidassa.

• Tekstin koristelu: Määritä, onko teksti alleviivattu, yliviivattu, näytetäänkö yliviivauksella vai vilkkumistehosteella. Voit myös valita Ei mitään, jota käytetään usein poistamaan alleviivaus linkitetystä tekstistä.

• Tekstin sisennys: Määritä, kuinka paljon tekstiä sisennetään sivun vasemmasta reunasta syöttämällä numero johonkin kokovaihtoehdoista, kuten pikselit, ems tai prosenttiosuudet.

Miksi niin paljon fontteja?

Olet ehkä kuullut, että voit nyt käyttää mitä tahansa haluamaasi kirjasinta verkkosivuillasi Cascading Style Sheetsin uusimman version, CSS3, ansiosta. Tämä väite on totta, mutta tietyin rajoituksin: Sinulla on oltava laillinen oikeus julkaista kirjasin, ja fontin on oltava verkkopalvelimella.

Varmistaakseen, että tekstisi näkyy haluamallasi tavalla, Dreamweaver sisältää kokoelmat yleisimmistä kirjasimista Windows- ja Macintosh-tietokoneissa. Nämä fontit on ryhmitelty perheisiin, kuten

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

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

Voit luoda omia kirjasinkokoelmia Manage Fonts -valintaikkunan avulla, joka on käytettävissä valitsemalla Hallitse kirjasimia -vaihtoehto CSS Designer -paneelin Teksti-paneelin Kirjasinperhe-pudotusvalikon alaosasta.

Teksti-paneelin Text-Shadow-osio

Teksti-paneelin Text-Shadow -osiossa on työkalut tekstin varjojen lisäämiseen, joka on yksi uusimmista CSS3-määritelmään sisältyvistä CSS-ominaisuuksista. Suosituimmat vaihtoehdot ovat seuraavat:

• H-varjo: Lisää tekstiisi varjo vaaka-akselilla. Valitse ensin kokovaihtoehto ja kirjoita sitten numero kenttään. Kirjoita esimerkiksi 2px lisätäksesi vaakasuuntaisen varjon, joka on 2 pikseliä leveä.

• V-varjo: Lisää tekstiisi varjo pystyakselilla. Valitse ensin kokovaihtoehto ja kirjoita sitten numero kenttään.

• Sumeus: Hallitse sumeuden määrää varjossa. Mitä suurempi luku, sitä enemmän varjo on levinnyt tai epäselvä.

• Väri: Syötä heksadesimaalinen värikoodi määrittääksesi varjon värin tai käytä pipettiä näyttelemään mitä tahansa väriä näytöllä.

  

Teksti-paneelin alaosassa olevat ominaisuudet, jotka eivät ole yhtä yleisiä kuin muut tekstipaneelin vaihtoehdot, ovat seuraavat:

• Tekstin muunnos: Muuta tekstisi kirjainkokoa. Vaihtoehdot ovat isot kirjaimet, isot kirjaimet ja pienet kirjaimet. Napsauta vastaavaa kuvaketta asettaaksesi tämän ominaisuuden.

• Letter-Spacing: Määrittää kirjainten väliin lisätyn tyhjän tilan määrän. Kokovaihtoehdot ovat pikseli (px), piste (pt), pica (pc), prosentti (%), em, rem, ex ja ch.

• Sanaväli: Määrittää sanojen väliin lisätyn tyhjän tilan määrän. Kokovaihtoehdot ovat pikseli (px), piste (pt), pica (pc), prosentti (%), em, rem, ex ja ch. (Katso edellinen sivupalkki "CSS-kokovaihtoehtojen vertailu.")

• Välilyönti: Kerro selaimelle, kuinka rivinvaihtoja ja välilyöntejä käsitellään tekstilohkossa. Vaihtoehdot ovat Inherit, Normal, Nowrap, Pre-, Pre-line tai Pre-wrap. Nowrap on erityisen hyödyllinen, koska se estää elementtien erottumisen, jos niiden on kierrettävä mahtuakseen selainikkunaan tai toiseen säilöön.

• Vertical-Align: Tasaa tekstin ja kuvien tapaiset elementit suhteessa niitä ympäröiviin elementteihin. Voit asettaa numeerisen arvon tai valita perusviivan, alaosan, ylimmän, yläosan, tekstin yläosan, keskiosan, alaosan ja tekstin alaosan.