Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Украсим область основного заголовка

.

Сейчас я собираюсь показать вам, как сделать более привлекательной область заголовка, используя все ту же технику. Я снова выбрал изображение, которое появится с правой стороны. В то же время это уже не градиент, и рисунок не будет повторяться. Используем изображение, показанное на рис. 5.33, но в заголовке будет видна только его часть.

Рис. 5.33. Фоновое изображение для области заголовка

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

Здесь выбрано изображение, которое длиннее, чем заголовок главной страницы. Таким образом мы гарантируем, что страница отобразится корректно, даже если пользователи значительно увеличат шрифт и размер элемента возрастет. Да-да, нужно учитывать и такую возможность!

Напишите CSS-код для достижения этого эффекта. Убедитесь, что пишете его после общего правила для заголовков hi, h2, h3, ведь требуется заменить простую синюю заливку. Дополните правило для заголовка hi новой строкой.

Эффект продемонстрирован на рис. 5.34.

Рис. 5.34. Фоновые изображения преображают сайт

.

Читайте так же:
Not found