Как сделать красивую линию на странице?

Helgo · 23.10.2004, 18:18

Привет, уважаемые веб-мастера!
Подскажите пожалуйста, как Вы создаете линии на веб-страницах? Эти линии выделяют различные блоки на страницах (как и на этой). Мне встречаются иногда линии пунктирные, разных цветов и т.д. Расскажите пожалуйста о главных принципах техники.
Спасибо!

Junkers · 23.10.2004, 18:50

Эти лини, вообще-то, являются границами ячеек и строк таблицы разметки. С помощью CSS можно задать их вид, толщину и прочие параметры.

Vulko · 23.10.2004, 19:08

Цитата:

'border-style'
Значение: <border-style>{1,4} | inherit
Начальное: см. индивидуальные свойства
Применяется: ко всем элементам
Наследуется: нет
Процентное: N/A
Носитель: визуальный

Свойство 'border-style' устанавливает стиль для четырёх сторон рамки. Может иметь от одного до четырёх значений, и значения устанавливаются для разных сторон, как для 'border-width' выше.

Пример(ы):

#xy34 { border-style: solid dotted }
В этом примере горизонтальные линии рамки будут 'solid', а вертикальные - 'dotted'.

Поскольку начальное значение стиля рамки - 'none', рамка будет видна только после установки значения стиля.

Junkers · 23.10.2004, 19:09

Вот это круто!

Helgo · 23.10.2004, 19:33

Спасибо!
Мне еще понравился сайт - http://www.yuko-travel.ru/article.php - там линий не много, но применение их мне понравилось.

ЗАБАВА · 24.10.2004, 18:47

это можно сделать так:
например меню - рамка-низ
<head>
....
<style>
.line_bottom {border-bottom : 1px solid red;} -> рамка-низ : 1px-толщиной сплошная красная
</style>
...
</head>

<body>
<элемент class="line_bottom">Ссылка 1</элемент>
<элемент class="line_bottom">Ссылка 2</элемент>
<элемент class="line_bottom">Ссылка 3</элемент>
....
</body>

пунктирная рамка - dotted

Вано · 28.10.2004, 11:55

Пунктир можно сделать путем создания строки в таблице: 25*100%
А точку размером 25*3 в фотошопе нарисовать. А потом пишешь background="/путь к твоей картинке.gif"

Еще разделители можно сделать созданием дополнительной ячейки и заливанием ее нужным цветом!( bgcolor="black(хочешь зеленый: green и т.д.)" )

seka · 28.10.2004, 16:51

Вано, это вообще бред! Для этого есть CSS, зачем такой геморрой?

Вано · 29.10.2004, 11:55

Не понял, как через CSS нарисуеш пунктир? Или ты про то, что в CSS можно задать параметры таблы?

ЗАБАВА · 29.10.2004, 12:36

<html>

<head>
<STYLE>
.line_bottom { border-bottom : 2px dotted red; width : 200px; }
</STYLE>
</head>

<body>
<table border="0">

<tr>
<TD class="line_bottom">Ссылка 1</TD>
</tr>

<tr>
<TD class="line_bottom">Ссылка 2</TD>
</tr>

</table>
</body>

</html>

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Нужно сделать красивую шапку сайта	sarlnen	Вакансии	0	24.07.2016 13:29
Как сделать разноцветные ссылки на странице?	morfei	HTML, CSS, JavaScript	2	03.06.2010 12:34
кто сделает красивую шапку?	kiskis	Вакансии	12	28.01.2007 18:38
Фон на странице	GLUK	HTML, CSS, JavaScript	1	29.11.2006 23:43
Как загнуть линию?	kors@r	Растровая графика	7	24.03.2004 11:49

23.10.2004, 18:18	#1
Helgo	Привет, уважаемые веб-мастера! Подскажите пожалуйста, как Вы создаете линии на веб-страницах? Эти линии выделяют различные блоки на страницах (как и на этой). Мне встречаются иногда линии пунктирные, разных цветов и т.д. Расскажите пожалуйста о главных принципах техники. Спасибо!

23.10.2004, 18:50	#2
Junkers	Эти лини, вообще-то, являются границами ячеек и строк таблицы разметки. С помощью CSS можно задать их вид, толщину и прочие параметры.

23.10.2004, 19:33	#5
Helgo	Спасибо! Мне еще понравился сайт - http://www.yuko-travel.ru/article.php - там линий не много, но применение их мне понравилось.

24.10.2004, 18:47	#6
ЗАБАВА	это можно сделать так: например меню - рамка-низ <head> .... <style> .line_bottom {border-bottom : 1px solid red;} -> рамка-низ : 1px-толщиной сплошная красная </style> ... </head> <body> <элемент class="line_bottom">Ссылка 1</элемент> <элемент class="line_bottom">Ссылка 2</элемент> <элемент class="line_bottom">Ссылка 3</элемент> .... </body> пунктирная рамка - dotted

28.10.2004, 11:55	#7
Вано	Пунктир можно сделать путем создания строки в таблице: 25100% А точку размером 253 в фотошопе нарисовать. А потом пишешь background="/путь к твоей картинке.gif" Еще разделители можно сделать созданием дополнительной ячейки и заливанием ее нужным цветом!( bgcolor="black(хочешь зеленый: green и т.д.)" )

28.10.2004, 16:51	#8
seka	Вано, это вообще бред! Для этого есть CSS, зачем такой геморрой?

29.10.2004, 11:55	#9
Вано	Не понял, как через CSS нарисуеш пунктир? Или ты про то, что в CSS можно задать параметры таблы?

29.10.2004, 12:36	#10
ЗАБАВА	<html> <head> <STYLE> .line_bottom { border-bottom : 2px dotted red; width : 200px; } </STYLE> </head> <body> <table border="0"> <tr> <TD class="line_bottom">Ссылка 1</TD> </tr> <tr> <TD class="line_bottom">Ссылка 2</TD> </tr> </table> </body> </html>