I formati orizzontali e verticali permettono di organizzare una pagina Web nel browser dell'utente. Il formato allineamento verticale è la posizione di un'immagine o testo all'interno di un contenitore. È possibile allineare il contenuto in alto, al centro o in basso del contenitore, a seconda del layout che si adatta al vostro design della pagina web.

Importanza

il design tableless comprende la maggior parte dei layout di pagina Web. Ciò significa che la maggior parte degli sviluppatori attaccano a classi CSS per disporre le immagini e testo in una pagina. In precedenza, tabelle con celle, righe e colonne controllati come una pagina Web visualizzata. Tuttavia, con il disegno tableless, il layout è contenuto all'interno di un contenitore "div". Un contenitore div consente di posizionare le sezioni della tua pagina in diverse aree del codice HTML, e di controllare diverse sezioni della pagina senza influenzare altre aree.

Formato verticale

La proprietà "valign" è la dichiarazione tag Inline HTML che controlla il posizionamento verticale di un oggetto contenuto. Per esempio, se si dispone di un div contenitore che si trova a 50 pixel in altezza, impostando "valign" a "mezzo" pone il contenuto di 25 pixel verso il basso dalla parte superiore del contenitore. Anche se si sposta il contenitore div in una posizione diversa, il contenuto rimane ancora centrato verticalmente.

Le classi CSS

fogli di stile CSS consentono di impostare le classi di progettazione, in modo da poter collegare gli elementi HTML a una classe senza dover digitare manualmente lo stile di ogni elemento. Quanto segue è un esempio di una classe CSS che allinea gli elementi in verticale:

div {

vertical-align: middle;
}

Questa classe allinea verticalmente contenuti nel bel mezzo di un div chiamato "div".

considerazioni

Design per CSS richiede tempo e pratica. Se l'allineamento è spento per un div, può rovinare il disegno per il resto della pagina. È necessario aprire la pagina HTML con le sue classi CSS associati a ciascun comune browser come Firefox, Chrome e Internet Explorer per assicurarsi che il layout funziona correttamente nei browser dei tuoi lettori.