Innhold

• Trinn
• Metode 1 av 2: CSS (anbefalt)
• Metode 2 av 2: Attributtet "align" i HTML

Egenskap tilpasse stikkord html> har blitt avskrevet siden HTML5. Selv om dette attributtet fortsatt fungerer i de fleste nettlesere, anbefales det at du justerer bilder ved hjelp av Cascading Style Sheets (CSS). I denne artikkelen skal vi vise deg hvordan du sentrerer bilder ved hjelp av CSS og den utdaterte taggen. tilpasse.

Trinn

Metode 1 av 2: CSS (anbefalt)

1. 1 Legg til HTML -kode for bildet. Du vil bruke kaskaderstilark (CSS) for å justere bildet, men du må plassere det på siden ved hjelp av HTML. Følgende er et eksempel på bruk av koden img> for å sette inn et bilde i koden din:

   img src = "dog.webp" alt = "dette er et bilde av en hund">

   • I stedet for hund.webp erstatte navnet på bildefilen, og etter "alt" skriv inn beskrivelsen av bildet. Betydning senter for "klasse" endres ikke, fordi du vil opprette en CSS -klasse med det navnet.
2. 2 Finn CSS -koden. Hvis nettstedet ditt har en egen CSS -fil, åpner du den. Hvis ikke, er CSS mest sannsynlig øverst i HTML -filen, inne i kodene hode>... Rull til toppen av filen for å finne koder stil> / stil>.
   • Hvis tagger stil> / stil> nei, legg dem til. Les denne artikkelen for mer informasjon.
3. 3 Legg til CSS for å justere bildet. I stedet for "50%" kan du angi en annen verdi for å få bildet til å vises på siden. Du vil ikke kunne sentrere bildet med verdien "100%", så dette tallet bør være annerledes.

   .center {display: block; margin-venstre: auto; margin-høyre: auto; bredde: 50%; }

4. 4 Lagre endringene. Lagre HTML -filen og CSS -filen (hvis noen). Dette vil sentrere bildet.
   • Også inne i tagger img> kan legge til for å sentrere andre bilder.

Metode 2 av 2: Attributtet "align" i HTML

1. 1 Lag et nytt avsnitt. Selv om denne metoden for sentrering av bilder har blitt avviklet, fungerer den fortsatt i mange nettlesere. Vi anbefaler imidlertid å bruke CSS for å holde nettstedet funksjonelt når nettlesere slutter å støtte det angitte attributtet. Husk at attributtet tilpasse sentrerer bildet bare inne i elementet som omgir det (for eksempel innsiden av tagger p> / p> eller div> / div>). Som et eksempel vil vi i HTML -filen opprette et nytt avsnitt ved å legge til p> på en egen linje.
2. 2 Legg til HTML -kode for bildet. Skriv inn følgende kode etter taggen p>... Bruk dette eksemplet som en veiledning:

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

   • I stedet for hund.webp erstatte navnet på bildefilen, og etter "alt" skriv inn beskrivelsen av bildet.
   • Attributtet i midten forteller nettleseren å vise bildet i midten av siden.
3. 3 Lukk avsnittstaggen. For å gjøre dette, legg til / p> etter bildekoden. Den ferdige koden skal se slik ut:

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

4. 4 Lagre endringene. Dette vil sentrere bildet.