CLT132 Dokumenttityypin määrittely HTML:n taulukot ja listat (viikko 4)
CLT132 – kevät 2008Sauli Nurmi Dokumenttityypin määrittely Tähän asti on keskitytty vain … tagien väliseen sisältöön Kuitenkin on tarpeen esitellä dokumentti ennen näitä Määrittely näkyy tietokoneille ja erilaisille systeemeille, ihmiskäyttäjälle vain lähdekoodia lukemalla
CLT132 – kevät 2008Sauli Nurmi Määritelmä A Document Type Declaration, or DOCTYPE, is an instruction that associates a particular SGML or XML document (for example, a webpage) with a Document Type Definition (DTD) (for example, the formal definition of a particular version of HTML). In the serialized form of the document, it manifests as a short string of markup that conforms to a particular syntax. Lähde:
CLT132 – kevät 2008Sauli Nurmi DTD ja DOCTYPE Document Type Definition tarkoittaa tiettyä formaalia määrittelyä dokumentille DOCTYPE dokumentin alussa kertoo, mikä DTD on kyseessä Periaatteessa siis: DTD määrittää dokumenttityypin DOCTYPE määrittää käytetyn määritelmän
CLT132 – kevät 2008Sauli Nurmi Käytännössä Dokumentin määrittelyjä voi tehdä myös itse …ja jossain myöhemmissä opinnoissa ehkä täytyykin Tällä erää ja tässä kontekstissa riittää, kun osaa lisätä sopivan DOCTYPEn tekemänsä dokumentin alkuun
CLT132 – kevät 2008Sauli Nurmi Esimerkki <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " My first HTML document Hello world!
CLT132 – kevät 2008Sauli Nurmi HTML:n Doctypet <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " Tiukka ja rajattu määritelmä, joka keskittyy lähinnä rakenteisiin elementteihin <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " Sisältää muotoiluelementit (myös vanhentuneet) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" " Sisältää tuen kehyksiä käyttäville sivuille
CLT132 – kevät 2008Sauli Nurmi HTML-Doctypet, jatkoa Periaatteessa siis jokainen laajempi määrittely sisältää kaiken mitä astetta tiukempi, mutta myös jotain ekstraa ”Turvallinen” tapa on valita aina laajin, jolloin ei ainakaan rajaa vahingossa mitään pois Ei suositeltavaa... Hyvän validaattorin pitäisi pystyä erottamaan mahdollinen ristiriita DTD:n ja käytettyjen elementtien välillä
CLT132 – kevät 2008Sauli Nurmi XHTML:n Doctypet <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " Tiukka ja rajattu määritelmä, joka keskittyy lähinnä rakenteisiin elementteihin <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " Sisältää muotoiluelementit (myös vanhentuneet) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " Sisältää tuen kehyksiä käyttäville sivuille
CLT132 – kevät 2008Sauli Nurmi Muita Doctypeja Vanha, version 3.x määritelmä Vanha, version 2.x määritelmä XML:n perus-DTD <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" " WML:n DTD
CLT132 – kevät 2008Sauli Nurmi Yleistä DTD:istä Kertovat järjestelmälle (esim. selain), mikä määritelmä on käytössä Käytännössä selaimet näyttävät mitä tahansa... Tästä eteenpäin tällä kurssilla oletetaan, että jokaisessa luodussa dokumentissa on myös DOCTYPE (ellei toisin esitetä)
CLT132 – kevät 2008Sauli Nurmi Lisää lukemista aiheesta HTML Validation: Choosing a DOCTYPE HTML DOCTYPE TAG Recommended DTDs to use in your Web document (Alin linkki on erinomainen)
CLT132 – kevät 2008Sauli Nurmi HTML:n taulukot Perinteisesti taulukko on antanut mahdollisuuden muotoiluihin, joita HTML ei itsessään varsinaisesti tue Esim. palstojen sisentämiseen ei ole omaa elementtiä, sen sijaan taulukossa voi leikkiä tyhjillä sarakkeilla ja saada luoduksi visuaalisen sisennyksen (joka tarkkaan ottaen ei siis ole sisennys, vaan taulukon sisempi sarake…)
CLT132 – kevät 2008Sauli Nurmi Taulukon elementtejä... Taulukon otsikko... Sarakeryhmän yksittäinen sarake... Sarakeryhmä... Taulukon luova elementti!!
CLT132 – kevät 2008Sauli Nurmi Taulukon elementtejä, jatkoa... Taulukon runko... Taulukon solu... Taulukon alateksti... Taulukon otsakkeessa oleva solu
CLT132 – kevät 2008Sauli Nurmi Taulukon elementtejä, jatkoa... Taulukon otsake... Taulukon solurivi Paremman ulkoasun säilyttämiseksi tyhjiin soluihin täytettä: non-breaking space ( )
CLT132 – kevät 2008Sauli Nurmi Elementtien pätevyys Note: The, and elements are seldom used, because of bad browser support. Expect this to change in future versions of XHTML. Osa attribuuteista vanhentuneita nykymäärityksissä (bgcolor yms.)
CLT132 – kevät 2008Sauli Nurmi Lisää taulukoista HTML Tables Tables in HTML documents
CLT132 – kevät 2008Sauli Nurmi HTML:n listat Kolme listatyyppiä: UL (unordered list, numeroimaton lista) OL (ordered list, numeroitu lista) DL (definition list, määritelmälista)
CLT132 – kevät 2008Sauli Nurmi Määritelmälista Sisältää DD- ja DT-elementtejä DT on mitä määritellään DD on määritelmä Opintoviikko Vanha opintojen mittari Opintopiste Uusi opintojen mittari Interaktiivinen tutoriaali:
CLT132 – kevät 2008Sauli Nurmi Muut listat Muilla kahdella listalla idea on sama: Joko UL tai OL tagien välissä on listattuna asioita Jokainen asia LI (list item) tagillä tai Mozilla Firefox Internet Explorer tai Aiheesta lisää:
CLT132 – kevät 2008Sauli Nurmi Viikon oleellisin asia Oppia määrittelemään formaali dokumentin tyyppi (käyttäen valmiita standardimääritelmiä) Oppia taulukoiden perusidea Oppia listojen perusidea