Център на текста в HTML

Автор: Tamara Smith
Дата На Създаване: 28 Януари 2021
Дата На Актуализиране: 1 Юли 2024
Anonim
Как в HTML сделать выравнивание текста по центру | Уроки HTML, CSS
Видео: Как в HTML сделать выравнивание текста по центру | Уроки HTML, CSS

Съдържание

Тази wikiHow ви учи как да центрирате текста в HTML уебсайт. За това използваме CSS (каскадни таблици със стилове или таблици със стилове). По-рано центрирахме в HTML с помощта на център>тагове, но това вече не работи в повечето браузъри.

Стъпвам

Метод 1 от 2: Използване на CSS

  1. Отворете текстовия файл, в който описвате стиловете си. Сега център>tag вече не се използва, създайте нов елемент в този файл, който ще центрира текста в определени области на вашия HTML документ. Ако нямате отделен CSS файл, кодовете са в горната част на HTML документа между таговете "style>" и "/ style>".
    • Като стил>- и / стил>етикетите все още не са там, можете да ги поставите директно под тяло>маркирайте по следния начин:
    • ! DOCTYPE html> html> body> style> / style>

  2. Създайте клас, който центрира текста. The div>tag казва на вашия HTML документ към кой конкретен раздел се отнася този клас. Въведете следното между таговете "style", като не забравяте да щракнете два пъти ↵ Въведете след първия ред:

      div.a {}

  3. Добавете подравняване на текстИмот. Тип подравняване на текст: център; между скобите в div.a-секция. "Заглавката" сега изглежда така:

      ! DOCTYPE html> html> body> style> div.a {text-align: center; } / стил>

  4. Добавете правилния divетикет към текста, който искате да центрирате. Правите това чрез div>етикет над този текст и го затворете с / div>етикет под този текст. Например, ако искате да центрирате заглавие и абзаца под него, това изглежда така:

      div> h1> Добре дошли в моя уебсайт / h1> p> Този уебсайт е основно за предоставяне на информация за нещата. / p> / div>

  5. Използвай div.aтаг за центриране на други елементи. Когато искате да центрирате друг елемент, например съдържание между маркерите p> / p> и h2> / h2>), пишете div> за този елемент и / div> след това. Тъй като вече сте дефинирали "div.a" като центриращ CSS код, тези елементи сега също са центрирани.

      стил> div.a {text-align: center; } / style> div> h2> Даренията са добре дошли / h2> p> моля / p> / div>

  6. Проверете документа си. Въпреки че текстът на вашата уеб страница, разбира се, е различен, той трябва да изглежда по следния начин:

      ! DOCTYPE html> html> body> style> div.a {text-align: center; } / style> div> h1> Добре дошли в моя уебсайт / h1> p> Този уебсайт е основно за предоставяне на информация за нещата. / p> / div> div> h2> Даренията са добре дошли / h2> p> моля / p> / div> / body> / html>

Метод 2 от 2: Използване на маркера "center" в HTML

  1. Отворете вашия HTML документ. Този метод описва как да получите остарелите център>етикет. Този метод все още може да работи в редица браузъри, но най-добре е да не разчитате много на него.
  2. Намерете текста, който искате да центрирате. Превъртете надолу документа, докато намерите заглавието, абзаца или друг текст, който искате да центрирате.
  3. Поставете маркера "center" от двете страни на текста. Кодът изглежда така център> текст / център>. Тук "текст" е текстът, който трябва да бъде центриран. Ако в този текст има други маркери, като например "p> / p>" преди абзац, поставете маркерите "center" извън съществуващите тагове.

      center> h1> Добре дошли в моя уебсайт / h1> / center> center> Настанете се удобно! / center>

  4. Проверете вашия HTML документ. Тя трябва да изглежда по следния начин:

      ! DOCTYPE html> html> body> h1> center> Добре дошли в моя уебсайт / център> / h1> center> Улеснете себе си! / Center> p1> Този уебсайт е основно за предоставяне на информация за нещата. / P1> / body > / html>