Основные теги HTML
-
Upload
hope-walker -
Category
Documents
-
view
59 -
download
1
description
Transcript of Основные теги HTML
![Page 1: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/1.jpg)
Основные теги HTML
![Page 2: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/2.jpg)
Язык HTML
• HTML не является языком программирования, он предназначен для разметки текстовых документов. HTML состоит из тегов.
• Основным назначением HTML тегов является указание области действия тех или иных правил разметки документов. Большая часть HTML тегов состоит из двух частей: открывающий тег <...> и закрывающий тег </...>.
![Page 3: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/3.jpg)
Структура HTML-документа• <html> • <head> • <meta http-equiv="Content-Type"
content="text/html; charset=Windows-1251">• <title>Моя первая HTML-страница</title> • </head> • <body> <p>Здравствуйте!</p> • </body>• </html>
![Page 4: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/4.jpg)
Теги структуры• <HTML> Этот тег указывает на начало HTML-документа• <HEAD> Этот тег указывает на начало области заголовка Web-страницы. • <TITLE>Структура Web-страницы</title> Элемент для размещения
заголовка Web-страницы. Строка отображается в заголовке окна броузера.
• <META http-equiv="Content-Type" content="text/html; charset=windows-1251"> Этот тег несет служебную информацию и не отображается в экране браузера. В данном случае идет речь о кодировке Web-странички. Вам достаточно лишь каждый раз вставлять этот тег в таком виде на свою страничку. Тогда ваша страничка будет использовать кодировку windows-1251, наиболее распространенную на сегодняшний день.
• </head> Конец области заголовка Web-страницы.• <BODY > Начало собственно содержимого Web-страницы. • </body> Конец содержимого Web-страницы.• </html> Конец HTML-документа.
![Page 5: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/5.jpg)
Форматирование текста• Абзац <P> </p>• Переход на новую строку <br>• Выделение текста полужирным шрифтом <B> </b>• Выделение текста курсивом <I> </i>• Маркированный список <UL><LI> Первый пункт списка;<LI> Второй пункт списка;<LI> Третий пункт списка.</ul>• Нумерованный список <OL><LI> Первый пункт списка;<LI> Второй пункт списка;<LI> Третий пункт списка.</ol>
![Page 6: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/6.jpg)
Рисунки на WEB-страничке • <IMG> - элемент для создания ссылки на графический
файл (image). Он не содержит конечного тега - вся необходимая информация задается при помощи атрибутов. Этот элемент является универсальным: с его помощью можно использовать изображения в гиперссылках, вставлять картинки в таблицы, просто размещать рисунки на Web-странице, решать задачи дизайна и т.д.
Необходимым атрибутом является src - указатель на файл графики:
• src="Ссылка на файл".• Например: <IMG src="bos2.gif> - обычный рисунок
![Page 7: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/7.jpg)
Гиперссылки • <A> </a> - один из самых важных
элементов языка, обеспечивающий создание гиперссылок. Чаще всего используется такой шаблон:
Произвольный текст <A href="адрес ссылки">Текст для щелчка </a>
![Page 8: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/8.jpg)
Таблицы • Таблицы являются очень удобным средством форматирования
данных на Web-станице. Они позволяют решать чисто дизайнерские задачи: выравнивать части страницы друг относительно друга, размещать рядом рисунки и текст, управлять цветовым оформлением.
• При создании таблиц используется принцип вложения: внутри основного элемента таблицы TABLE создается ряд элементов, определяющих строки TR, а внутри этих элементов размещаются элеметы для описания каждой ячейки в с строке TD.
• <TABLE> </table> - внешний элемент талицы. • <TR> </tr> - элемент, задающий строку таблицы. • <TD> </td> - элемент, задающий ячеку таблицы. Например: Таблица из 2 строк, в первой строке - 2 ячейки, во втрой – 3.<TABLE> <TR> <TD> 1.1</td> <TD> 1.2</td> </tr> <TR> <TD>2.1 </td>
<TD>2.2 </td> <TD>2.3 </td> </tr> </table>
![Page 9: Основные теги HTML](https://reader036.fdocuments.net/reader036/viewer/2022062521/568138e4550346895da096ff/html5/thumbnails/9.jpg)
Полезные ссылки
• Учебник по HTML http://infoschool.narod.ru/html/index.htm
• HTML справочник http://html.manual.ru/• Как сделать сайт самому и бесплатно
http://seodon.ru/kak-sdelat-sait/