Zarovnajte text na stred

Autor: Tamara Smith
Dátum Stvorenia: 28 Január 2021
Dátum Aktualizácie: 1 V Júli 2024
Anonim
Shakira - Waka Waka (This Time for Africa) (The Official 2010 FIFA World Cup™ Song)
Video: Shakira - Waka Waka (This Time for Africa) (The Official 2010 FIFA World Cup™ Song)

Obsah

Táto wikiHow vás naučí, ako centrovať text na webovú stránku HTML. Používame na to CSS (kaskádové štýly alebo štýly). Kedysi sme centrovali v HTML pomocou centrum>značka, ale to už vo väčšine prehliadačov nefunguje.

Na krok

Metóda 1 z 2: Používanie CSS

  1. Otvorte textový súbor, v ktorom popisujete svoje štýly. Teraz centrum>Značka sa už nepoužíva, vytvorte v tomto súbore nový prvok, ktorý vycentruje text v určitých oblastiach dokumentu HTML. Ak nemáte samostatný súbor CSS, kódy sú v hornej časti dokumentu HTML medzi značkami „style>“ a „/ style>“.
    • Ako štýl>- a / štýl>značky tam zatiaľ nie sú, môžete ich vložiť priamo pod telo>označte nasledujúcim spôsobom:
    • ! DOCTYPE html> html> body> style> / style>

  2. Vytvorte triedu, ktorá centruje text. The div>značka informuje váš dokument HTML, ktorej konkrétnej sekcie sa táto trieda týka. Medzi značky „style“ zadajte nasledujúci text. Nezabudnite na ne dvakrát kliknúť ↵ Zadajte za prvým riadkom:

      div.a {}

  3. Pridajte znak zarovnať textnehnuteľnosť. Typ zarovnanie textu: na stred; medzi vzperami v div.a-sekcia. „Hlavička“ teraz vyzerá takto:

      ! DOCTYPE html> html> body> style> div.a {text-align: center; } / štýl>

  4. Pridajte ten správny divoznačte text, ktorý chcete vycentrovať. Robíte to cez div>značku nad týmto textom a uzavrieť ju znakom / div>značka pod týmto textom. Napríklad ak chcete vycentrovať nadpis a odsek pod ním, vyzerá to takto:

      div> h1> Vitajte na mojej webovej stránke / h1> p> Táto webová stránka slúži hlavne na poskytovanie informácií o veciach ./p> / div>

  5. Použi div.aznačka na vycentrovanie ďalších prvkov. Ak chcete vycentrovať ďalší prvok, napríklad obsah medzi značkami p> / p> a h2> / h2>), píšete div> pre tento prvok a / div> potom. Pretože ste už definovali súbor „div.a“ ako centrovací kód CSS, budú sa tieto prvky tiež centrovať.

      štýl> div.a {zarovnanie textu: stred; } / style> div> h2> Dary sú vítané / h2> p> prosím / p> / div>

  6. Skontrolujte svoj dokument. Aj keď sa text na vašej webovej stránke samozrejme líši, mal by vyzerať asi takto:

      ! DOCTYPE html> html> body> style> div.a {text-align: center; } / style> div> h1> Vitajte na mojej webovej stránke / h1> p> Táto webová stránka slúži hlavne na poskytovanie informácií o veciach. / p> / div> div> h2> Dary sú vítané / h2> p> prosím / p> / div> / body> / html>

Metóda 2 z 2: Použitie značky „stred“ v HTML

  1. Otvorte dokument HTML. Táto metóda popisuje, ako zastarané centrum>značka. Táto metóda môže stále fungovať v mnohých prehliadačoch, ale je lepšie sa na ňu príliš nespoliehať.
  2. Nájdite text, ktorý chcete vycentrovať. Posuňte sa nadol po dokumente, kým nenájdete nadpis, odsek alebo iný text, ktorý chcete vycentrovať.
  3. Na každú stranu textu umiestnite značku „stred“. Kód vyzerá takto stred> text / stred>. Tu je „text“ text, ktorý sa má centrovať. Ak sú v tomto texte ďalšie značky, napríklad „p> / p>“ pred odsekom, umiestnite značky „na stred“ mimo existujúce značky.

      centrum> h1> Vitajte na mojich webových stránkach / h1> / centrum> centrum> Urobte si pohodlie! / centrum>

  4. Skontrolujte svoj dokument HTML. Malo by to vyzerať asi takto:

      ! DOCTYPE html> html> telo> h1> centrum> Vitajte na mojej webovej stránke / centre> / h1> centrum> Uľahčite si to! / Centrum> p1> Tento web slúži hlavne na poskytovanie informácií o veciach. / P1> / telo > / html>