Kako centrirati sliku u HTML (sa ilustracijama)

Atribut Poravnajte Označiti smatra se zastarjelim pojavom HTML5. Iako ovaj atribut još uvijek radi u većini web pretraživača, preporučuje se poravnavanje slika pomoću kaskadnih stolova stila (CSS). U ovom ćemo članku reći kako centrirati slike sa CSS-om i zastarjelom oznakom Poravnajte.

Korake

Metoda 1 od 2:

CSS (preporučeno)

jedan. Dodajte HTML kod za sliku. Da biste poravnali sliku, koristit ćete kaskadne listove stila (CSS), ali morat ćete ga staviti na stranicu pomoću HTML-a. Slijedi primjer upotrebe oznake Da biste umetnuli sliku u kod:

  Src ="Pas.JPG" alt ="Ovo je slika psa" klasa ="Centar">

Umjesto Pas.JPG Podmašite naziv datoteke slike, a nakon "Alt" unesite opis slike. Smisao Centar Za "klasu" se ne mijenjajte jer ćete stvoriti CSS klasu s ovim imenom.

2. Pronađite CSS kod. Ako na web mjestu postoji zasebna CSS datoteka, otvorite je. Ako ne, CSS kôd najvjerovatnije se nalazi na vrhu HTML datoteke unutar oznaka . Dođite do vrha datoteke da biste pronašli oznake .

Ako Tagov Ne, dodajte ih. Pročitati Ovaj članak, Da biste dobili više informacija.

3. Dodajte u CSS kôd da biste poravnali sliku. Umjesto "50%", možete unijeti drugu vrijednost tako da se slika pojavi na stranici. Cerotter slika s vrijednošću "100%" neće raditi, tako da ovaj broj treba biti različit.

.Centar {Ekran: blok-margin-lijevo: Auto-margin-desno: Auto-širina: 50% -}

4. Spremite promjene izvršene. Spremite HTML datoteku i CSS datoteku (ako jeste). Dakle, vi centrirate sliku.

Takođe unutar Tagova može dodati klasa ="Centar", Da biste izbrisali druge slike.

Metoda 2 od 2:

Atribut "Poravnaj" u HTML-u

jedan. Stvorite novi odlomak. Iako se ova metoda centriranja slika smatra zastarjelim, još uvijek radi u mnogim preglednicima. Međutim, preporučujemo upotrebu CSS-a za funkciju kada preglednici prestanu održavati navedeni atribut. Zapamtite da je atribut Poravnajte usredotočio sliku samo unutar elementa koji ga okružuje (na primjer, unutar oznaka ili ). Kao primjer u HTML datoteci, stvorit ćemo novi odlomak dodavanjem Na zasebnoj liniji.

2. Dodajte HTML kod za sliku. Unesite sljedeći kôd nakon oznake . Koristite ovaj primjer kao vodič:


 Src ="Pas.JPG" alt ="slika" poravnati ="Sredina">

Umjesto Pas.JPG Podmašite naziv datoteke slike, a nakon "Alt" unesite opis slike.

Atribut "Srednji" obavještava pretraživač da bi slika trebala biti prikazana u sredini stranice.

3. Izbliza Oznaka odlomaka. Da biste ovo dodali Nakon klip za oznaku Art. Gotov kôd treba izgledati ovako:


 Src ="Pas.JPG" alt ="slika" poravnati ="Sredina">

4. Spremite promjene izvršene. Dakle, vi centrirate sliku.