Використовуйте CSS, щоб визначити вигляд веб-сторінки.
Кодувальник веб-сторінки використовує мову розмітки гіпертексту, щоб повідомити веб-браузеру функціональне призначення кожного елемента на сторінці, наприклад абзацу, заголовка чи списку. Починаючи з HTML 4, каскадні таблиці стилів надали програмісту можливість вказувати браузеру, як має виглядати кожен із цих елементів, окремо від визначення того, що вони собою представляють. Сторінка може мати різні стилі CSS для різних типів пристроїв, таких як мобільні телефони та настільні комп’ютери, що дозволяє змінювати зовнішній вигляд сторінки без необхідності змінювати кодером HTML. Використовуйте властивості CSS, щоб центрувати зображення.
Крок 1
Розмістіть тег "img" у файлі HTML там, де ви хочете, щоб ваше зображення відображалося на веб-сторінці. Він має бути між тегами "body" та після тегів "h1". Наприклад,
Відео дня
Це ваш текст.
визначає зображення під назвою photo.jpg, яке має ширину 170 пікселів і висоту 50 пікселів. Це перша річ на сторінці після верхнього заголовка.
Крок 2
Використовуйте атрибут CSS "margin", щоб визначити простір навколо елементів сторінки, наприклад зображень. Значення «auto» для атрибута margin повідомляє веб-браузеру автоматично визначати обсяг місця. Так, визначає, що простір навколо зображення визначається браузером.
Крок 3
Використовуйте властивість "display", щоб визначити, як відображатиметься елемент сторінки. Значення «блок» для властивості display повідомляє веб-браузеру відображати елемент у окремому рядку з пробілом над і під ним. Так, визначає те саме зображення, але додавання "display: block;" тепер розміщує його на власній лінії.
Крок 4
Перегляньте веб-сторінку в кількох різних браузерах, щоб переконатися, що зображення правильно відцентровано.
Порада
Включіть опис зображення в тег "alt". Це робить вашу сторінку більш доступною для читачів із вадами зору та гарантує, що ваш код відповідає стандартам.
