Как создать фон для любого сайта

В этой статье мы познакомим вас с тем, как создать фон для сайта. Надеемся, что статья будет для вас полезной и интересной. Основные используемые технологии — CSS+HTML, также будем использовать программу Adobe Photoshop.

фон для сайтаВ качестве фона для своего сайта вы можете использовать уже готовый фон, скаченный из интернета, либо попытаться создать его самостоятельно. В качестве инструмента возьмём программу Adobe Photoshop. Не будем подробно описывать принцип работы с этой программой, об этом можно узнать из любого самоучителя. Необходимо нарисовать любую картинку, и сохранить её последовательностью клавиш главного меню Файл -> Сохранить для web и устройств.

Теперь осталось только подключить созданный фон. Для этого используем связку CSS+HTML. Мы имеем два файла — style.css и index.html. В первом файле мы подключаем фоновое изображение. Это делается в теге <body></body>. Этот тег описывает тело документа и имеет свойство «background», в которое и вписывается путь до изображения. Выглядит это так: Body {Background url (“путь до файла-фона”) }. Не стоит забывать о расширении файла. Если изображение имеет название pictures1.png (где .png — это его расширение), и оно лежит в одной папке с основными файлами, то мы получим Background url (“pictures1.png”).

В том случае, если ваш сайт уже имеет фон, и вы хотите его изменить, сделать это очень просто. Следует только поменять старый фон на новый. Для этого в свойстве Background тега <body></body> необходимо поменять путь до файла, изменив его на путь до нового изображения.

Если вы хотите использовать в качестве фона для вашего сайта цвет из палитры цветов, то используйте установку тега <body></body> — background-color.

Фоновый рисунок можно также расположить в различных областях экрана: слева, в центре, снизу, справа, сверху. Для этого используется установка background-position.

Многие авторы используют на своих сайтах фоны с анимацией. Анимация — сложна по созданию, но эффектна по восприятию. Лучше всего анимированный фон использовать только в шапке сайта.

В погоне за красивым фоном не стоит забывать другой момент. Время загрузки вашего сайта увеличивается в зависимости от сложности рисунка. И далеко не у всех пользователей, к сожалению, есть быстрый интернет. Но выбирать всё равно вам.

Татьяна Шантина

Ещё статьи по теме:
Как создать сайт для игры Counter-Strike.
Как создать сайт агентства недвижимости.

Рейтинг
( Пока оценок нет )
Понравилась статья? Поделиться с друзьями:
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:

Проверка комментариев включена. Прежде чем Ваши комментарии будут опубликованы пройдет какое-то время.

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.