ЯК залити фон в html :: Веб-дизайн

Мова розмітки HTML дозволяє робити фон сторінки однотонним будь-якого кольору, а також розміщувати на ньому зображення. Це дає можливість отримати текст, наприклад, на тлі пейзажу або паперовій текстури.

Інструкція

Вибираючи колір фону або зображення для приміщення на нього, керуйтеся в першу чергу читаністю тексту. Фон повинен бути контрастним, іншими словами, символи повинні чітко виділятися на ньому. Якщо ви вирішили зробити фон графічним, обов'язково переконайтеся в тому, що ви є автором зображення або маєте право на його використання на підставі договору (наприклад, вільної ліцензії).

Знайдіть в HTML-исходнике сторінки тег . Щоб зробити фон однотонним і кольоровим, додайте в нього змінну bkcolor з аргументом у вигляді коду кольору. Після цього конструкція буде виглядати наступним чином:

Якщо ж ви бажаєте помістити на фон зображення, насамперед, зменшіть його розмір таким чином, щоб воно мало як горизонтальне, так і вертикальне дозвіл менше 320 включно. Збережіть його в новий файл, щоб не зіпсувати оригінал. Використовуйте формат JPG, PNG або GIF. Переконайтеся, що обсяг файлу не перевищує 100 кілобайт - так він буде завантажуватися швидше. Врахуйте, що мобільні браузери можуть все одно відображати замість нього однотонний фон.

Використовуючи веб-інтерфейс або програмний FTP-клієнт, помістіть файл із зображенням у ту з папок сервера, де розташований редагований вами HTML-файл.

Замість змінної bkcolor додайте в тег змінну background з аргументом у вигляді імені файлу із зображенням. Тепер він буде виглядати так: , де fon.gif - ім'я файлу. Зрозуміло, якщо він має інший формат, необхідно відповідно змінити його розширення в тезі.

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