Таблица основных тегов HTML

Воскресенье, 05 Июня 2011 г. 18:08 + в цитатник

Таблица основных тегов HTML

Этот пост в первую очередь для новичков, поэтому начнем с вопроса: что такое HTML?

HTML (Hyper Text Markup Language, язык гипертекстовой разметки) – специальные инструкции браузеру, с помощью которых создаются Web-страницы. Т.е. Web-страницы – это документы в формате HTML, содержащие текст и специальные теги HTML. По большому счету теги HTML необходимы для придания тексту нужного вида), который «понимает» браузер.

Документы HTML хранятся в виде файлов с расширением .htm или .html.

Теги HTML сообщают браузеру информацию о структуре и особенностях форматирования Web-страницы. Каждый тег содержит определенную инструкцию и заключается в угловые скобки <>. Большинство тегов состоят из открывающей и закрывающей частей и воздействуют на текст, заключенный внутри.

А что такое Web-страница? Web-страница представляет из себя простой текстовый документ, содержащий теги, которые в свою очередь являются обычным текстом, заключенным в скобки. Таблица основных тегов HTML

Для создания Web-страницы используют специальные программы, которые называются HTML-редакторы. Наиболее популярные – Macromedia HomeSite, Dreamweaver. Они хороши прежде всего тем, что многие конструкции тегов можно вводить одним щелчком мышки. И результат своего труда виден тут же, в соседнем окошке. Сама я пользуюсь программой Dreamweaver. Но на вкус и цвет… есть Интернет.

Вводная часть закончена, теперь непосредственно знакомимся с тегами.

Таблица основных тегов HTML для новичков

Основные теги
<html></html>	Указывает программе просмотра страниц что это HTML документ.
<head></head>	Определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа и теги для поисковых машин.
<body></body>	Определяет видимую часть документа
Теги оглавления
<title></title>	Помещает название документа в оглавление программы просмотра страниц

Атрибуты тела документа
<body bgcolor=?>	Устанавливает цвет фона документа, используя значение цвета в виде RRGGBB – пример: FF0000 – красный цвет.
<body text=?>	Устанавливает цвет текста документа, используя значение цвета в виде RRGGBB – пример: 000000 – черный цвет.
<body link=?>	Устанавливает цвет гиперссылок, используя значение цвета в виде RRGGBB – пример: 00FF00 – зеленый цвет.
<body vlink=?>	Устанавливает цвет гиперссылок на котох вы уже побывали, используя значение цвета в виде RRGGBB – пример: 333333 – серый цвет.
<body alink=?>	Устанавливает цвет гиперссылок при нажатии.

Теги для форматирования текста
<pre></pre>	Обрамляет предварительно отформатированный текст.
<h1></h1>	Создает САМЫЙ БОЛЬШОЙ заголовок
<h5></h5>	Создает самый маленький заголовок
<b></b>	Создает жирый текст
<i></i>	Создает наклонный текст
<tt></tt>	Создает текст – имитирующий стиль печатной машинки.
<cite></cite>	Используется для цитат, обычно наклонный текст.
<em></em>	Используется для выделения из текста слова (наклонный или жирный текст)
<font size=?></font>	Устанавливает размер текста в пределах от 1 до 7.
<font color=?></font>	Устанавливает цвет текста, используя значение цвета в виде RRGGBB.

Гиперссылки
<a href=»URL»></a>	Создает гиперссылку на другие документы или часть текущего документа.
<a href=»mailto:EMAIL»></a>	Создает гиперссылку вызова почтовой программы для написания письма по указанному адресу.
<a name=»NAME»></a>	Отмечает часть текста как цель для гипперссылок в документе.
<a href=»#NAME»></a>	Создает гиперссылку на часть текущего документа.

Форматирование
<p>	Создает новый параграф
<p align=?>	Выравнивает параграф относительно одной из сторон документа, значения: left, right, justify или center
<br>	Вставляет перевод строки.
<blockquote></blockquote>	Создает отступы с обеих сторон текста.
<dl></dl>	Создает список определений.
<dt>	Определяет каждый из терминов списка
<dd>	Описывает каждое определение
<ol></ol>	Создает нумерованный список
<li>	Определяет каждый элемент списка и присваивает номер
<ul></ul>	Создает ненумерованный список
<li>	Предваряет каждый элемент списка и добавляет кружок или квадратик.
<div align=?>	Важный тег используемый для форматирования больших блоков текста HTML документа, также используется в таблицах стилей

Графические элементы
<img src=»name»>	Добавляет изображение в HTML документ
<img src=»name» align=?>	Выравнивает изображение к одной из сторон документа, принимает значения: left, right, center; bottom, top, middle
<img src=»name» border=?>	Устанавливает толщину рамки вокруг изображения
<hr>	Добавляет в HTML документ горизонтальную линию.
<hr size=?>	Устанавливает высоту(толщину) линии
<hr width=?>	Устанавливает ширину линии, можно указать ширину в пикселах или процентах.
<hr noshade>	Создает линию без тени.
<hr color=?>	Задает линии определенный цвет. Значение RRGGBB.

Таблицы
<table></table>	Создает таблицу.
<tr></tr>	Определяет строку в таблице.
<td></td>	Определяет отдельную ячейку в таблице.
<th></th>	Определяет заголовок таблицы (нормальная ячейка с отцентрованным жирным текстом)
Атрибуты таблицы
<table border=#>	Задает толщину рамки таблицы.
<table cellspacing=#>	Задает расстояние между ячейками таблицы.
<table cellpadding=#>	Задает расстояние между содержимым ячейки и ее рамкой.
<table width=#>	Устанавливает ширину таблицы в пикселах или процентах от ширины документа.
<tr align=?> или <td align=?>	Устанавливает выравнивание ячеек в таблице, принимает значения: left, center, или right.
<tr valign=?> или <td valign=?>	Устанавливает вертикальное выравнивание для ячеек таблицы, принимает значения : top, middle, или bottom.
<td colspan=#>	Указывает кол-во столбцев которое объединено в одной ячейке. (по умолчанию=1)
<td rowspan=#>	Указывает кол-во строк которое объединено в одной ячейке. (по умолчанию=1)
<td nowrap>	Не позволяет программе просмотра делать перевод строки в ячейке таблицы.

Фреймы
<frameset></frameset>	Предваряет тег <body> в документе, содержащем фреймы;
<frameset rows=»value,value»>	Определяет строки в таблице фреймов, высота которых определена кол-вом пикселов или в процентном соотношении к высоте таблицы фреймов.
<frameset cols=»value,value»>	Определяет столбцы в таблице фреймов, ширина которых определена кол-вом пикселов или в процентном соотношении к ширине таблицы фреймов.
<frame>	Определяет единичный фрейм или область в таблице фреймов.
<noframes></noframes>	Определяет, что будет показано в окне браузера если он не поддерживает фреймы.

Атрибуты фреймов
<frame src=»URL»>	Определяет какой из HTML документов будет показан во фрейме.
<frame name=»name»>	Указывает Имя фрейма или области, что позволяет перенаправлять информацию в этот фреймр или область из других фреймов.
<frame marginwidth=#>	Определяет величину отступов по левому и правому краям фрема; должно быть равно или больше 1.
<frame marginheight=#>	Определяет величину отступов по верхнему и нижнему краям фрейма; должно быть равно или больше 1.
<frame scrolling=VALUE>	Указывает будет-ли выводится линейка прокрутки во фрейме; значение value может быть «yes,» «no,» или «auto». Значение по умолчанию для обычных документов – auto.
<frame noresize>	Препятствует изменению размеров фрейма.

Формы
Для форм, выполняющих какие-то функции должны быть запущены соответствующие CGI скрипты на сервере. HTML только создает внешний интерфейс формы.
<form></form>	Создает формы
<select multiple name=»NAME» size=?></select>	Создает скролируемое меню. Size устанавливает кол-во пунктов меню, которое будет показано на экране, остальные будут доступны при использовании прокрутки.
<option>	Указывает каждый отдельный элемент меню
<select name=»NAME»></select>	Создает ниспадающее меню
<option>	Указывает каждый отдельный элемент меню
<textarea name=»NAME» cols=40 rows=8></textarea>	Создает окно для ввода текста. Columns указывает ширину окна; rows указывает его высоту.
<input type=»checkbox» name=»NAME»>	Создает checkbox. За тегом следует текст.
<input type=»radio» name=»NAME» value=»x»>	Создает radio кнопку. За тегом следует текст.
<input type=text name=»foo» size=20>	Создает строку для ввода текста. Параметром Size указывается длина в символах.
<input type=»submit» value=»NAME»>	Создает кнопку «Принять»
<input type=»image» border=0 name=»NAME» src=»name.gif»>	Создает кнопку «Принять» – для этого используется изображение
<input type=»reset»>	Создает кнопку «Отмена»

Для новичков это пока китайская грамота. Но не отчаивайтесь! В Интернете полно информации по этому вопросу. В качестве бонуса я предлагаю Вам скачать самоучитель HTML и, не слишком перегружая свой мозг, потихоньку изучать его. В домашнем хозяйстве все пригодится!

источник

Рубрики:

Интернет
ЛиРу,дневники,оформление
компьютер,программы

<a href="https://www.liveinternet.ru/users/tulyachka/post169643667/">РўР°Р±Р»РёС†Р° РѕСЃРЅРѕРІРЅС‹С… С‚РµРіРѕРІ HTML</a><br/>
	&nbsp;

РўР°Р±Р»РёС†Р° РѕСЃРЅРѕРІРЅС‹С… С‚РµРіРѕРІ HTML

&nbsp;

РС‚РѕС‚ РїРѕСЃС‚ РІ РїРµСЂРІСѓСЋ РѕС‡РµСЂРµРґСЊ РґР»СЏ РЅРѕРІРёС‡РєРѕРІ, РїРѕСЌС‚РѕРјСѓ РЅР°С‡РЅРµРј СЃ РІРѕРїСЂРѕСЃР°: С‡С‚Рѕ С‚Р°РєРѕРµ HTML?

HTML (Hyper Text Markup Language, СЏР·С‹Рє РіРёРїРµСЂС‚РµРєСЃС‚РѕРІРѕР№ СЂР°Р·РјРµС‚РєРё) &ndash; СЃРїРµС†РёР°Р»СЊРЅС‹Рµ РёРЅСЃС‚СЂСѓРєС†РёРё Р±СЂР°СѓР·РµСЂСѓ, СЃ РїРѕРјРѕС‰СЊСЋ РєРѕС‚РѕСЂС‹С… СЃРѕР·РґР°СЋС‚СЃСЏ Web-СЃС‚СЂР°РЅРёС†С‹. Рў.Рµ. Web-СЃС‚СЂР°РЅРёС†С‹ &ndash; СЌС‚Рѕ РґРѕРєСѓРјРµРЅС‚С‹ РІ С„РѕСЂРјР°С‚Рµ HTML, СЃРѕРґРµСЂР¶Р°С‰РёРµ С‚РµРєСЃС‚ Рё СЃРїРµС†РёР°Р»СЊРЅС‹Рµ С‚РµРіРё HTML. РџРѕ Р±РѕР»СЊС€РѕРјСѓ СЃС‡РµС‚Сѓ С‚РµРіРё HTML РЅРµРѕР±С…РѕРґРёРјС‹ РґР»СЏ РїСЂРёРґР°РЅРёСЏ С‚РµРєСЃС‚Сѓ РЅСѓР¶РЅРѕРіРѕ РІРёРґР°), РєРѕС‚РѕСЂС‹Р№ &laquo;РїРѕРЅРёРјР°РµС‚&raquo; Р±СЂР°СѓР·РµСЂ.

Р”РѕРєСѓРјРµРЅС‚С‹ HTML С…СЂР°РЅСЏС‚СЃСЏ РІ РІРёРґРµ С„Р°Р№Р»РѕРІ СЃ СЂР°СЃС€РёСЂРµРЅРёРµРј .htm РёР»Рё .html.

РўРµРіРё HTML СЃРѕРѕР±С‰... <a href="https://www.liveinternet.ru/users/tulyachka/post169643667/">Р§РёС‚Р°С‚СЊ РґР°Р»РµРµ...</a>

Комментировать

« Пред. запись — К дневнику — След. запись »

Страницы: [1] [Новые]