CSS-opas

CSS-TYYLEIHIN LIITTYVÄÄ KOULUTUSTA VUONNA 2008!

Kurssit saatavilla kautta Suomen. Tule ja varaa oma koulutustapahtumasi heti! IT-koulutuksen asiantuntijasi, Koulutus- ja konsultointipalvelu KK Mediat

CSS ja mediatyypit

Leikkausmerkit - ominaisuus marks

Korkea-laatuisessa tulostustyössä sivunvaihdot merkitään yleensä sivun alalaitaan merkittävillä leikkausmerkeillä. CSS tarjoaa leikkausmerkkien lisäämistä varten ominaisuuden marks, jonka mahdolliset arvot ovat:

crop: Leikkaa sivu merkkejä käytten
cross: Kohdista sivuja merkkejä käyttäen
none: Leikkausmerkkejä ei käytetä

Kuten kaikessa sivutetussa mediassa, UA-laite päättää siitä kuinka leikkausmerkit käytännössä toteutetaan.

 @page {

  / A4 arkki tuumina */
  size:	8.26in 11.69in; 

  /* 2cm marginaali */
  margin:2cm; 

  /* lisää kohdistusmerkit */  
  mark:cross; 
}

Sivunvaihdot

Sivutetussa mediassa keskeisessä roolissa on sivunvaihto ja sivunvaihdon määrittäminen halutussa kohdassa. Tätä varten CSS tarjoaa kolme ominaisuutta:

page-break-before
page-break-after
page-break-inside

Mahdolliset arvot ovat:

auto: Sivunvaihto suoritetaan automaattisesti
always: Suorita pakotettu sivunvaihto .Arvo ei ole käytettävissä ominaisuudelle page-break-inside.
avoid: Pyri välttämään sivunvaihtoa
left: Suorita 1-2 pakotettua sivunvaihtoa, jotta seuraava sivu tulostuisi vasemmalle (kaksipuoleisessa tulosteessa). Arvo ei ole käytettävissä ominaisuudelle page-break-inside.
right: Edellisen vastakohta
inherit: Peri arvo vanhemmalta

Esimerkki. Suorita aina ennen h1-otsikkoa pakotettu sivunvaihto. Pyri välttämään sivunvaihtoa kuvan jälkeen tai esimuotoillun tekstin sisällä.

 @page {

  / A4 arkki tuumina */
  size:	8.26in 11.69in; 

  /* 2cm marginaali */
  margin:2cm; 

  /* lisää kohdistusmerkit */  
  mark:cross; 

  h1 {
    page-break-before:always;
  } 
  
  img {
    page-break-after:avoid;
  }
     
  pre {
    page-break-inside:avoid;
  }  
}

Leski- ja orporivit

Leski- ja orporivit ovat typografian peruskäsitteitä. CSS-tyylimäärittelyssä leskirivejä hallitaan ominaisuudella widows, orporivejä ominaisuudella orhpans.

orphans: kuinka monta riviä elementissä täytyy vähintään olla, jotta se saa sijaita sivun lopussa. Oletusarvo 2 riviä
widows: kuinka monta riviä elementissä täytyy vähintään olla, jotta se saa sijaita sivun alussa. Oletusarvo 2 riviä

 @page {

 ...  
  p {
   orphans:4;
  }
}

Tutustu artikkelin muihin osiin:
»»» CSS »»»Mediatyypit
»»» CSS »»»Sivutettu media - tulosteen koon määrittäminen
»»» CSS »»»Sivutettu media - tulosteen tehokas hallinta
»»» CSS »»» CSS ja ääni (nk. aural-tyylit)

CSS-opas

CSS ja mediatyypit

Leikkausmerkit - ominaisuus marks

Sivunvaihdot

Leski- ja orporivit

Tallenna tämä sivu kirjanmerkkeihin!