Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Сайтостроение (уроки по HTML, PHP, mySQL , WEB-дизайн)


Служба Рассылок Subscribe.Ru


Сайтостроение. Основы HTML. Уроки с сайта http://progs.biz

Рассылка №3

Основы HTML. Урок 9. Посылаем e-mail с WEB-страницы.
Основы HTML. Урок 10. О гиперссылках подробнее.
Основы HTML. Урок 11. Работаем с таблицами.

Полные версии уроков (с картинками) можно найти по адресам
Урок 9. Посылаем e-mail с WEB-страницы.
Урок 10. О гиперссылках подробнее.
Урок 11. Работаем с таблицами.

HTML. Урок 9. Посылаем e-mail с WEB-страницы

На этом уроке мы с вами посмотрим, как разместить на WEB-страничке ссылку в виде e-mail'а. При щелчке посетителем на такой ссылке у него автоматически запустится установленный по умолчанию почтовый клиент, причем нужный e-mail адрес будет уже вставлен в соответствующее поле. Кроме того мы посмотрим, как автоматически вставлять разные другие поля для e-mail'а (subject, заготовку для письма и т. д.).

Ссылка в виде E-mail'а на страничке добавляется так:

<a href="mailto:alexeev@nm.ru">Написать письмо автору</a>

А выглядеть на WEB-страничке она будет так:

Написать письмо автору

Синтаксис такой ссылки достаточно прозрачен - в кавычках пишем mailto:, после которого в этих же кавычках пишем e-mail адрес. Между тегами же <a ...> и </a> как и положено для гиперссылки пишем то, что поселитель WEB-странички должен увидеть ("Написать письмо автору" в данном случае).

Теперь посмотрим на более хитрые e-mail ссылки. Например, вам хочется узнать, с какой страницы вашего сайта отправлено письмо. Для этого что-нибудь добавим в почтовый клиент в поле subject:

<a href="mailto:alexeev@nm.ru?subject=New author">Написать письмо автору</a>

Внешне наша ссылка ни как не изменится, но теперь при щелчке на ней у почтовой программы заполнится и поле subject.

А вот примеры заполнения и других полей.

Вставляем заготовку (стандартное обращение) в текст письма:

<a href="mailto:alexeev@nm.ru?subject=New author
&body=Добрый день, Игорь!">Написать письмо автору</a>

Вставляем заготовку посылки копии письма (т. е. письмо отправится по двум адресам):

<a href="mailto:alexeev@nm.ru?subject=New author
&cc=osco@progs.biz">Написать письмо автору</a>
Наверх

HTML. Урок 10. О гиперссылках подробнее

В уроке 5 у нас разговор шел о гиперссылках. В этом уроке мы с вами посмотрим еще несколько способов применения ссылок на WEB-странице.

Способ первый. В качестве самой гиперссылки может выступать не только подчеркнутая надпись, но и любой рисунок. Делается это несложно - вместо текста между тегами <a> и </a> надо просто вставить изображение:

<a href="001.shtml"><img src="images/010_01.gif"></a>

Выглядеть эта ссылка в действии будет как и обычная картинка, только при щелчке на ней посетитель перейдет на другую WEB-страницу (001.shtml в данном случае).

Способ второй. Часто вам хочется, чтобы при щелчке на гиперссылке открылось новое окно (типичная ситуация, когда это может понадобится - это гиперссылка, ведущая с вашего сайта на другой сайт - ведь вам же не хочется, что бы посетитель вообще ушел с вашего сайта). Делается это так:

<a href="001.shtml" target="_blank">Ссылка на другую страницу</a>

А вот эта ссылка в действии:

Ссылка на другую страницу

Наверх

HTML. Урок 11. Работаем с таблицами

На этом уроке мы с вами посмотрим, как можно работать с таблицами. Перейдем сразу к коду

<table border="1">
<tr>
    <td>Ячейка 1-1</td>
    <td>Ячейка 1-2</td>
    <td>Ячейка 1-3</td>
</tr>
<tr>
    <td>Ячейка 2-1</td>
    <td>Ячейка 2-2</td>
    <td>Ячейка 2-3</td>
</tr>
</table>

А вот как будет выглядеть результат:

Ячейка 1-1 Ячейка 1-2 Ячейка 1-3
Ячейка 2-1 Ячейка 2-2 Ячейка 2-3

Как видите, ничего особо сложного нет - сначала рисуем таблицу (теги <table> и </table>), затем в нее вставляем строки (теги <tr> и </tr>), которые делим на собственно ячейки таблицы (теги <td> и </td>).

Теперь давайте посмотрим, как можно объединять ячейки таблицы. Сначала объединение по горизонтали. Например, вот так можно объединить две ячейки в первом ряду:

<table border="1">
<tr>
    <td colspan="2">Ячейки 1-1 и 1-2</td>
    <td>Ячейка 1-3</td>
</tr>
<tr>
    <td>Ячейка 2-1</td>
    <td>Ячейка 2-2</td>
    <td>Ячейка 2-3</td>
</tr>
</table>

Объединение достигается за счет параметра colspan тега <td>. Его значение (два в нашем случае) определяет сколько ячеек будет объединено. Разумеется, за счет объединения количество ячеек в первом ряду (т. е. внутри первой пары тегов <tr> и </tr>) количество ячеек меньше на единицу (было три, стало две).

А вот так это все будет выглядеть в браузере:

Ячейки 1-1 и 1-2 Ячейка 1-3
Ячейка 2-1 Ячейка 2-2 Ячейка 2-3

Теперь объединение по вертикали. Это делаем вот так:

<table border="1">
<tr>
    <td rowspan="2">Ячейки 1-1 и 2-1</td>
    <td>Ячейка 1-2</td>
    <td>Ячейка 1-3</td>
</tr>
<tr>
    <td>Ячейка 2-2</td>
    <td>Ячейка 2-3</td>
</tr>
</table>

Здесь все аналогично объединению по горизонтали, только вместо параметра colspan используем параметр rowspan.

А вот и результат:

Ячейки 1-1 и 2-1 Ячейка 1-2 Ячейка 1-3
Ячейка 2-2 Ячейка 2-3

Вот, собственно, с таблицей и все.

Наверх

Copyright Алексеев Игорь, 2002

Copyright сайт progs.biz, 2002


http://subscribe.ru/
E-mail: ask@subscribe.ru
Отписаться
Убрать рекламу

В избранное