.jpg)
Эта статья написана для тех, кто не имеет понятия что такое HTML, опытным людям просьба не читать(только зря потратите время 
HTML- язык гипертекстовой разметки документов. HTML документы могут быть созданы при помощи любого текстового редактора(например, блокнота) или специализированных HTML-редакторов (например, FrontPage, Netscape Navigator Gold). Для просмотра HTML документов используются всеразличные браузеры (Internet Explorer, Opera и др.) HTML документ состоит из элементов HTML. Элемент HTML представляет собой обычно два тега(открывающего и (чаще всего) закрывающего) Тег: < – начало тега / – символ, который обозначает закрывающий тег > – конец тега Т. е. все, что находится между < и > – это тэг. Текст, не находящийся между такими скобками < > – весь виден при просмотре в браузере. Тег также может содержать атрибуты. Пример: Код: <font color=’#FF0000’>Hi!</font> Здесь <font color=’#FF0000’> – открывающий тег </font> – закрывающий тег color=’#FF0000’ – атрибут color – имя атрибута #FF0000’ – значение атрибута, может быть заключено в двойные или одинарные кавычки, а может быть вообще без кавычек Hi! – содержание элемента атрибута У одного тега может быть несколько атрибутов, при этом все равно, в каком порядке они пишутся, ибо при перемене мест слагаемых сумма не меняется. Главные теги (должны быть в каждом! документе): <html> и </html> – пишутся всегда : первый – в самом начале документа, второй – в самом конце <head> </head> – голова документа. Общее описание документа. Внутри указывается заголовок, цвета фона, текста, ссылок. <body> </body> – тело документа, то есть то, что отображается в окне браузера Цвета Каждому цвету присвоена определенная комбинация цифр и/или букв (Не стоит забывать о том, что на разных компьютерах один и тот же цвет может выглядеть немного по-разному). Таблицу цветов можно посмотреть тут. Для задания цвета текста всего документа нужно в теге <body> написать: <body text=”цвет”> Чтобы какую-нибудь фразу выделить цветом, отличным от заданного в <body> ее надо заключить в теги: <font color=”цвет”>фраза</font> Цвет фона устанавливается в том же тэге <body>: <body bgcolor=”цвет”> Чтобы использовать рисунок, имеющийся в той же папке, что и сам сайт, как фон, в теге <body> надо указать: Код: <body bgcolor=”цвет_фона” background=”ваш_фон. jpg”> Параметр background можно использовать без bgcolor, но этого делать не стоит (вдруг фон у кого-нибудь не загрузится, а цвет текста будет сливаться с цветом фона, установленного по умолчанию) Следует также всегда прописывать цвет ссылок в теге <body>: Код: <body link=”#339999″ alink=”#339999″ vlink=”#339999″> link – цвет ссылки, alink – цвет ссылки при наведении на нее мышки, vlink – цвет уже посещенной ссылки. Пример: Код: <body bgcolor=”00000″ background=”bg. jpg text=”#808080″ link=”#0000FF” alink=”#000080″ vlink=”#008080″> Заголовки: Чтобы дать HTML-документу название, которое будет выведено в заголовок окна браузера, нужно его писать между тегами <title> </title> Заголовки в самом документе удобно писать с помощью тегов <H2></H2> При этом текст выделяется жирным шрифтом и происходит перенос строки после текста. Цифра определяет величину текста: 1 – самый большой, 6 – самый маленький. Например:
| Код: |
| <html> <head> <title>Sexy Babe</title> </head> <body bgcolor=’00000′ text=” #333366″ > <h1>Hot Girl</h1> </body> </html> |
Таблицы: Таблица задается тэгами: <table></table> <tr></tr> – строчка таблицы <td></td> – столбец (ячейка) таблицы Если Вам надо создать таблицу, например, 3×2, то это запишется так:
| Код: |
| <table> <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> |
Атрибуты таблицы: Фон таблицы задается параметром bgcolor=”цвет_фона”. Фон можно задать для таблицы в целом(прописывая его в теге <table>), для ряда(в теге <tr>), для столбца в пределе одного ряда (в теге <td>). Ширина таблицы задается также в теге <table> или тегах <tr> и <td>(можно в пикселях, можно в процентах от ширины окна браузера). Например (ширина указана в процентах, высота в пикселях):
| Код: |
| <table bgcolor=”#336699″ height=”90%” width=”700″> <tr><td> </td></tr> </table> |
Ширина границ (расстояние в пикселях между рамкой и содержимым ячейки) задается параметром cellspacing (когда он равен нулю, граница отсутствует, по умолчанию этот атрибут равен 2), рамка вокруг таблицы прописывается параметром border, ее цвет – bordercolor, например:
| Код: |
| <table border=”3″ cellspacing=”5″ bordercolor=”#000000″> |
В каждой ячейке (столбце) могут находится и картинки, и текст, и даже таблицы. И тэги, которые мы применяются для форматирования текста – те же, что и для текста вне таблицы. Параграфы: <p></p> параграфы С их помощью можно – центрировать текст: <p align=”center”>текст</p> – выровнять текст по левому краю: <p align=”left”>текст</p> (это значение устанавливается по умолчанию, т. е. когда атрибут не указан) – по правому краю документа: <p align=”right”>текст</p> – выровнять текст по обоим краям документа (может не работать в старых версиях браузеров, поэтому лучше не использовать) – < p align=”justify”>текст</p> Браузер сам автоматически определяет места для переноса строки. Для принудительного переноса используется тег <br>. У него нет атрибутов и закрывающего тега. При использовании этого тега после текста автоматически будет произведен перенос строки. Если вы не хотите, чтобы браузер автоматически переносил строку, то вы можете обозначить ее тэгами <NOBR> и </NOBR>. В этом случае браузер не будет переносить строку даже если она выходит за границы экрана; вместо этого браузер позволит горизонтально прокручивать окно (помните, что в нашем деле это нежелательно). Форматирование текста: <b> Полужирный текст </b> <i> Наклонный текст (курсив) </i> <u> Подчеркнутый текст </u> <center>центрирование текста</center> Тег <font> позволяет изменить параметры шрифта для блока текста (они могут отличаться от заданных в теге <body>) Размер шрифта можно задавать так: <font size=”4″>текст</font> Здесь 7 – самый большой, 1 – самый маленький Задание шрифта: <font face=”ARIAL”> текст (шрифт Arial)</font> Следует задавать только стандартные шрифты, чтобы не получилось так, что прописанный Вами шрифт отсутствует у посетителя вашего сайта))) Например:
| Код: |
| <p align=”center”><font face=”ARIAL” size=”5″><b><u>Give me your many</u></b></font></p> <font face=”Times New Roman” size=”7″ color=’#FF0000’>NOW!</font> |
Вставка картинок:
| Код: |
| <img src=” image. jpg”> |
В кавычках пишется название файла рисунка и его расширение. Если картинка находится не в том же каталоге (папке), что и сам документ, то надо прописывать полный (абсолютный) путь к рисунку, например:
| Код: |
| <img src=” http://www. site. com/papka/image. jpg”> |
В теге <img> можно сделать так, чтобы картинка была прижата к левому(правому) краю экрана, а написанный радом текст обтекал ее справа(слева/внизу/посередине/вверху):
| Код: |
| <img src=” image. jpg ” align=”left”> <img src=” image. jpg ” align=” right”> <img src=” image. jpg ” align=”bottom”> <img src=” image. jpg ” align=”middle”> <img src=” image. jpg ” align=”top”> |
Так же можно задать: – расстояние между текстом и рисунком по вертикали/ по горизонтали (Расстояние задается в пикселях) :
| Код: |
| <img src=” image. jpg ” Vspace=”10″> <img src=” image. jpg ” Hspace=”30″> |
- ширину и выcоту картинки (в пикселях):
| Код: |
| <img src=” image. jpg ” width=”100″> <img src=” image. jpg ” height=”200″> |
- рамку вокруг самой картинки ( цифра – ширина рамки в пикселях):
| Код: |
| <img src=” image. jpg ” border=”5″> |
Очень полезный в нашей работе параметр alt – краткое описание картинки. Оно появится, если навести курсором мыши на рисунок, и подержать его (курсор) несколько секунд. Рекомендую всегда! использовать его для всех! баннеров и картинок:
| Код: |
| <img src=” image. jpg ” alt=”sexy_babe”> |
В нашем деле никак не обойтись без ссылок. Ссылки будут открываться в том же окне. Их можно делать как на другие сайты, так и на картинки, видео и т. п.
| Код: |
| <a href=”Gallery. html? quot;>галерея1</a> |
Слово «галерея1» стала ссылкой на страницу «Gallery. html» Если «Gallery. html» находится не в том же каталоге (папке), что и сам документ, содержащий ссылку на него, то надо прописывать абсолютный путь к файлу, например:
| Код: |
| http://www. site. com/galleries/ Gallery. html |
Если Вы хотите сделать ссылку на другой сайт картинкой:
| Код: |
| <a href=”Gallery. html? quot;> <img src=”babe1.jpg” alt=”sexy_babe”> </a> |
babe1.jpg – картинка, которая является ссылкой на Gallery. html Или:
| Код: |
| <a href=”Gallery. html? quot;> <img src=” http://www. site. com/hot-babe/babe1.jpg” alt=”sexy babe”> </a> |
З. Ы. Следует оптимизировать ваши сайты под расширение 800×600 Полезные комбинации клавиш: F5 –обновить содержание браузера Ctrl+S – сохранить изменения в html документе Ctrl+c – копировать текст Ctrl+v – вставить текст Ctrl+x – удалить текст
| Автор: Annita | обсудить на форуме другие статьи |