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

Учимся программировать на HTML

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Е-коммерция" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Август 2005   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
Автор
Сергей

Статистика

2.157 подписчиков
-16 за неделю
←   Все выпуски   →

Учимся программировать на HTML Выпуск 27


Информационный Канал Subscribe.Ru
.:: Cоздание Web сайта / изучение языков програмирования ::.
Выпуск № 27Подписчиков: 2200 06.08.2005
.:От автора:.
Всем привет! :)
 
Рассылка снова возвращается. Спасибо всем тем кто не отписался. Рассылка не выходила 1 месяц и 1 неделю, я был в отпуске и не мог готовить выпуски. Спасибо всем кто не забывал и продолжал писать мне, на Ваши письма я отвечу в ближайшее время.
 
Вопрос от Lio Mizar: Как переоформить рассылку на новый адрес?
Ответ: пройдите по ссылке http://subscribe.ru/catalog/inet.webbuild.724990 , введите свой новый адрес и сможете получать мою рассылку.
 
Вопрос от многих:  Как скачать предыдущие выпуски рассылки?
Ответ: по адресу http://www.twa.nm.ru/arch.html, в данный момент доступны еще не все, но в ближайшее время будут доступны все.
 
Так же начинается апгрейд моего сайта, я уже сменил дизайн нескольких страниц, скоро все будет готово, так что заходите.
 
Не забываем заходить на ФОРУМ, теперь все вопросы принимаю только туда. будем решать наши проблем
 
И еще.
Мы уже с Вами рассмотрели основы HTML, и начали учиться писать свою страничку. К теории мы будем возвращаться теперь только при  необходимости.
В каждом выпуске будет бонус: один скрипт или HTML пример.
 
Теперь можно будет задать вопрос и в On Line, посредством Аськи. Нахождение меня в онлайне индицируется на моем сайте под формой подписки.
 
С уважением!
                            TWA
 
 
---
Рассылка выходит при поддержке сайта www.twa.nm.ru, там же находятся выпуски рассылки которые можно посмотреть и прочитать, так же на сайте имеются готовые шаблоны и скрипты.
---

 

Создаем темы вместе

 

А теперь приступим:

Мы уже научились создавать  страницу, применять фон, и создавать эффекты при входе или выходе со/на страницу.

Пусть фон будет синим, а текст белым. Начало поля страницы будет с координат 0, 0 (отсчет сверху слева, отступы по 0) - topmargin="0" leftmargin="0".

<body text="#000000" bgcolor="#000080" topmargin="0" leftmargin="0">

Вставим таблицу с толщиной стенок рамкой = 0:

<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
 

где cellspacing="0" - интервал ячеек, cellpadding="0" - размерность полей ячеек.

В верхних ячейках таблицы, например, можно сделать меню и вставить ссылки. Вместо кнопки установим рисунки, и присвоим соответствующий адрес:

<tr>
<td align="center" width="154">
<a href="http://www.twa.nm.ru/index.html">
<IMG height=38 alt=Главная src="http://www.twa.nm.ru/menuon_1.png" width=84 border=0></a></td>
<td align="center" width="177">&nbsp;</td>
<td align="center" width="59">&nbsp;</td>
<td align="center" width="112">&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>

Где alt=Главная - подсказка, src="http://www.twa.nm.ru/menuon_1.png" - ваш рисунок, 

<a href="http://www.twa.nm.ru/index.html"> - гиперссылка, при нажатии на рисунок вы переходите по этому адресу.

 

А можно сделать ссылку  виде текста: <a href="http://www.twa.nm.ru/index.html"><font color="#FFFF00"> и вставить в любую ячейку таблицы.

 

А еще можно сделать кнопку, меняющую вид при нажатии:

<img border="0" id="img1" src="http://www.twa.nm.ru//button16.jpg" height="20" width="100" alt="Текст кнопки" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button17.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button16.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button18.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button17.jpg')" fp-style=""fp-btn:" Jewel 1" fp-title="Подсказка для кнопки">

Рисунок меняется за счет 3х прописанных рисунков button16.jpg - button17.jpg - button18.jpg, их вы прописываете по своему усмотрению, но желательно чтобы рисунки были одинаковы по размерам, иначе кнопка будет некрасиво выглядеть.

После всех установок страница будет выглядеть так:

<html>

<head>
<meta http-equiv="Content-Language" content="ru">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Новая страница 2</title>
<meta http-equiv="Page-Enter" content="blendTrans(Duration=1.0)">
<meta http-equiv="Page-Exit" content="blendTrans(Duration=1.0)">
<meta http-equiv="Site-Enter" content="blendTrans(Duration=1.0)">
<meta http-equiv="Site-Exit" content="blendTrans(Duration=1.0)">
<script language="JavaScript">
<!--
function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; }
}

function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}

function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } }
return null;
}
// -->
</script>
</head>

<body text="#000000" bgcolor="#000080" topmargin="0" leftmargin="0" onload="FP_preloadImgs(/*url*/'http://www.twa.nm.ru/button17.jpg', /*url*/'http://www.twa.nm.ru/button18.jpg')">

<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="center" width="154">
<a href="http://www.twa.nm.ru/index.html">
<IMG height=38 alt=Главная src="http://www.twa.nm.ru/menuon_1.png" width=84 border=0></a></td>
<td align="center" width="177">&nbsp;</td>
<td align="center" width="59">&nbsp;</td>
<td align="center" width="112">&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td height="19" width="154">&nbsp;</td>
<td height="19" width="177">&nbsp;</td>
<td height="19" width="59"><a href="http://www.twa.nm.ru">
<img border="0" id="img1" src="http://www.twa.nm.ru//button16.jpg" height="20" width="100" alt="Текст кнопки" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button17.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button16.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button18.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'http://www.twa.nm.ru/button17.jpg')" fp-style=""fp-btn:" Jewel 1" fp-title="Текст кнопки">
<td height="19" width="112">&nbsp;</td>
<td height="19">&nbsp;</td>
</tr>
<tr>
<td width="154"><a href="http://www.twa.nm.ru/index.html"><font color="#FFFF00">
на главную страницу</font></a></td>
<td width="177">&nbsp;</td>
<td width="59">&nbsp;</td>
<td width="112">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td width="154">&nbsp;</td>
<td width="177">&nbsp;</td>
<td width="59">&nbsp;</td>
<td width="112">&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

</body>

</html>
 

Измените адреса ссылок на свои, установите параметры рисунков для своего варианта.

Если есть вопросы, пишите сюда

 

Скрипты и примеры:

Если вы хотите, чтобы на WWW странице около вашего номера Аськи был показатель присутствия в сети, то используйте код:


<img alt="ICQ status" src="http://online.icq.com/scripts/online.dll?icq=UIN&img=N"/>
 

Вместо UIN нужно подставить ваш номер аськи. N - вариант индикатора. Их где-то около 17-ти.
 

<img alt="ICQ status" src="http://online.icq.com/scripts/online.dll?icq=UIN&img=N"/>

Вот пример:

<img alt="ICQ status" src="http://online.icq.com/scripts/online.dll?icq=232767006&img=3"/>

 

Вы так же можете прислать свой пример: сюда

На этом разрешите откланяться. продолжим на следующей неделе.

 

Новые темы для голосования можно посмотреть тут http://twa.hut1.ru/art/index_x.php

Новое голосование: http://twa.hut1.ru/art/index_gol.php?idg=40

Результаты голосований на этой неделе: Можете предложить свою тему для голосования тут >>> тема голосования

 

Новые темы для голосования можно посмотреть тут http://twa.hut1.ru/art/index_x.php

Не забывайте заходить на форум

 
 

вопросы и пожелания присылайте сюда, а интересные примеры сюда

 
При копировании материалов, ссылка на сайт обязательна.
Copyright http://www.twa.nm.ru/ 2004-2005 г. TWA ™         Россия. 		E-mail: Admin
ICQ: 232767006
Subscribe.Ru
Поддержка подписчиков
Другие рассылки этой тематики
Другие рассылки этого автора 		Подписан адрес:
Код этой рассылки: inet.webbuild.724990 		Отписаться
Вспомнить пароль
В избранное