Adattare la pagina web creata ad ogni monitor

serenaaa

Nuovo Utente
8 Nov 2009
19
0
0
Buongiorno a tutti,
mi affido al vostro sapere e alla vs gentilezza!
vorrei un suggerimento su come potere adattare la pagina web creata alla grandezza del monitor,
Mi spiego meglio...dal mio pc vedo la mia pagina perfettamente al centro del mio schermo,
da alcuni altri monitor più piccoli, o anche dal mio portatile, capita che escano le odiose barre di scorrimento...
come fare per fare si che le pagine web si adattino ai monitor sui quali vengono visualizzate??
grazie :)
 

serenaaa

Nuovo Utente
8 Nov 2009
19
0
0
Ti ringrazio , io però uso dreamweaver ed ê già tanto ;-)
Non esiste un codice, qualche trucchetto per ovviare a questo problema?
 

WpStyle

Utente Attivo
25 Gen 2004
611
0
16
Pistoia
www.animalfestival.net
Se lo crei in un div a 960/970px più o meno lo vedi in tutti i monitor...
se poi vuoi che si veda correttamente anche nei dispositivi tipo iphone e tablet il consiglio di @Nefyt è una soluzione.
 

serenaaa

Nuovo Utente
8 Nov 2009
19
0
0
Grazie dei consigli, proverò a seguire la dritta di Nefyt,
giusto per avere una idea ..
una volta creato il sito con dreamwever come faccio ad
utilizzare "Bootstrap" ?
è un programma che devo scaricare?
o mi genera un codice che andrò poi ad inserire in dreamwever?
ancora grazie :)
 

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
Io farei un DIV contenitore con all'interno tutti i div position quali:

- Header
- Nav Left
- Content
- Nav Right
- Footer

In questo modo basta impostare i margini destro e sinistro su auto con i css:

Codice:
div.name {margin: 0px auto 0px auto;}

Questo per centrare la pagina lateralmente, se vuoi centrarla in verticale invece non so proprio come aiutarti se non minimamente dicendoti che:
La premessa è che i contenuti non vadano ad influire sulle dimensioni della struttura, per esempio con l'ausilio della proprietà overflow:scroll; in CSS ed impostando dimensioni fisse nei div, una soluzione a parer mio poco professionale, ma che potrebbe funzionare è creare un div con dimensioni width:100%; e height:100%;(che non so se vale per la finestra l'height anche se non credo) e poi metterci all'interno l'intera struttura della pagina, non ho ancora capito bene il funzionamento e quali sono gli elementi blocco quindi per questo non sono sicuro.

Comunque se posso darti un consiglio:
Io eviterei il centramento verticale semplicemente perchè è limitativo nell'evolversi del sito durante la creazione di contenuti, è più laborioso nell'adattamento grafico.

Ciao
 

WpStyle

Utente Attivo
25 Gen 2004
611
0
16
Pistoia
www.animalfestival.net
Twitter Bootstrap è un framework CSS.
Si tratta di un sito completo che volendo puoi importare in dreamwever.
Devi prima importare Bootstrap e poi lavorarci su per creare il sito,
Per capire meglio di cosa si tratta ti conviene andare sul sito likato da Nefyt e partire dal link Get started nel menu in alto e passo passo leggerti tutte le altre pagine del menu.
Scaricandolo dal bottone Download Bootstrap avrai solo le cartelle img, css e js senza nessuna pagina di riferimento da cui partire, ti consiglio appena sotto il bottone di cliccare su Examples, sceglierne uno crearti una pagina index.html in dreamwever e copiarne il codice sorgente.
 

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
Ho voluto dare un'occhiata anche io a Twitter Bootstrap,
di primo acchito mi sembra una soluzione molto professionale, comoda, carina e semplice....
nulla da aggiungere (ahah! :eek:)
 

Jonn

Utente Attivo
29 Dic 2012
352
3
18
Pistoia
Il width auto penso che estenda la larghezza per tutta la dimensione del div che lo contiene e che gli altri div nello stesso contenitore gli permettano.
PENSO! è da provare.
 
Discussioni simili
Autore Titolo Forum Risposte Data
G adattare pagina web a tutte le risoluzioni HTML e CSS 9
M [Javascript] Adattare immagine di background all'altezza dello smartphone Javascript 1
L [HTML] Adattare bordo al contenuto HTML e CSS 4
D [Javascript] Convertire ed adattare una data Javascript 1
Juriy APP: Adattare immagini a GIF animata in real time Programmazione 0
B Adattare testo a cornice HTML e CSS 2
felino [CSS][Wordpress] Adattare delle immagini alla dimesione del box contenitore HTML e CSS 2
felino Adattare un layout desktop ad un responsive HTML e CSS 9
K Adattare app ad ogni schermo Sviluppo app per Android 1
L Adattare sfondo in base alla risoluzione WordPress 3
P Adattare sito alle varie risoluzioni... HTML e CSS 2
R Adattare immagini alla dimensione del monitor Javascript 2
P Risoluzione del sito si può adattare? HTML e CSS 0
V Adattare sito web per tutte le risoluzioni ? HTML e CSS 1
P Adattare sito a diverse risoluzioni HTML e CSS 14
M Adattare script di "form mail con upload file" al mio form mail HTML! PHP 7
C Adattare uno script di altro linguaggio a javascript Javascript 11
W Adattare immagini slideshow a riquadro predefinito Webdesign e Grafica 0
matrobriva Adattare classe Odt2Xhtml PHP 2
F [HELP] Adattare al form Visual Basic 0
L Adattare il sito a qualsiasi computer Webdesign e Grafica 4
P Adattare un layer alle varie risoluzioni HTML e CSS 0
D Adattare contenuto a risoluzione utente HTML e CSS 5
G adattare sito con frame a monitor [era:Frame] Webdesign e Grafica 3
M Adattare iFrame HTML e CSS 5
B Adattare tabella a immagine di sfondo con Dreamweaver Cs3 Webdesign e Grafica 3
StefanoITA Adattare il sito alla risoluzione del visitatore HTML e CSS 5
M Adattare sito a risoluzione video [era:help me] HTML e CSS 6
C Adattare un filmato a vari monitor Flash 5
C Adattare il sito a vari schrmi HTML e CSS 2
L Bing prima pagina prima riga; Google mi ignora SEO e Posizionamento 0
P Pagina modifica record che non funziona PHP 0
T Conferma reload pagina Javascript 4
A Submit senza ricaricare la pagina Ajax 2
L Problemi form Pagina php HTML e CSS 3
L php mysql cerca e visualizza pagina PHP 0
S Variabile in post su altra pagina PHP 2
D Visualizzazione pagina basata sul valore di un campo del database PHP 2
D Pagina non trovata Wordpress WordPress 7
E Pagina Cloudflare e captcha Domini 1
W Anomalia Pagina Facebook Social Media Marketing 9
A Aiuto per pagina php PHP 0
T Risolto Redirect a pagina esterna Javascript 2
M Questa pagina non carica correttamente Google Maps: aiuto!! HTML e CSS 1
T Offuscare link pagina web PHP 2
D Stampa a video in altra pagina html Database 3
Cosina script data aggiornamento pagina Javascript 1
Y cambiare sfondo di una pagina Javascript 1
Y Vorrei selezionare un colore di sfondo per una pagina web Javascript 0
S Apertura in una nuova pagina PHP 6

Discussioni simili