Come fare il mio sito presento lo stesso su monitor di diverse dimensioni

May 10

Come fare il mio sito presento lo stesso su monitor di diverse dimensioni


lo sviluppo del web è dura per i perfezionisti insieme a chi è abituato a stampare layout. Non solo è possibile visualizzare i siti web in modo diverso su monitor differenti, ma possono anche visualizzare in modo diverso su diversi browser, configurazioni utente e sistemi operativi. Va bene. Ci sono ancora una serie di strumenti a disposizione per la creazione di più uniforme un look per il sito il più possibile, e ciò che è noto come un layout a larghezza fissa è il modo migliore e più semplice per iniziare.

istruzione

1 Aprire un file HTML sul tuo sito web da modificare.

2 Direttamente sotto il tag <body> vicino alla parte superiore del file, aggiungere la seguente riga:

<Div id = "wrapper">

Allo stesso modo, direttamente sopra il </ body> tag vicino alla fine del file, aggiungere la seguente riga:

</ Div>

Quello che stai facendo è avvolgendo l'intero contenuto della pagina web all'interno di una divisione che è possibile lo stile in un certo modo di apparire il più possibile simili tra diversi monitor. Se il tuo sito ha un sacco di pagine HTML, dovrete fare questo per ogni pagina.

3 Aprire il foglio di stile del tuo sito web da modificare. Se il tuo sito non ha un foglio di stile (che sarà un file con estensione CSS, acronimo di Cascading Style Sheets), creare un nuovo documento di testo, salvarlo come "style.css" e caricala sul tuo server.

4 Aggiungere il seguente codice al foglio di stile:

div # wrapper {
margin: 0 auto;
width: 750px;
}

Questo compie due cose. "Margin: 0 auto;" imposta il margine superiore e inferiore dell'involucro a zero e sinistra e destra dell'involucro "auto", che si concentra sulla pagina.

"Larghezza: 750px;" imposta frattempo la larghezza dell'involucro a 750 pixel. Sul monitor di grandi dimensioni o moderni questo sarà piuttosto magro, ma alcuni monitor più vecchi hanno ancora una risoluzione dello schermo di soli 800 x 600 pixel. Se non siete preoccupati per il (certamente molto piccola) percentuale della popolazione che ha ancora una risoluzione dello schermo a livello 800-pixel, si può probabilmente il numero di 950 o 1.000.

5 Assicurarsi che il foglio di stile è legata alle altre pagine del tuo sito inserendo questa linea ovunque tra i tag <head> e </ head> tag delle pagine HTML:

<Link rel = "stylesheet" href = "style.css" type = "text / css" />

Assicurarsi che il valore dopo "href" è il nome del file accurata del vostro foglio di stile, e assicurarsi che sia nella stessa directory come i file HTML. Quando hai finito, avrete un sito web che rimane statico con una larghezza fissa indipendentemente dalle dimensioni monitorare il vostro sito viene visualizzato su.


Articoli Correlati