Un modo per evidenziare un elemento è per centrarlo verticalmente nella pagina. Fogli di stile ha la proprietà utilizzando il valore medio di vertical-align (vertical-align: middle) consentono di eseguire questa operazione. Fogli di stile sono documenti CSS che consentono agli utenti di applicare impostazioni uniforme a più pagine web o sezioni di pagina durante la modifica di elementi in una posizione centrale. Purtroppo, Internet Explorer, un browser comune che è necessario considerare quando si progetta una pagina web, non supporta completamente verticale proprietà align. Attraverso una combinazione di HTML e CSS, è possibile centrare verticalmente elementi anche in Internet Explorer.

Istruzioni

1

Digitare l'elemento che si desidera centrare all'interno del tag div < div >< / div > nel corpo < corpo >< / corpo > del documento HTML. Tag div definiscono sezioni nei documenti HTML. Nell'esempio seguente, l'elemento è un paragrafo < p >< / p >, ma può essere quasi qualsiasi elemento, inclusi un'immagine o un video.
< div class = "box1" >
< p > questo è un paragrafo centrato verticalmente, che è un tipo di elemento. </p >
< / div >

2

Digitare le impostazioni per il contenitore div nel foglio di stile < stile >< / stile > sezione dell'intestazione < testa >< / testa >. Commenti sono racchiuso tra tag di commento / /. Informazioni racchiusi tra tag di commento sono solo a scopo informativo. Il browser li ignora.
< style type = "text/css" >
<! —
div.box1 / identifica il percorso a cui applicare le impostazioni da seguire. L'elemento div con classe "box1." /
{
Altezza: 500px; / Rende il div scatola da 500 pixel di altezza. /
display: table-cell; / Indica al browser per trattare il div contenitore come una cella di tabella. /
Vertical-align: middle; / Indica al browser per centrare verticalmente l'elemento (paragraph). /
sfondo: rosso; / Fini di visualizzazione così potete vedere che il paragrafo è centrato nel contenitore div. /
}
-->
< / stile >

3

Utilizzare la proprietà vAlign in una tabella in combinazione con i CSS per allineare un elemento verticalmente in Internet Explorer. La proprietà con mezzo di vertical-align valore non è supportato in Internet Explorer. Includono il CSS proprietà per i browser che riconosce questa proprietà vertical-align. Questo esempio viene illustrato un foglio di stile inline.
< html >
< head >
< title > tabella VA < / title >
< / head >
< corpo >
< lo stile di tabella = "altezza: 500px; border: 0px tan solido; padding: 0px; Priorità bassa: tan; vertical-align: middle ">
< tr >
< td valign = middle > allineato verticalmente in tutti i browser. < /td >
< /tr >
< / tabella >
< / body >
< / html >

Consigli & Avvertenze

• Copiare e incollare il codice HTML documento e modificarlo secondo le vostre preferenze per creare elementi allineati verticalmente usando i CSS nel documento HTML.