Vsebina

• Koraki
• Metoda 1 od 2: CSS (priporočeno)
• Metoda 2 od 2: Atribut »align« v HTML -ju

Atribut poravnati oznaka html> je zastarel od HTML5. Čeprav ta atribut še vedno deluje v večini spletnih brskalnikov, je priporočljivo, da slike poravnate z uporabo Cascading Style Sheets (CSS). V tem članku vam bomo pokazali, kako slike centrirati s pomočjo CSS in zastarele oznake. poravnati.

Koraki

Metoda 1 od 2: CSS (priporočeno)

1. 1 Za sliko dodajte kodo HTML. Za poravnavo slike boste uporabili kaskadne slogovne liste (CSS), vendar jo boste morali postaviti na stran s HTML -jem. Spodaj je primer uporabe oznake img> če želite v svojo kodo vstaviti sliko:

   img src = "dog.webp" alt = "to je slika psa">

   • Namesto dog.webp nadomestite ime slikovne datoteke in za "alt" vnesite opis slike. Pomen center za "class" se ne spremenijo, ker boste ustvarili razred CSS s tem imenom.
2. 2 Poiščite kodo CSS. Če ima vaše spletno mesto ločeno datoteko CSS, jo odprite. Če ne, je CSS najverjetneje na vrhu datoteke HTML, znotraj oznak glava>... Pomaknite se na vrh datoteke in poiščite oznake slog> / slog>.
   • Če oznake slog> / slog> ne, dodaj jih. Za več informacij preberite ta članek.
3. 3 Dodajte CSS, da poravnate sliko. Namesto "50%" lahko vnesete drugo vrednost, da se slika prikaže na strani. Slike ne boste mogli centrirati z vrednostjo "100%", zato bi morala biti ta številka drugačna.

   .center {prikaz: blok; margin-left: samodejno; desni rob: samodejno; širina: 50%; }

4. 4 Shranite spremembe. Shranite datoteko HTML in datoteko CSS (če obstaja). To bo sliko usmerilo v sredino.
   • Tudi znotraj oznak img> lahko doda druge slike.

Metoda 2 od 2: Atribut »align« v HTML -ju

1. 1 Ustvarite nov odstavek. Čeprav je bil ta način centriranja slik zastarel, še vedno deluje v številnih brskalnikih. Vendar pa priporočamo uporabo CSS za ohranitev funkcionalnosti spletnega mesta, ko brskalniki prenehajo podpirati določen atribut. Ne pozabite, da je atribut poravnati bo sliko usredsredil le znotraj elementa, ki jo obdaja (na primer znotraj oznak p> / p> ali div> / div>). Na primer, v datoteki HTML bomo z dodajanjem ustvarili nov odstavek p> v ločeni vrstici.
2. 2 Za sliko dodajte kodo HTML. Za oznako vnesite naslednjo kodo p>... Uporabite ta primer kot vodilo:

   p> img src = "dog.webp" alt = "picture" align = "middle">

   • Namesto dog.webp nadomestite ime slikovne datoteke in za "alt" vnesite opis slike.
   • Srednji atribut brskalniku pove, naj sliko prikaže na sredini strani.
3. 3 Zaprite oznako odstavka. Če želite to narediti, dodajte / p> za oznako slike. Končana koda bi morala izgledati nekako takole:

   p> img src = "dog.webp" alt = "picture" align = "middle"> / p>

4. 4 Shranite spremembe. To bo sliko usmerilo v sredino.