Як без проблем вставити картинку в HTML

Розмір зображення

З тим, як вставити картинку в текст з HTML, ми розібралися. Але якщо ми хочемо зробити зображення трохи більше або менше? Для цього в HTML передбачені спеціальні атрибути: width (ширина) і height (висота). Значення даних атрибутів можуть бути як у відсотках, так і в пікселях. Якщо задати ширину в пікселях, а висоту у відсотках, то код прийме наступний вигляд:

Якщо вказати тільки один з атрибутів розміру, то другий буде вираховуватися автоматично, але так, щоб дотримати пропорції зображення. При зазначенні обох параметрів важливо пам’ятати, що якщо розміри будуть перевищувати вихідні, картинка розтягнеться, а якщо розміри менше – стиснеться.

Зображення в якості фону

А що якщо ми хочемо використовувати зображення не в тексті, а вставити картинку на фон HTML, як це зробити? Для цього нам знадобиться тег , без якого не обходиться жоден HTML-документ. Саме у нього укладено все видиме вміст документа, а його атрибути можуть задавати розмір, колір шрифту і в тому числі задній фон. Вставити картинку в HTML як зображення фону дуже просто, для цього нам потрібно буде використовувати атрибут background. Виглядати цей код наступним чином:

Цікаве:  Кращі програми для оптимізації роботи компютера

При формуванні фону веб-сторінки краще використовувати такі зображення, за допомогою яких можна досягти цікавих зорових ефектів, але які не заважали б нормально сприймати текст. Однак варто мати на увазі, що, можливо, вам доведеться змінити розмір і колір вашого шрифту, щоб полегшити його прочитання.