Как сделать фон в html?

2 ноября 2014 г. Просмотров: 368 Инструкции
Веб-страница с фоном, как правило, выглядит краше, чем без него. От грамотных действий по добавлению фона зависит правильность отображения веб-страницы.
Создать сайт самостоятельно с Wix.com

Инструкция

  • Самый простой способ сделать фон в html-документе - прописать значение атрибутов к тегу body. Заданное значение атрибута background будет определять фоновый рисунок на странице. Если же задать значение атрибута bgcolor, то страница приобретет фоновый цвет.
    Цвет в атрибуте bgcolor тега body можно указывать как в шестнадцатеричном варианте, так и просто одним словом.
  • Можно добиться того же самого эффекта, воспользовавшись каскадными таблицами стилей CSS. Значение атрибута background-color определит фоновый цвет на странице, в то время как задание значения атрибуту background-image будет определять путь к фоновому рисунку страницы. Эти инструкции можно прописать на селектор body. Можно поступить и по-другому: в html тегу body присвоить класс или идентификатор, а в css указанные выше атрибуты прописать классу или идентификатору соответственно. Следует только иметь в виду, что если атрибуты будут прописаны классу, то в html-документе фоновый цвет будут иметь все объекты с указанным классом.
  • Указанные выше инструкции можно написать в самом теле html-документа. Для этого в служебной секции между тегами head (открывающим и закрывающим) открыть тег style. Между открытием и закрытием данного тега можно писать любые инструкции CSS. Следует только учитывать, что в этом случае вес страницы увеличится, что может негативно сказаться на времени ее загрузки у конечного пользователя. Также следует учесть, что в случае указания фоновой картинки, ее можно повторять по горизонтали, вертикали или по двум осям сразу. За это отвечает атрибут background-repeat в CSS. Фоновая картинка может быть жестко закреплена вне зависимости от наличия полосы прокрутки в документе. Для достижения такого эффекта следует указать background-attachment: fixed.
  • Фон у html-документа можно сделать, прибегнув к языкам программирования. Можно прописать инструкции html с помощью JavaScript. Для этого подойдет языковая конструкция document.write. Если то же самое выразить через модель DOM, то инструкция document.body.style.backgroundColor = “red” сделает фон страницы красным. Это равносильно прописыванию соответствующего атрибута напрямую в CSS.
  • Предыдущие инструкции можно прописать прямо в коде веб-страницы, создав пару тегов script между открывающим и закрывающим тегом head. Однако можно все эти указания записать в отдельный файл с расширением js, который, впоследствии, подключить к странице.
  • Оцените статью!