YOUSELLER
Среда, 19.02.2020, 05:11
Приветствую Вас Гость | RSS
 
Главная Каталог статей и уроковРегистрацияВход
Меню сайта
Категории каталога
HTML [4]
CSS [8]
Для сайта [4]
Электронные деньги [2]
Разное [6]
Мини-чат
200
Наш опрос
Оцените мой сайт
Всего ответов: 18
Главная » Статьи » Уроки » CSS

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

Делаются эти полосы очень просто. Полоса может быть сколько угодно длинной потому что состоит из растиражированной точки.

Под большим увеличением эта точка выглядит примерно так:



Скачать изображения этих точек для создания подобных линий http://youseller.my1.ru/jpeg/points.zip

Для создания горизонтальной линии:

HTML часть

Вставьте этот участок кода в том месте страницы, где Вам нужна линия.

<div class="line"></div>

CSS часть

.line {
background:url(img/line_horz.gif) top left repeat-x; height:1px; width:500px;
}

Ширину горизонтальной линии Вы можете регулировать, меняя значение свойства width.

Для создания вертикальной линии:

HTML часть

Вставьте этот участок кода в том месте страницы, где Вам нужна вертикальная линия.

<div class="line2"></div>

CSS часть

.line2{<br>
background:url(img/line_vert.gif) top left repeat-y; height:500px; width:1px;<br>
}

Высоту горизонтальной линии Вы можете регулировать, меняя значение свойства height.

Вот, что получилось у меня http://ruseller.com/examples/line/index.php

Категория: CSS | Добавил: Денис (10.08.2008) | Автор: Евгений Попов
Просмотров: 412 | Рейтинг: 0.0/0 |
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Форма входа
[05.08.2008][Евгений Попов]
А вы делаете эти дизайнерские ошибки на своём сайте? (1)
[05.08.2008][Евгений Попов]
5 точек потенциального клиента, которые должен знать каждый бизнесмен. (0)
[05.08.2008][Евгений Попов]
5 причин, по которым люди выберут Ваш товар. (0)
[05.08.2008][Евгений Попов]
Как превратить Ваш сайт в магнит влияния на клиентов? (0)
[05.08.2008][Евгений Попов]
Электронная коммерция и электронный (онлайн) бизнес. В чём различия? (0)
[05.08.2008][Евгений Попов]
Наступило лучшее время для начала бизнеса в Сети. (0)
[05.08.2008][Евгений Попов]
Бесплатный хостинг для ведения бизнеса - забудьте! (0)
[05.08.2008][Евгений Попов]
Цель - это путь к вершине! (0)
[05.08.2008][HTML]
Как замаскировать тэг H1 (1)
[05.08.2008][HTML]
Урок: Как правильно использовать фаил robots.txt для запрета индексации фаилов и папок? (0)
Поиск
Друзья сайта
php5.ru
[17.08.2008][Видеоуроки]
Light Box 2 - создание слайдшоу на Вашем сайте (0)
[17.08.2008][Видеоуроки]
Создаем красивую пластиковую кнопку в Фотошопе (0)
[17.08.2008][Видеоуроки]
Внешний вид формы обратной связи (0)
[17.08.2008][Видеоуроки]
Создание интересных CSS меню для сайта (3)
[05.08.2008][Программы]
Total Commander 7.02a Powerpack - отличный фаил-менеджер (0)
[17.08.2008][Видеоуроки]
Плавное увеличение изображения при клике (0)
[16.08.2008][Видеоуроки]
Как скрыть элемент сайта от посторонних глаз (0)
[17.08.2008][Видеоуроки]
Как создать 3D обложку быстро и бесплатно? (2)
[08.08.2008][Видеоуроки]
Как создать форму обратной связи для сайта. (0)
[16.08.2008][Видеоуроки]
Как проще всего сделать поиск по сайту (2)
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Copyright © 2020