Il miglior tutorial CSS allineamento orizzontale (Allineamento orizzontale) Nel 2024, in questo tutorial puoi imparare In CSS, ci sono diverse proprietà di elemento di allineamento orizzontale.,Allinea elementi di blocco,Allineato al centro, utilizzando la proprietà margine,Esempi,Utilizzando la proprietà position è impostata a sinistra, destra-allineati,Esempi,Crossbrowser Problemi di compatibilità,Esempi,Utilizzando la proprietà float a sinistra, allineato a destra,Esempi,Crossbrowser Problemi di compatibilità,Esempi,
elemento Block è un elemento, occupando l'intera larghezza della parte anteriore e posteriore sono interruzioni di riga.
Esempi di elementi di blocco:
allineamento del testo, vedere il testo CSS sezione. .
In questo capitolo, vi mostreremo come bloccare l'allineamento orizzontale di elementi di layout.
elementi di blocco possono essere margini sinistro e destro impostati a allineamento "Auto".
NOTA: L'uso del margine IE8: proprietà auto non funziona, a meno che DOCTYPE dichiarato!
proprietà dei margini possono essere arbitrariamente diviso in sinistra e le impostazioni dei margini destro vengono assegnati automaticamente, il risultato è l'emergere di l'elemento centrale:
Tip: Se la larghezza è 100%, l'allineamento non è efficace.
Nota: IE5 vi è un margine nell'elemento BUG blocco di elaborazione.Per fare l'esempio precedente lavoro in IE5, abbiamo bisogno di aggiungere un po 'di codice aggiuntivo. Esempi
Un allineamento elemento è di utilizzare il posizionamento assoluto:
Nota: Posizionamento assoluto non ha nulla a che fare con il flusso del documento, in modo che possano coprire gli altri elementi della pagina.
IE8 e precedenti hanno un problema quando si utilizza la proprietà position. Se un elemento contenitore (in questo caso <div class = "contenitore">) larghezza specificata ,! dichiarazione DOCTYPE manca, IE8 e le versioni precedenti si aggiunge un margine di 17px a destra. Questo sembra essere uno spazio di riserva di rotolamento. Quando si utilizza la proprietà position è sempre impostato nella dichiarazione DOCTYPE!
Utilizzando la struttura galleggiante è uno del metodo elemento di allineamento:
Elementi allineati in questo modo, l'elemento di margini e padding pre-determinato è sempre una buona idea. Questo per evitare differenze visive in diversi browser.
IE8 e precedenti hanno un problema quando si utilizza la proprietà float. Se un elemento contenitore (in questo caso <div class = "contenitore">) larghezza specificata ,! dichiarazione DOCTYPE manca, IE8 e le versioni precedenti si aggiunge un margine di 17px a destra. Questo sembra essere uno spazio di riserva di rotolamento. Quando si utilizza la proprietà float è sempre impostato nella dichiarazione DOCTYPE!