Hvordan optimere man side til flere skærme?

Tags:    html css mobil tablet

Hej, en her på siden der ved en del om optimering til flere skærme? eller som evt. kan sende et link hvor det kan lade sig gøre at lærer noget omkring det,

Sad og kiggede lidt på google men kan simpelhen ikke finde noget jeg synes er noget værd.

Opgave: Skal have optimeret min side sådan den kan bruges på både mobil,tablet, bærbar og pc. Altså skærme i alle størrelser.

MVH Andreas.



7 svar postet i denne tråd vises herunder
1 indlæg har modtaget i alt 5 karma
Sorter efter stemmer Sorter efter dato
har du prøvet at søge på css+media+queries ??
alternativt css media queries tutorial
https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/use-media-queries?hl=en
http://www.htmlgoodies.com/html5/tutorials/an-introduction-to-css3-media-queries.html#fbid=1Bv4p9F6t-7


hvis du ikke vil code det fra bunden kan du overveje at bruge et framework feks
http://getbootstrap.com/getting-started/
tut http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/

http://foundation.zurb.com/
http://lessframework.com/


oversigt over de mest populære
http://www.awwwards.com/what-are-frameworks-22-best-responsive-css-frameworks-for-web-design.html




Tusind tak for hjælpen nu fungere det :-)



hvad gjorde du ?? det kunne være andre kunne have glæde af det



hvad gjorde du ?? det kunne være andre kunne have glæde af det


Tænkte jeg ville gøre det nemt og sætte mig lidt mere ind på et tidspunkt med lidt mere tid :-)

Så jeg valgte at hente pakken fra getbootstrap og følge den simple vejdledning der er med.

Det er bare at sætte en js mappe ind og sætte 2 linjer i sit html dokument :-)



Eh what? At indsætte Bootstrap på dit site gør det da ikke responsivt.



Hvis du har anvendt bootstrap fra bunden kan jeg forstå at det er blevet responsivt - ellers er der da en del ting du skal lave om i dit site for at "aktivere" bootstrap på dine elementer.

Der findes også en serie her: responsive hjemmeside, som viser hvordan du kan lave en side responsive. Måske kan de hjælpe andre der ser denne tråd...



Jeg vil give Ronny ret, Media-Queries er en god måde at gøre det på...


Derudover så tjek også op på Flexbox der simplificere ting en hel del omkring: hvordan sidens elementer skal ligge, når browser vinduet har en bestemt størrelse

// Husk at læse hele guiden da f.eks. Iphone ikke understøtter display:flex; og skal derfor bruge display:-webkit-flex;



t