| | |
|
Обновленные темы |
Популярные темы |
Последние файлы |
Последние новости |
|
|
|
|
Линии для Оформления сайта
|
|
|
Дата: Пт, 07.10.2011, 21:53:25 | Сообщение # 1
|
|
Линии для Оформления сайта Типы линий и как их создавать
Линии можно применять, например, для того, чтобы делить пост на логические разделы, отделять друг от друга цитаты, мысли, афоризмы. Замечу, что цветные линии отображаются на 100% корректно только в IE Вот она, линия:
ее код: Далее: Code <hr align=center width=60%>
По умолчанию линия имеет толщину 2 пиксела и некоторую объемность.
Необъемная линия:
Code <hr noshade width=60% size="3">
Code <hr size=3 color="#FF0000">
Code <hr size="5" width="60%" align="center" color="blue">
Code <hr color="blue" size="7" style="border: dotted 5pt; border-color: red ">
Code <hr color="red" size="9" style="border: dotted 5pt; border-color: blue ">
Code <hr color="black" size="4" style="border: dashed 5pt; border-color: aqua ">
Повторюсь, что цветные линии корректно отображает только IE, поэтому иногда проще использовать клавиатурные или спец. символы:
~~~~~~~~~~~~~~~~~~~~~~~~ Code <p align=center style=color:blue;>~~~~~~~~~~~~~~~~~~~~~~~~</p> оформленные в виде текстового абзаца:
Code <img src=http://img218.imageshack.us/img218/9140/line002va4.gif align=center>
Code <img src=http://media.bigoo.ws/content/90/265890/Stars.gif align=center>
Code <img src=http://img87.imageshack.us/img87/6087/hline13lz2.gif align=center> Эти линии представляют собой картинки (и их должны корректно отображать все браузеры) Собраний таких картинок в сети сейчас пруд пруди.
Наберите в поисковике divider - и вперед Если нужно прижать линию к левой кромке записи, вместо align=center ставьте align=left к правой - align=right
взято с ucozon.ru
|
|
|
Дата: Пт, 07.10.2011, 23:46:35 | Сообщение # 2
|
|
Это пока для меня тяжело , но учить буду. Спасибо автору темы.
И ещё не понятно как можно линии не горизонтально ставить а вертикально .
|
|
|
Дата: Сб, 08.10.2011, 01:16:54 | Сообщение # 3
|
|
Горизонтальная HTML линия определяется непарным тегом HTML линия может быть не только горизонтальной, но и вертикальной. Вертикальная линия в HTML может являться стороной блока или ячейки таблицы. Линия в HTML бывает любого размера и цвета, имеет или не имеет объемность. Пример вертикальной линии красного цвета слева. Code <div style="height:30px; width:560px; border-left:2px solid #cc0033; background-color:#fc9; padding-left:10px">Пример вертикальной линии красного цвета слева. </div>
Code <div style="height:40px; width: 2px; background-color:red" > </div>
|
|
|
Дата: Сб, 04.08.2012, 15:16:29 | Сообщение # 4
|
|
RUS_D, [b10] [ccpas]![/ccpas][/b10]
|
|
|
Дата: Пт, 29.03.2013, 13:15:43 | Сообщение # 5
|
|
Код [url=http://fotki.yandex.ru/users/fot462/view/285963/][img]http://img-fotki.yandex.ru/get/4805/fot462.137/0_45d0b_628018c1_L.jpg[/img][/url]
|
|
|
Дата: Пт, 29.03.2013, 13:18:31 | Сообщение # 6
|
|
Линии для оформления дизайна документа html.
Для оформления дизайна сайта с целью увеличения числа посетителей и увеличения вашего заработка в интернете существует ряд дополнительных атрибутов, с которыми мы и познакомимся в этом разделе. В начале познакомимся с линиями html. Для оформления страниц html линии можно сделать горизонтальными и вертикальными.
Горизонтальные разделительные линии задаются тэгом и не требует закрывающего тэга. Для линий html, также имеются дополнительные атрибуты, которые прописываются в тэге :
width – задаёт длину линии. Может быть как в пикселях, так и в процентах; size – задаёт толщину линии. Лучше всего задавать в пикселях. По умолчанию линия имеет толщину 2 пикселя; align - атрибут для выравнивания линии по горизонтали. Может иметь значения center, right, left: center - выравнивание по центру документа; right - выравнивание по правому краю документа; left - выравнивание по левому краю документа. noshade – атрибут для формирования сплошной темной линии; сolor - задаёт цвет линии. Работает только в Internet Explorer.
Теперь посмотрим, как это выглядит в коде html:
Далее поговорим о вертикальных линиях html. Прописать такую линию можно несколькими способами, с помощью таблиц и с помощью стилей. Разберём создание вертикальных линий с помощью таблиц. Код html будет выглядеть следующим образом:
Код <table width="40%" cellpadding="0" cellspacing="15" border="0" align="center"> <tr> <td width="4" bgcolor="#990000"> <img src="spacer.gif" width="4" height="1"> </td> <td>Анекдоты - самая распространенная в современном фольклоре форма юмора. Анекдоты наиболее короткие по содержанию и сжатые в изложении рассказы о забавных случаях с неожиданной и остроумной концовкой, что в лучшую сторону отличает их от таких не менее забавных жанров как частушки, стишки, приколы и афоризмы. На этом сайте Вы найдёте множество <a href="http://www.rabotjagamneta.com/iymor1.html">прикольных анекдотов</a> и сможете расслабиться от повседневных трудовых будней. </td> </tr> </table>
Параметры cellpadding и border должны быть равны нулю, cellspacing определяет расстояние от текста до линии, width ширина линии.
Создать вертикальную линию можно также с помощью стилей. Код html будет иметь такой вид:
Код <style type="text/css"> P.line { (Прописываем расположение вертикальной линии от текста.) border-left: solid 2px black; (Прописываем отступ от края до текста.) margin-left: 20px; (Прописываем расстояние от линии до текста) padding-left: 7px; } </style>
Он прописывается в теге .... Пример расположения стилей в коде html:
Код <html> <head> <title>Прикольные анекдоты.</title> <style type="text/css"> P.line { border-left: solid 2px black; margin-left: 20px; padding-left: 7px } </style> </head> <body text="#FF0033" bgcolor="#66CC99" link="#FF3366" alink="#6666FF" vlink="#FF3366"> <div align="center"> <H1>Прикольные анекдоты.</H1> <font color="#0000CC">Вселенная юмора. </font> </div> <p class="line" align="justify"> <font color="#63300" face=" Garamond, Arial, Verdana ">Анекдоты - самая распространенная в современном фольклоре форма юмора. Анекдоты наиболее короткие по содержанию и сжатые в изложении рассказы о забавных случаях с неожиданной и остроумной концовкой, что в лучшую сторону отличает их от таких не менее забавных жанров как частушки, стишки, приколы и афоризмы. На этом сайте Вы найдёте множество <a href="http://www.rabotjagamneta.com/iymor1.html">прикольных анекдотов</a> и сможете расслабиться от повседневных трудовых будней. </font></p> </body> </html>
|
|
|
Дата: Пт, 29.03.2013, 13:50:46 | Сообщение # 7
|
|
Подборка линий и разделителей Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/1cb3457e3d52430f54d2eac9ccff41365f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/fc1b58cde115fb7f4adac0ba4b2a04df5f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/5c7225863dafa94e78ac3035ef5ba8e75f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/388e390b31d8092e55505c46d50a59685f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/5f45b43db6ddaf641df1553de71b5fe95f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/8bdbd5878f5c1be406d56af7929674b65f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/2dcb265e15ed433d10b7e54aa6d4754b5f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/7995656f8c24f6015e79c296672fb3575f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/0cb8b979de37402aa52efd81126697245f6f94147210400.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/305d34ed542ba5c3f7930fcd863665b35f6f94147210400.gif[/img][/url]
|
|
|
Дата: Пт, 29.03.2013, 14:03:46 | Сообщение # 8
|
|
Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/83a0a43e253765753dc38c0babe523ff5f6f94147210760.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/3f0d881791f3c10c42675c85fdf165e85f6f94147210760.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/015a19165df5273d86d57755fbaacd7d5f6f94147210760.gif[/img][/url]
|
|
|
Дата: Пт, 29.03.2013, 14:12:53 | Сообщение # 9
|
|
Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/7692dcca020459d1e185749d6a3857885f6f94147211317.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/ebe15cb860957bf32d0a4cbcb300225d5f6f94147211317.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/01e192255ab862f1b824bc13d9d43cf15f6f94147211317.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/f70a13232e07144c846ff19eb1f8da685f6f94147211981.gif[/img][/url] Код [url=http://ifotki.info/][img]http://f14.ifotki.info/org/56ff8c739937d775259ba0a6b83b91cc5f6f94147211981.gif[/img][/url]
|
|
|
Дата: Пт, 29.03.2013, 18:46:22 | Сообщение # 10
|
|
Продолжение каталога. На этом примере можно увидеть разделить, где ссылку Вы можете поставить свою. Так же нарисовать свою картинку. Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/0.png[/img][/url] Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/547387016.gif[/img][/url] Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/48f9c0fecef9.gif[/img][/url] Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/1ab1052fa951.gif[/img][/url] Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/aeae6cd16046.gif[/img][/url] Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/b9526cc46bed.gif[/img][/url]
|
|
|
Дата: Пт, 29.03.2013, 19:48:13 | Сообщение # 11
|
|
Линии сталкер1. Рисуем картинку. 2.Загружаем в ФМ 3.Вставляем в код Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/stalker-1.gif[/img][/url]
Код [url=http://bar-reaktor.ru/][img]http://bar-reaktor.ru/kartinki/poloski/stalker-2.gif[/img][/url]
|
|
|
Дата: Пн, 09.09.2013, 19:31:39 | Сообщение # 12
|
|
|
Дата: Чт, 26.12.2019, 16:15:05 | Сообщение # 13
|
|
|
Дата: Чт, 26.12.2019, 16:33:32 | Сообщение # 14
|
|
|
Дата: Чт, 26.12.2019, 16:42:39 | Сообщение # 15
|
|
| | | | |
|