Se si desidera centrare un'immagine sulla tua pagina web, è semplice farlo con i CSS. Ecco i semplici passaggi.

Istruzioni

1

Se si desidera centrare un'immagine come quella dei cowboys sui cavalli sopra indicati, in primo luogo capire quale dovrebbe essere il tuo selettore CSS. Il selettore per un'immagine è img. Tuttavia, non puoi usare quel selettore da solo, perché se lo fai, ogni immagine nella tua pagina sarà centrato. Usare un selettore più specifico per centrare solo una singola immagine o un gruppo di immagini.

2

Ecco uno scenario: si desidera centrare le immagini di anteprima in una barra laterale. Avete un div chiamato #sidebar e una classe denominata .preview per le immagini e i collegamenti che si crea nella barra laterale. Il selettore può essere #sidebar .preview img. Questo selettore consente di selezionare qualsiasi elemento img che è un discendente di ogni elemento con un attributo di classe che contiene l'anteprima di parola, che è un discendente di ogni elemento con un attributo id uguale a sidebar. Vostra situazione particolare può essere diverso, naturalmente, ma provare a venire con un selettore che mira in particolare a solo le immagini che si desidera centrare.

3

Rendere l'img un elemento blocco. Nello scenario precedente, questo sarebbe la regola CSS.

barra laterale .preview img {

display: block;
}

4

Aggiungere regole di margine che avrà al centro l'immagine. Nello scenario precedente, questo sarebbe la regola completa.

barra laterale .preview img {

display: block;
margine destro: auto;
margine sinistro: auto;
}

5

La regola nel passaggio 4 è tutto il che necessario; Basta assicurarsi che il selettore è abbastanza specifico per indirizzare solo le immagini che si desidera centrato.