[396x293]

Читать далее...

как сделать вот такую линию с фотошопом

[показать] 513px × 144px


Читать далее...

blah blah blah	yeah yeah yeah
whatever whatever	right on!

whatever whatever

right on!

[463x331]


----

blah blah blah	yeah yeah yeah
whatever whatever	right on!

whatever whatever

right on!

Weekday	Date	Manager	Qty
Mon	09/11	Kelsey	639
Tue	09/12	Lindsey	596
Wed	09/13	Randy	1135
Thu	09/14	Susan	1002
Fri	09/15	Randy	908
Sat	09/16	Lindsey	371
Sun	09/17	Susan	272
Total			4923

-

Weekday	Date	Manager
Monday	09/11/2000	Kelsey
Tuesday	09/12/2000	Lindsey
Wednesday	09/13/2000	Randy
Thursday	09/14/2000	Susan
Friday	09/15/2000	Randy
Saturday	09/16/2000	Lindsey
Sunday	09/17/2000	Susan
Monday	09/18/2000	Melody
Tuesday	09/19/2000	Christiane
Wednesday	09/20/2000	Symphony
Thursday	09/21/2000	Starflower
Friday	09/22/2000	Miko
Saturday	09/23/2000	Cleo
Sunday	09/24/2000	Alyx
Monday	09/25/2000	Dancing Star
Tuesday	09/26/2000	Dawn
Wednesday	09/27/2000	Josh
Thursday	09/28/2000	Ryan
Friday	09/29/2000	Mary Kay
Saturday	09/30/2000	Hallie
Sunday	10/01/2000	Paul

-

Weekday	Date	Manager	Qty
Monday	09/11	Kelsey	639
Tuesday	09/12	Lindsey	596
Wednesday	09/13	Randy	1135
Thursday	09/14	Susan	1002
Friday	09/15	Randy	908
Saturday	09/16	Lindsey	371
Sunday	09/17	Susan	272

Weekday	Date	Qty Shipped
Monday	09/11/2000	639
Tuesday	09/12/2000	596
Wednesday	09/13/2000	1135
Thursday	09/14/2000	1002
Friday	09/15/2000	908
Saturday	09/16/2000	371
Sunday	09/17/2000	272

-

Weekday	Date	Qty Shipped
Monday	09/11/2000	639
Tuesday	09/12/2000	596
Wednesday	09/13/2000	1135
Thursday	09/14/2000	1002
Friday	09/15/2000	908
Saturday	09/16/2000	371
Sunday	09/17/2000	272

-

Weekday	Date	Qty Shipped
Monday	09/11/2000	639
Tuesday	09/12/2000	596
Wednesday	09/13/2000	1135
Thursday	09/14/2000	1002
Friday	09/15/2000	908
Saturday	09/16/2000	371
Sunday	09/17/2000	272

-

Weekday	Date	Qty Shipped
Monday	09/11/2000	639
Tuesday	09/12/2000	596
Wednesday	09/13/2000	1135
Thursday	09/14/2000	1002
Friday	09/15/2000	908
Saturday	09/16/2000	371
Sunday	09/17/2000	272

TABLE BORDER

watermelon	grapes
peaches	bananas

-

BORDER=10

watermelon	grapes
peaches	bananas

-
BORDER=1 RULES=NONE FRAME=BOX

watermelon	grapes
peaches	bananas

-
BORDER=1 RULES=ALL FRAME=VOID

watermelon	grapes
peaches	bananas

Production
Raha Mutisya	1493
Shalom Buraka	3829
Brandy Davis	0283
Sales
Claire Horne	4827
Bruce Eckel	7246
Danny Zeman	5689

-

Production
Raha Mutisya	1493
Shalom Buraka	3829
Brandy Davis	0283
Sales
Claire Horne	4827
Bruce Eckel	7246
Danny Zeman	5689

-

Production	Raha Mutisya	1493
	Shalom Buraka	3829
	Brandy Davis	0283
Sales	Claire Horne	4827
	Bruce Eckel	7246
	Danny Zeman	5689

какое расстояние означает CELLSPACING
Пример расстояния показывает на Browser Explorer

<TABLE BORDER CELLSPACING=2>

peaches	cherries
walnuts	almonds

-

<TABLE BORDER CELLSPACING=10>

peaches	cherries
walnuts	almonds

.......................................................................................................................

какое расстояние означает CELLPADDING

[272x133]

<TABLE BORDER CELLPADDING=1>

peaches	cherries
walnuts	almonds

-

<TABLE BORDER CELLPADDING=10>

peaches	cherries
walnuts	almonds

Блогсервисы
ЖЖ	Ли.ру	Диари	Я.ру

---

Табличным кодом можно задать цветной фон поста:

Теги… Все эти кавычечки, буквочки и скобочки - как узоры следов на снегу. Сначала - неизвестная азбука, а потом, когда вникнешь - книга, прочтение которой не вызывает затруднений. Упоительнейшее занятие - пишешь слово, затем оборачиваешь его замысловатыми иероглифами, кутаешь в слои черно-белых символов и получаешь восхитительнейший результат. © singita

---

Можно фоном поста сделать картинку:

Спокойной ночи, дорогие друзья мои…

Параметр cellpadding задает оступ текста от границ картинки. Если объем текста превышает размеры картинки, она будет автоматически продублирована нужное число раз (в примере выше 2 раза)

---

Таблицей можно сделать рамку картинки:

ЗАКАТ

[показать]

Размер картинки любой - рамка сама “подгонится”

---

Быстро наложить текст на картинку без графических редакторов:

Закат на даче

В значения width и height вместо многоточий ставятся размеры картинки (их можно узнать из пункта “Свойства” вашей картинки)

---

Разделить пост на две части можно так:

Lorem ipsum dolor sit amet consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis …

В качестве разделителя служит пустой столбец
<td width="2" bgcolor="#000000"></td> , меняя width и bgcolor , меняем цвет и толщину разделителя

---

Делаем галереи картинок с помощью таблиц:
(здесь использованы кликабельные превьюшки. что и вам советую)

[показать]	[показать]
[показать]	[показать]
[показать]	[показать]

Или так:

[показать]	[показать]	[показать]

Читать далее...

---

Заголовок 1	Заголовок 2	Заголовок 3
РЯД 2	РЯД 2	РЯД 2
РЯД 3	РЯД 3	РЯД 3
РЯД 4	РЯД 4	РЯД 4

---

Цветная ячейка 1	Цветная ячейка 2
Цветная ячейка 3	Цветная ячейка 4

---

Цветная ячейка 1	Цветная ячейка 2
Цветная ячейка 3	Цветная ячейка 4

---

Блогсервисы	ЖЖ	Ли.ру
	Диари	Я.ру

---

Для плавного обтекания таблицы текстом:

Город	Население
Москва	10.000.000

Lorem ipsum dolor sit amet consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. ut wisi enim ad minim veniam…

в первый тег table нужно добавить

style="float: left; margin: 0 5px 2px 0;"

для аналогичного обтекания текстом справа:

style="float: right; margin: 0 0 2px 5px;"

---

Поместить несколько таблиц в ряд, например:

Город Население Москва 10.000.000

Город Население Минск 2.000.000

Город Население Киев 2.000.000

---

Город	Население
Москва	10.000.000
Минск	2.000.000
Киев	2.000.000

Таблицы

---

Переход наверх, в начало страницы (работает только в IE): В начало

<a href="#top">В начало</a>

---

Изменение формы курсора для отдельной ссылки:

Помощь по тегам

<a href="<a href="http://htmlka.com"" target="_blank">http://htmlka.com"</a> style="cursor:help">Помощь по тегам</a>

---

В Internet Explorer можно и так:

/www.htmate2.com/cursors/images/more3/1-2.ani" target="_blank">http://www.htmate2.com/cursors/images/more3/1-2.ani);"> Помощь по тегам

<a href="<a href="http://htmlka.com"" target="_blank">http://htmlka.com"</a> style="cursor: url(<a href="http://www.htmate2.com/cursors/images/more3/1-2.ani" target="_blank">http://www.htmate2.com/cursors/images/more3/1-2.ani</a>);"> Помощь по тегам</a>

---

Ссылка на свой и-мейл: Написать автору htmlka.com

<a href=mailto:адрес почты>Написать мне e-mail</a>

---

Список ссылок:

• link one

• link two

• link three

• link four

• link five

Код:

вместо # ставим свои линки, в виде http://htmlka.com

---

Эффект подсветки ссылки (наведите курсор на текст):

В некоторых блогсервисах может не работать

Это очень интересная ссылка

<a href="АДРЕС СТРАНИЦЫ"><font onmouseover="style.backgroundColor='pink'; style.cursor='hand'" onMouseOut="style.backgroundColor='silver';">ТЕКСТ ССЫЛКИ</font></a>

Обвести пунктиром:


htmlka.com

<a href="АДРЕС СТРАНИЦЫ" style="border: 2px dashed navy; padding: 2px; text-decoration: none;">Ваш текст</a>

---

Обвести точками и назначить свой цвет текста:


htmlka.com

<a href="АДРЕС СТРАНИЦЫ" style="border: 2px dotted navy; padding: 2px; text-decoration: none; color: red;">Ваш текст</a>

---

Ссылка с выделенным фоном:

htmlka.com

<a href="АДРЕС СТРАНИЦЫ" style="background:yellow; color:black">ТЕКСТ</a>

---

Переход к определенной строке на той же странице (работает только в IE), например: “Всем читать Отменить подчеркивание для ссылки”

1. <a name=#1></a>Нужная строка

2. <a href=#1>Ссылка-переход к нужной строке</a>

Если требуется еще переход, ставим name=#2 и т.д. (удобно для оглавлений на страницах с большим вертикальным скроллингом)

---

Переход к определенной строке на другой веб-странице (работает только в IE), например: “Узнать про Некоторые спецсимволы”

1. <a name=#1></a> "Некоторые спецсимволы" на http://htmlka.com

2. <a href=http://htmlka.com#1>Некоторые спецсимволы</a>

Ссылка на веб-страницу:

На главную страницу

<a href="АДРЕС СТРАНИЦЫ"> Ваш текст </a>

---

Чтоб ссылка открылась в новом окне:

На главную

<a href="АДРЕС СТРАНИЦЫ" target="_blank">текст</a>

---

Всплывающий комментарий к ссылке:

htmlka.com

<a href="АДРЕС СТРАНИЦЫ" target="_blank" title="Откроется в новом окне">текст</a>

---

Как сделать, чтобы картинка была ссылкой на веб-страницу: [показать]

<a href="АДРЕС СТРАНИЦЫ" target=_blank title="Пояснительный текст"><img src="URL картинки"></a>

---

Отменить подчеркивание для ссылки:

htmlka.com

<a href="АДРЕС СТРАНИЦЫ" style="text-decoration: none;">Ваш текст</a>

---

Подчеркуть ссылку пунктиром:

htmlka.com

<a href="АДРЕС СТРАНИЦЫ" style="border-bottom: 2px dashed navy; text-decoration: none;">Ваш текст</a>

---

Назначить свой цвет текста ссылки и подчеркивания:

htmlka.com

<a href="АДРЕС СТРАНИЦЫ" target="_blank" style="color:green; text-decoration:underline;"><span style="color:red;">Ваш текст</span></a>

---

Обвести рамочкой:


htmlka.com

<a href="АДРЕС СТРАНИЦЫ" style="border: 2px solid navy; padding: 2px; text-decoration: none;">Ваш текст</a>

Занесение в Избранное по клику (только для ИЕ):

прим.:В некоторых блогсервисах (напр. ЖЖ) не работает



В Избранное!



Код:

<span style="color:navy;cursor:hand;" onClick="window.external.AddFavorite(location.href, document.title);">

<font face=Helvetica size=3>

В Избранное!

</font>

</span>

---

Навигационная кнопка “Назад”:

<form><input type="button" value="НАЗАД" onclick="history.go(-1)"></form>

---

Аналогичная ссылка “назад”: НАЗАД

<a href="javascript:history.go(-1)">НАЗАД</A>

---

Кто желает такую кнопку, ведущую на этот сайт:

[показать]

<a href=http://htmlka.com target=_blank title="Помощь по тегам"><img src="<a href="http://img141.imageshack.us/img141/8021/57231682vk8.jpg"" target="_blank">http://img141.imageshack.us/img141/8021/57231682vk8.jpg"</a> /></a>

Список с маленькими картинками:

[показать] Позиция 1

[показать] Позиция 2

[показать] Позиция 3

[показать] Позиция 4

Код:



<dl>

<dd><img src=URL-картинки align=absmiddle> Позиция 1</dd>

<dd><img src=URL-картинки align=absmiddle> Позиция 2</dd>

<dd><img src=URL-картинки align=absmiddle> Позиция 3</dd>

<dd><img src=URL-картинки align=absmiddle> Позиция 4</dd>

</dl>

URL “шарика”: http://img90.imageshack.us/img90/6603/33609040px4.gif

Делаем кнопку-ссылку на страницу (с картинкой):

Tags

Код такой кнопки:

<form action="АДРЕС САЙТА" target="_blank" method="get"><button type="submit"><img src="АДРЕС КАРТИНКИ" align=absMiddle> TEXT</button></form>

---

Графические диаграммы средствами html:

<div style="float: left; width:25%; height:16px; background-color:orange;">&nbsp;</div> <div style="float: none;">&nbsp;&nbsp;25% - Firefox</div><div style="float: left; width:70%; height:16px; background-color:blue;">&nbsp;</div><div style="float: none;">&nbsp;&nbsp;70% - IE</div><div style="float: left; width:10%; height:16px; background-color:red;">&nbsp;</div><div style="float: none;">&nbsp;&nbsp;5% - Opera</div>

<div style="float: left; width:35px; height:16px; background-color:aqua;">&nbsp;</div><div style="float: left; width:65px; height:16px; background-color:pink;">&nbsp;</div><div style="float: none;">&nbsp;&nbsp; - 35% того и 65% этого</div>

---

Любой пароль, скрытый за звездочками, открывается с помощью javascript-кода:

javascript:(function(){var s,F,j,f,i; s = “”; F = document.forms; for(j=0; jtextarea> исполненного в адресной строке браузера (IE, FF, Opera, Netscape) на странице авторизации.<br /><br /> <br /> <br /> <br /> <hr /><br /> <br /> Список с цветными “бульками”:<br /> <p><font color="red">•</font> Позиция 1<br /><br /> <font color="blue">• </font> Позиция 2<br /><br /> <font color="green">• </font> Позиция 3</p><br /> <p>Делается так:<br /><br /> <font color="Blue"><br /><br /> <font color=red>&bull;</font> Позиция 1<br /><br /> <font color=blue>&bull;</font> Позиция 2<br /><br /> <font color=green>&bull;</font> Позиция 3<br /><br /> </font></p><br /> <br /> <br />

---

ее код:

<hr>


Далее:

---

<hr align=center width=60%>

По умолчанию линия имеет толщину 2 пиксела и некоторую объемность.

-

Необъемная линия:

---

<hr noshade>

-

---

<hr noshade width=60% size="3">

-

---

<hr size=3 color="#FF0000">

-

---

<hr color="#00B344">

-

---

<hr noshade align="center" width="3" size="50">

-

---

<hr size="5" width="60%" align="center" color="blue">

-

---

<hr color="blue" size="7" style="border: dotted 5pt; border-color: red ">

-

---

<hr color="red" size="9" style="border: dotted 5pt; border-color: blue ">

-

---

<hr color="black" size="4" style="border: dashed 5pt; border-color: aqua ">

-

Повторюсь, что цветные линии корректно отображает только IE, поэтому иногда проще использовать клавиатурные или спец. символы:

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

оформленные в виде текстового абзаца:


<p align=center style=color:blue;>~~~~~~~~~~~~~~~~~~~~~~~~</p>

Бегущая строка

Читать далее...