Информер апдейтов:

Яндекс выдача 10.07.2017 00:58:47 MSK
Индекс CY (ТИЦ) 19.05.2017 11:00:02 MSK
Яндекс.Каталог 20.07.2017 00:00:01 MSK
ПФ в Яндексе 26.11.2014 10:27:01 MSK

Вход в систему

Дополнительно

Ювелирные магазины Москвы
Главная | Создание сайтов

Что такое HTML? Основные элементы разметки гипертекста и составляющие их теги языка HTML


HTML (HyperText Markup Language) - язык гипертекстовой разметки.
Знание языка необходимо при написании статей блога.

Ниже приведены основные элементы и теги языка разметки гипертекста (HTML), а так же примеры создания HTML-документов.


Введение:

Элемент - это конструкция содержащая данные заключенные в теги языка HTML.

<title> - открывающий тег

</title> - закрывающий тег

Для некоторых элементов закрывающий тег не обязателен, а некоторые вообще не имеют закрывающего тега.

<title>Название сайта</title> - это Элемент добавляющий название сайта на страницу

Теги могут содержать параметры (атрибуты) они прописываются в открывающем теге и могут определять цвет текста или фона, размер шрифта и другие параметры выводимые на странице.


Список тегов для основных элементов:

<html>Содержимое документа</html> - Указывает приложению для просмотра страниц что это HTML документ.

<head>Шапка сайта</head> - в шапке размещается различная информация не размещаемая в тексте документа. Такая как название сайта, ключевики и др. информация для поисковых машин.

<title>Название документа</title> - Размещает название документа в оглавлении приложения для просмотра страниц

<meta name="description" content="Краткое описание сайта">
В мета-тег “description” рекомендуется уложить 150 – 200 знаков (20-30 слов.)

<meta name="keywords" content="Ключевые, слова, через, запятую">
В мета–тег Keywords следует внести порядка 10 слов. Эти слова или фразы должны быть в вашем тексте, размещенном на странице.

<body>Тело документа</body> - Определяет видимую часть документа


Атрибуты используемые с тегами в теле документа:

<br clear="all" /> - Делает перевод строки , с уточнением что бы было точно после возможных плавающих блоков (картинок).

<body bgcolor=?> - Задает цвет фона документа. Используется значение цвета в виде RRGGBB

<body text=?> - Задает цвет текста документа. Используется значение цвета в виде RRGGBB

<body link=?> - Задает цвет гиперссылок. Используется значение цвета в виде RRGGBB

<body vlink=?> - Задает цвет гиперссылок на которых вы уже побывали. Используется значение цвета в виде RRGGBB

<body alink=?> - Задает цвет гиперссылок при наведении на них. Используется значение цвета в виде RRGGBB

rel="nofollow" - Атрибут рекомендующий посковикам не учитывать исходящую ссылку при подсчете выдачи пузомерок

<noindex></noindex> - Эти теги распознает только яндекс. Они рекомендуют яндексботу не индексировать заключенный в теги текст при индексации сайта и не учитывать заключенные в них исходящие ссылки при выдаче ТиЦ.


Теги используемые при форматировании текста документа:

<center>Текст</center> - Отображение по центру

<cite>Цитата</cite> - Цитата

<h1>Заголовок</h1> - Создает самый большой заголовок

<h6>Заголовок</h6> - Создает самый маленький заголовок

<b>Жирный</b> - Создает жирый текст

<i>Наклонный</i> - Создает наклонный текст

<tt>Печатный</tt> -Создает текст имитирующий стиль печатной машинки. Используется для цитат, обычно наклонный текст.

<em>Курсив</em> - Выделение из текста слова (наклонный или жирный текст)

<strong>Выделенный</strong> - Используется для выделения наиболее выжных частей текста (наклонный или жирный текст)

<font size=?>Текст</font> - Устанавливает размер текста в пределах от 1 до 7.

<font color=?>Текст</font> - Устанавливает цвет текста, используя значение цвета в виде RRGGBB.

<code>Исходный код</code> - Для отображения исходных текстов программ.

<ul> <li>Первый элемент</li> <li>Второй элемент</li> </ul> - Ненумерованный список. Используйте <li> для начала каждого элемента списка.

<ol> <li>Первый элемент</li> <li>Второй элемент</li> </ol> - Нумерованный список. Используйте <li> для начала каждого элемента списка.

<dl> <dt>Первый термин</dt> <dd>Первое определение</dd> <dt>Второй термин</dt> <dd>Второе определение</dd> </dl> - Списки определений похожи на другие списки HTML. <dl> начинает список определений, <dt> начинает определяемый термин и <dd> начинает описание определения.

<span style="background-color: rgb(0, 255, 0);">Текст</span> - Подсвечивание текста, используя значение цвета в виде RGB


Специальные знаки при вводе которых могут возникнуть проблемы:

&amp; - Выводит знак ампенсанд &

&lt; - Выводит знак меньше чем <

&gt; - Выводит знак больше чем >

&quot; - Выводит знак кавычка "


Гиперссылки:

<a href="http://site.ru/" target="_blank" title="Всплывающая подсказка!">Название ссылки (анкор)</a> - Пример гиперссылки со всплывающей подсказкой и анкором, (откроется в новой вкладке)

<a href="http://site.ru/images.jpg" target="_blank"><img src="http://site.ru/images.jpg" border="0" alt="Описание изображения" title="Всплывающая подсказка" width="250" height="330" /></a> - Изображение с заданными сторонами (250х330) являющееся гиперссылкой по которой откроется в новой вкладке изображение оригинальной величины.


Вывод окна с неисполняемым кодом:

1 Вариант
<textarea style="width: 200px; height: 100px;">
Не исполняемый код который будет показан в окне
</textarea>
- Размеры окна указаны в пикселях (200х300)

2 Вариант
<textarea name="textarea" cols="20" rows="5">
Не исполняемый код который будет показан в окне
</textarea>
- Размеры окна указаны в количестве знаков (20х5)

Комментарии

Аватар пользователя prewderanshofb

Какой хороший топик

Какой хороший топик!