Sivujen skaalautuvuus

Tuulia_Tee

Teen nettisivut Notepadilla ja käytän paljon css:ssä position: absolute -menetelmää eri elementtien sijoituksessa. Nyt huomasin, että sivut näkyvät vanhalla koneella katsottuna yllisuurilta eli joutuu scrollaamaan sekä sivuttais- että pystysuunnassa. Mitä css-koodiin täytyisi laittaa, että sivut skaalautuvat joka näytölle sopiviksi?

3

1032

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • 1. Valitse mittayksiköksi "em". Unohda pikselimitat. Silloin kaikki säätyy fonttikoon mukaan kuten käyttäjä on halunnut. 1em on suunnilleen m-kirjaimen leveys. Poikkeustilanteissa käytetään myös prosentteja.

      2. Älä vaihda leipätekstin fontin kokoa. Suhteuta otsikot yms. leipätekstiin.

      3. Sivut toimii paremmin mitä kapeammaksi ne pystyy taipumaan. Huomioi tämä heti sivuston suunnittelun alussa, että pyrit välttämään ylimääräisiä palstoja yms. Pyri siis tekemään mahdollisimman kapeita sivuja, älä ruudulle sopivia, koska näyttölaitteissa on eroja.

      4. Suunnittele sivusto niin, että kaikki sopii vielä korkeintaan 52em leveyteen jos ei ole pystyscrolleja. Jos tavaraa on sivulla enemmän niin suunnittele niin, että 50em leveyden pitää vielä toimia. Sen mukaan mitoitat kokoja ettet tee liian isoa.

      5. Kuten varmaan keksit niin width: ?em; ja height: ?em; on ne mitä käytät paljon, sekä määrittet objekteja kellumaan (float) niin taitto muotoutuu automaattisesti niiden osalta. Tämän lisäksi sitten on min-width: ?em; max-width: ?em; Leipätekstille määrität aina max-width: 50em; ettei veny liian leveäksi.

      • Tuulia_Tee

        Näistä on jo paljon apua!


    • The CSS

      Jos nimenomaan haluat tehdä eri näytöille ja resolutioille skaalautuvan sivun, käytä taulukoiden, solujen, div:ien ymv. leveyden määrittämiseen prosentteja, ei px:ä eikä em:ä.

    Ketjusta on poistettu 0 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. Tänään pyörit ajatuksissa enemmän, kun erehdyin lukemaan palstaa

      En saisi, silti toivon että sinä vielä palaat ja otetaan oikeasti selvää, hioituuko särmät ja sulaudummeko yhteen. Vuod
      Ikävä
      33
      6284
    2. Huomenta ihana

      Kauniskasvoinen ihanuus 😘 saan sut vielä
      Ikävä
      34
      5763
    3. Hei rakas...

      Miten on työpäivä sujunut? Rakastan sinua 💗
      Ikävä
      29
      3244
    4. Ei tämä etene ikinä

      Kun kumpikaan ei enää ota yhteyttä. Mä en ainakaan uskalla.
      Ikävä
      45
      2630
    5. Edelleen sitä on vaikea uskoa

      Että olisit oikeasti rakastunut muhun
      Ikävä
      34
      2564
    6. Vitsi mihin menit. Heti takasin.

      Mä näin sut tuu takasin! Oli kiire, niin en ehtiny sin perään!
      Ikävä
      15
      2228
    7. Toiveikas vai toivoton

      torstai? Ajatuksia?
      Ikävä
      37
      2148
    8. Mukavaa päivää

      Mun rakkauden kohteelle ❤️ toivottavasti olet onnellinen
      Ikävä
      16
      1886
    9. Voi ei! Jari Sillanpää heitti keikan Helsingissä - Hämmästyttävä hetki lavalla...

      Ex-tangokuningas on parhaillaan konserttikiertueella. Hän esiintyi Savoy teatterissa äitienpäivänä. Sillanpää jakoi kons
      Suomalaiset julkkikset
      40
      1779
    10. En ole koskaan kokenut

      Ennen mitään tällaista rakastumista. Tiedän että kaipaan sinua varmaan loppu elämän. Toivottavasti ei tarvitsisi vain ka
      Ikävä
      19
      1727
    Aihe