Adattare pagine alla risoluzione [GDRCD 5.2]

Adattare pagine alla risoluzione [GDRCD 5.2] postato il 05/12/2014 17:58:01 nel forum programmazione, gdrcd, open source, hosting

GDRCD 5.2
ALTERVISTA

Salve, vorrei sapere come impostare la struttura del sito in modo che ogni pagina vada ad adattarsi allo schermo di chi utilizza il sito. Ho provato con il css ma con scarsi risultati. Qualcuno sa come aiutarmi?

War Thunder ↗
Aviazione, veicoli corazzati e flotte militari della seconda guerra mondiale. Parteciperai a tutte le principali battaglie!

quota

05/12/2014 18:35:05

Cosa intendi con adattarsi alla risoluzione?

perchè il gdrcd a livello di alyout si adatta gia a qualsiasi risoluzione al di sopra di un minimo base (gia un 1024x768 se non ricordo male)

CRSED: F.O.A.D. ↗
Brutale sparatutto MMO in cui vince l'ultimo giocatore che resta in vita! Il giocatore sarà accompagnato da armi realistiche e magie!

quota

05/12/2014 20:01:25 e modificato da karma94 il 05/12/2014 20:13:41

Allora:

-Immagini di sfondo che si ripetono se allargo la pagina. Parti delle funzioni di gioco che si spostano verso sinistra sempre se tento di allargare la pagina o che spariscono se la rimpicciolisco.

In poche vorrei un layout che si adatta alle più comuni risoluzioni presenti in giro.

Lo so è abbastanza complesso da realizzare. Mi servirebbe qualche delucidazione sui mezzi da utilizzare per evitare questi problemini.

World of Warship ↗
MMO gratuito con frenetiche battaglie navali ambientate nel ventesimo secolo. Salpa con la tua nave ed affronta i nemici!

quota

05/12/2014 20:31:10

La maniera più semplice è usare misure percentuali e non in pixel,ma non garantisco un grande risultato se non ci lavori un pò

Crossout ↗
Tuffati nel mondo di Crossout, il gioco MMO d'azione post apocalittico! Costruisci le tue speciali macchine da combattimento!

quota

06/12/2014 10:32:35

lavorare in percentuale non è mai una buona opzione.
La soluzione più semplice è definire la risoluzione minima di gioco 1024 o 800? Una volta che l'hai definita crei un template fisso, lo svantaggio è che chiunque avrà una risoluzione minore si troverà la barra di scorrimento orizzontale.
Se vuoi qualcosa di più professionale potresti usare i css dinamici, caricare un css diverso per ogni risoluzione. Ti lascio i link di una guida per farti un'idea

http://www.html.it/articoli/layout-dinamici-in-base-alla-risoluzione-1/ ↗

quota

06/12/2014 12:50:24 e modificato da leoblacksoul il 06/12/2014 12:52:47

La soluzione standard di questi tempi è usare le tecniche di Responsive Layout, sfruttando le "media query" di css3. Ci sono moltissime guide e tutorial là fuori, anche uno fatto da Google stessa che mette a confronto le varie tecnologie per fare siti che si adattano a qualunque tipo di schermo. https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/index?hl=it ↗

La soluzione proposta da breaker è anche efficace, ma dipende da javascript, per questo mi fa storcere il naso.

Io personalmente non trovo che fare un layout fluido usando le percentuali sia impossibile. Anzi, la mia land attualmente è fatta così e funziona molto bene, entro certi limiti minimi di grandezza dello schermo. Non dico che sia facile, perchè far funzionare soprattutto le immagini e i font in un layout del genere è difficile, ma non impossibile.

quota

06/12/2014 13:28:45

Le media queries sono una soluzione ottima secondo me, essendo una osluzione puramente di css e avendo un supporto da parte dei maggiori browser da molto tempo: http://www.w3schools.com/cssref/css3_pr_mediaquery.asp ↗

Diversi attributi poi dei css come per esempio il display:flex (sebbene questo per alcuni browser tipo ie sia supportato nelle ultime versioni) aiutano a poter modificare completamente il layout compreso l'ordine degli elementi per mettere quelli che interessano di più per primi

Seconda Era ↗
Vaste terre coperte di ombre e misteri, dove ogni eroe scrive la storia del Mondo di Eidel. Seconda Era, play by chat

quota