Задаволены

• крокі
• Метад 1 з 2: CSS (рэкамендуецца)
• Метад 2 з 2: Навык «align» у HTML

атрыбут align тэга html> лічыцца састарэлым са з'яўленнем HTML5. Хоць гэты атрыбут па-ранейшаму працуе ў большасці вэб-браўзэраў, рэкамендуецца выраўноўваць малюнка з дапамогай каскадных табліц стыляў (CSS). У гэтым артыкуле мы распавядзем вам, як Цэнтраваць малюнка з дапамогай CSS і састарэлага тэга align.

крокі

Метад 1 з 2: CSS (рэкамендуецца)

1. 1 Дадайце HTML-код для малюнка. Для выраўноўвання карцінкі вы скарыстаецеся каскаднымі табліцамі стыляў (CSS), але размясціць яе на старонцы прыйдзецца з дапамогай HTML. Далей прыведзены прыклад выкарыстання тэга img> для ўстаўкі выявы ў код:

   img src = "dog.webp" alt = "гэта карцінка сабакі">

   • замест dog.webp падстаўце назву файла карцінкі, а пасля «alt» увядзіце апісанне малюнка. значэнне center для «class" не мяняйце, таму што вы створыце CSS-клас з гэтым імем.
2. 2 Знайдзіце CSS-код. Калі на сайце ёсць асобны CSS-файл, адкрыйце яго. Калі няма, CSS-код, хутчэй за ўсё, знаходзіцца ў верхняй частцы HTML-файла ўсярэдзіне тэгаў head>. Пракруціць да верхняй часткі файла, каб знайсці тэгі style> / style>.
   • калі тэгаў style> / style> няма, дадайце іх. Прачытайце гэты артыкул, каб атрымаць дадатковую інфармацыю.
3. 3 Дадайце ў CSS код для выраўноўвання карцінкі. Замест «50%» можна ўвесці іншае значэнне, каб выява з'явілася на старонцы. Адцэнтраваны малюнак са значэннем «100%" не атрымаецца, таму гэтая лічба павінна быць іншым.

   .center {display: block; margin-left: auto; margin-right: auto; width: 50%; }

4. 4 Захавайце унесеныя змены. Захавайце HTML-файл і CSS-файл (калі ён ёсць). Так вы отцентрируете малюнак.
   • Таксама ўнутры тэгаў img> можна дадаць , Каб отцетрировать іншыя выявы.

Метад 2 з 2: Навык «align» у HTML

1. 1 Стварыце новы абзац. Хоць дадзены метад цэнтравання малюнкаў лічыцца састарэлым, ён усё яшчэ працуе ў многіх браўзэрах. Аднак мы рэкамендуем выкарыстоўваць CSS, каб сайт функцыянаваў, калі браўзэры спыняць падтрымліваць ўказаны атрыбут. Памятаеце, што атрыбут align отцентрирует карцінку толькі ўнутры элемента, які яе акружае (напрыклад, усярэдзіне тэгаў p> / p> або div> / div>). У якасці прыкладу ў HTML-файле мы створым новы абзац, дадаўшы p> на асобным радку.
2. 2 Дадайце HTML-код для малюнка. Калі ласка, увядзіце наступны код пасля тэга p>. Выкарыстоўвайце гэты прыклад у якасці кіраўніцтва:

   p> img src = "dog.webp" alt = "карцінка" align = "middle">

   • замест dog.webp падстаўце назву файла карцінкі, а пасля «alt» увядзіце апісанне малюнка.
   • Атрыбут «middle» паведамляе браўзэру, што карцінку трэба адлюстраваць у цэнтры старонкі.
3. 3 Зачыніце тэг абзаца. Для гэтага дадайце / P> пасля тэга карцінкі. Гатовы код павінен выглядаць прыкладна так:

   p> img src = "dog.webp" alt = "карцінка" align = "middle"> / p>

4. 4 Захавайце унесеныя змены. Так вы отцентрируете малюнак.