Акции

Скидка до 40% на создание Бизнес-сайта или Интернет-магазина при заключении договора на поддержку и продвижение!
Подробнее

Статьи и обзоры

2013-02-25

Линия с рисунком

Добавление небольших изображений к горизонтальным или вертикальным линиям расширяет возможности по их оформлению, а также делает такие линии уникальными по своему виду. Если же Вы хотите купить iphone 5 дешего, то обращайтесь на сайт notebookhp.ru.
Имеется несколько способов совмещения линий разного типа и рисунка, например через фоновое изображение или позиционирование. Классический метод предполагает, что линия вначале рисуется в графическом редакторе, а затем вставляется как повторяющееся фоновое изображение. Для этого случая требуется подготовить две картинки. Одна
из них содержит изображение ножниц, а вторая — фрагмент линии. Рамка вокруг линии, естественно, не рисуется, она приведена лишь для примера, чтобы показать размеры рисунка. Высота картинок должна быть одинакова,
а ширина может различаться.
Далее создаем новый стилевой класс с именем line, где указываем параметр background, он задает фоновый рисунок горизонтальной линии для DIV. Сам рисунок добавляется через тег IMG; НО чтобы он располагался по левому или правому краю, требуется поместить его внутрь контейнера SPAN И задать его выравнивание через свойство float. Значение left определяет рисунок на линии слева, a right — справа.
Рядом с линией можно добавить надпись, размер и шрифт которой также задается через стили. Если текст и линия накладываются друг на друга, то следует добавить атрибут padding-top; его задача заключается в том, чтобы
опустить надпись ниже линии. Однако он же приводит к тому, что рисунок также сдвигается от своего первоначального положения. Вернуть его на место поможет использование свойства margin-top с отрицательным значением в стиле тега SPAN.

Источник

Все новости>>

Обзоры

Все обзоры...

Полезные материалы

© 2012 VediTa Генеральный партнер компания "НТО ИНТ"

телефон +7 (4752) 48-54-15

создание сайтов в Тамбове