Come modificare la barra laterale di un sito web a destra con i codici CSS

November 21

Come modificare la barra laterale di un sito web a destra con i codici CSS


Cascading Style Sheets o CSS sono essenziali in ogni progetto Web in quanto contiene il layout generale del sito. Un disegno organizzata si basa sulla creazione di un foglio di stile che indica la posizione di ciascun elemento della pagina rispetto all'altra. Uno dei layout del sito web più comuni è un sito a due colonne - uno con una colonna di contenuto principale e una barra laterale. Anche se la maggior parte delle disposizioni hanno la barra laterale sulla sinistra, si può facilmente spostare la barra laterale destra, modificando una delle sue proprietà.

istruzione

1 Trova il nome della classe o l'ID utilizzato dalla barra laterale della pagina. È possibile farlo controllando il codice sorgente della pagina Web o utilizzando costruito in strumenti dal browser come Google Chrome o Firebug di Firefox per ispezionare l'elemento della barra laterale. Ad esempio, il nome della classe o l'ID utilizzato per la barra laterale di questo codice è "sidebar":

<Div class = "sidebar"> contenuto Sidebar qui </ div>

2 Aprire il file CSS della pagina web in Blocco note.

3 Individuare la classe o l'ID della barra laterale utilizzando lo strumento "Trova" di Blocco note o usando "Ctrl + F". Nel nostro esempio, avremo bisogno di trovare la classe "barra laterale". Le classi in CSS o preceduto da un periodo, mentre id sono preceduti da un cancelletto. Un esempio di codice barra laterale CSS può assomigliare a questo:

.sidebar {

float: left;

width: 300px;

}

4 Sostituire il valore di "galleggiare" nelle proprietà CSS per "diritto" al posto di "sinistra".

5 Salvare il file CSS.

Consigli e avvertenze

  • Poiché non tutte le barre laterali sono progettati stesso. Se non si riesce a modificare la posizione della barra laterale da sinistra a destra cambiando il valore decimale, provare a vedere se la posizione della barra laterale dipende anche l'imbottitura indicato nel CSS.