Kehykset 1. KEHYKSET: rakenne 2. Frameset 3. Esimerkki: cols 4. Cols: mittayksiköt 5. Cols: mittayksiköt 6. Cols: esimerkki 7. Rows-mittayksiköt 8. Rows-esimerkki.

Esitys aiheesta: "Kehykset 1. KEHYKSET: rakenne 2. Frameset 3. Esimerkki: cols 4. Cols: mittayksiköt 5. Cols: mittayksiköt 6. Cols: esimerkki 7. Rows-mittayksiköt 8. Rows-esimerkki."— Esityksen transkriptio:

1 Kehykset 1. KEHYKSET: rakenne 2. Frameset 3. Esimerkki: cols 4. Cols: mittayksiköt 5. Cols: mittayksiköt 6. Cols: esimerkki 7. Rows-mittayksiköt 8. Rows-esimerkki 9. Rows ja Cols esimerkki 10. Frame 11. Linkit 12. Iframe

2 1 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo KEHYKSET: rakenne ikkunarakenne määritetään frameset - elementillä, jossa kerrotaan miten näyttö jaetaan: pystysuunnassa= cols vaakasuunnassa=rows  ikkunoiden määrää ei rajoitettu  mitä dokumentteja ikkunoihin sijoitetaan

3 2 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Frameset frameset-sivulla EI body -elementtiä, sen korvaa frameset –elementti käytetään frameset-dtd:tä sivuston muut sivut ovat tavallisia sivuja

4 3 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Kehysharjoitus Tämä sivu käyttää kehyksiä, mutta käyttämäsi selain ei tue kehyksiä. Esimerkki: cols

5 4 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Cols: mittayksiköt cols = "130, *" 1. kehyksen leveys 130 pikseli ä, 2. kehyksen leveys j ä ljelle j ää v ä osa cols = "20%, *" 1. kehyksen leveys 20% selaimen ikkunan leveydest ä, 2. sarake loput

6 5 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Cols: mittayksiköt cols = "2*,600,1 *" 2. kehyksen leveys 600 pikseliä, 1:n leveys 2/3 ja 3:nnen leveys 1/3 jäljelle jäävästä osasta cols = "20%, *, 20%" 1. ja 3. sarakkeen leveys 20 % ikkunan leveydestä, 2. sarakkeen leveys jäljelle jäävä osa

7 6 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Kehysharjoitus Tämä sivu käyttää kehyksiä, mutta käyttämäsi selain ei tue kehyksiä. Cols-esimerkki

8 7 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Rows-mittayksiköt rows=”150,*" rows=”15%,*” rows="30%,400,*,2*" 1:n ikkunan korkeus 30 % 2:n korkeus 400 pikseliä 3:nnen korkeus 1/3 ja 4:nnen korkeus 2/3 jäljelle jäävästä osasta

9 8 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Kehysharjoitus Tämä sivu käyttää kehyksiä, mutta käyttämäsi selain ei tue kehyksiä. Rows-esimerkki

10 9 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo Kehysharjoitus Tämä sivu käyttää kehyksiä, mutta käyttämäsi selain ei tue kehyksiä. Cols ja rows-esimerkki

11 10 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo FRAME Attribuutit src : haettava dokumentti name : ikkunan nimi target : linkin kohdeikkuna scrolling : vieritys: yes = oletus no = ei vieritystä auto = automaattisesti noresize : käyttäjä ei voi muuttaa ikkunan kokoa frameborder : ikkunan reunus yes = reunus, oletus no = ei reunusta

12 11 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo LINKIT 1. Target ikkunan nimi : kohdesivu avautuu nimettyyn ikkunaan Helia _top : kohdesivu avautuu nykyiseen ikkunaan, poistaa kaikki kehykset Helia _blank : kohdesivu avautuu uuteen selainikkunaan Helia _self : kohdesivu avautuu siihen sen kehyksen sisään, missä lähdesivu käytetään esim. sivuston sisäisissä linkeissä, ei ulkopuolisiin linkkeihin Helia 2. Jos ei määritellä ollenkaan: sivu avautuu siihen ikkunaan, missä linkin lähdesivu

13 12 © Helsingin liiketalouden ammattikorkeakoulu, 2005 Sisällysluettelo IFRAME-kehys sivunsisäinen kehys, kelluva elementti tavallinen sivu, jolla joko loose.dtd tai strict.dtd Selaimesi ei tue Inline-kehyksiä attribuutit: src, width, height, name linkit, tehdään samoin kuin muut linkit tyyliä takaisin