Лекция "Основы языка HTML"
презентация к уроку
Опубликовано 27.01.2026 - 11:08 - Храмцова Елена Александровна
Предварительный просмотр:
Подписи к слайдам:
Введение в HTML Название HTML- документа</ TITLE> <BODY> Содержимое W е b- страницы</ BODY></p><p class='slide-number'>Слайд 4</p><p>Создание Web -страницы 1 . Создать текстовый документ (программа Блокнот). 2. Выбрать Файл/Сохранить как в строке имя файла ввести: имя_документа.htm и нажимает на кнопку Сохранить.</p><p class='slide-number'>Слайд 5</p><p>Параметры страницы В теге <BОDY> можно задать свои цветовые параметры документа, используя атрибуты: bgcolor =цвет фона tехt =цвет текста vlink =цвет пройденных гипертекстовых ссылок link =цвет гипертекстовой ссылки alink =цвет активной гипертекстовой ссылки Пример: <ВОDY вgcolor =#FFFFFF техт =#0000FF vlink =#FF0000 link =#00FF00></p><p class='slide-number'>Слайд 6</p><p>Абзацы <P>Текст первого абзаца. <P>Текст второго абзаца </ P > Вместе с элементом абзаца можно использовать атрибут выравнивания align : align = left – выравнивание по левому краю; align = right – выравнивание по правому краю; align = center – выравнивание по центру; align = justify – выравнивание по ширине. Обрыв строки <BR></p><p class='slide-number'>Слайд 7</p><p>Заголовки <Н1>Заголовок документа</Н1> <Н2>Заголовок раздела</Н2> <Н3>Заголовок подраздела</Н3> <Н4>Заголовок параграфа</Н4> <Н5>Комментарий</Н5> <Н 6 >Авторские пометки</Н 6 ></p><p class='slide-number'>Слайд 9</p><p>Теги вставки гиперссылок</p></div></div></div></div></div><br><div class="block marina-gradient-rounded-corners marina-title-rounded-green"><div class="inner clearfix"><div class="inner-wrapper"><div class="inner-inner"><h2 class="title block-title">По теме: методические разработки, презентации и конспекты</h2><div class="others"><img class="lazyload" data-src="/sites/default/files/pictures/2015/04/13/picture-69967-1428946554.jpg"><h6><a href="/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2012/04/12/kontrolnaya-rabota-po-teme-yazyk">Контрольная работа по теме: Язык разметки гипертекста HTML </a></h6><p class="search-excerpt">Добавить списки на WEB-странички, созданные на прошлом уроке:1. Создать одну WEB-страничку index.html, на которой должны быть ги...</p></div><div class="others"><h6><a href="/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2015/09/23/uchebno-metodicheskoe-posobie">Учебно-методическое пособие КОНТРОЛЬ ЗНАНИЙ В ФОРМЕ ТЕСТИРОВАНИЯ ПО ТЕМЕ «ЯЗЫК HTML» по дисциплине: «ОСНОВЫ WEB- ТЕХНОЛОГИЙ»</a></h6><p class="search-excerpt">Данное учебно-методическое пособие составлено с учётом действующей программы по дисциплине «Основы Web-технологий» для специальности «Компьютерные сети» и соответствует государственным требованиям к м...</p></div><div class="others"><h6><a href="/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2015/10/01/uchebno-metodicheskoe-posobie">УЧЕБНО - МЕТОДИЧЕСКОЕ ПОСОБИЕ Гипертекстовые технологии. Язык HTML. </a></h6><p class="search-excerpt">Данная методическая разработка выполнена для самостоятельного изучения темы «Гипертекстовые технологии. Язык HTML» дисциплины «Программирование HTML» студентами и преподавателями. В ней содержится тео...</p></div><div class="others"><img class="lazyload" data-src="/sites/default/files/pictures/2017/04/19/picture-918061-1492602186.jpg"><h6><a href="/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2017/04/19/tema-osnovy-yazyka-html">Тема: "Основы языка HTML"</a></h6><p class="search-excerpt">Урок по информатике. Тема: "Основы языка HTML"....</p></div><div class="others"><h6><a href="/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2020/09/30/yazyk-razmetki-giperteksta-html">ЯЗЫК РАЗМЕТКИ ГИПЕРТЕКСТА HTML. РЕДАКТОРЫ ДЛЯ HTML</a></h6><p class="search-excerpt">Одним из самых больших достижений человечества, без преувеличения, можно назвать службу WORLD WIDE WEB...</p></div><div class="others"><img class="lazyload" data-src="/sites/default/files/pictures/2017/01/18/picture-879509-1484729420.jpg"><h6><a href="/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2022/01/31/test-po-osnovam-yazyka-html">Тест по основам языка HTML</a></h6><p class="search-excerpt">Тест по основам языка HTML...</p></div><div class="others"><img class="lazyload" data-src="/sites/default/files/pictures/2023/11/23/picture-1497595-1700772206.jpg"><h6><a href="/npo-spo/obrazovanie-i-pedagogika/library/2023/11/24/yazyk-razmetki-giperteksta-html-redaktory-dlya">ЯЗЫК РАЗМЕТКИ ГИПЕРТЕКСТА HTML. РЕДАКТОРЫ ДЛЯ HTML</a></h6><p class="search-excerpt">Одним из самых больших достижений человечества, без преувеличения, можно назвать службу WORLD WIDE WEB (WWW) - это Всемирная паутина, объединяющая миллионы серверов по всему миру. WWW- все сайты...</p></div></div></div></div></div><br><div id="poisk-materialov" data-1="All"></div>
<ul class="links inline"><li class="flag-like first last"><span><span class='like-tooltip flag-like'><a href='#'>Мне нравится</a><span class='flag-throbber'> </span></span></span></li>
</ul> <div class="share_buttons clearfix">Поделиться:<div class="ya-share2" data-services="vkontakte,odnoklassniki,telegram,moimir" data-url="https://nsportal.ru/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2026/01/27/lektsiya-osnovy-yazyka-html" data-title="лекция "основы языка html"" data-image="https://nsportal.ru/sites/default/files/pictures/2026/01/27/picture-1317568-1769500881.jpg"></div></div>
<div class="add-new-comment-button my-button-large"></div>
</div>
</div>
</div>
</div>
</div>
</div> </div><!-- /content-inner -->
</div><!-- /content -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="user_relationships_popup_form" class="user_relationships_ui_popup_form"></div><script src="/sites/default/files/advagg_js/js__S3bm1c7u9YzJnRE6QrV-HsLzADKLeupchfbrYg22kRU__S91yqV9ubUDMxzCK2GLBYdp1SFL3v48MFVTVZ3OSXjc__xK8RrS6Elbeb-uFsk6sQnqBT0LQWi9ruFM_5ORYTRxs.js" defer="defer"></script>
<script src="/sites/default/files/advagg_js/js__hxOxF7aEdhvlSyCfiIODtjKmufwiFkLnYBgfAc3JU2U__Zvl8DJBWOfPQpMnqpLsqpzRLZD7C0PqUDMlY8RRkYVw__xK8RrS6Elbeb-uFsk6sQnqBT0LQWi9ruFM_5ORYTRxs.js" defer="defer"></script>
<script src="/sites/default/files/advagg_js/js__c1zZbhXAByh0V-pY3W2l6b4e6e6URcR4okOH_epIox4__oVrjkf1Udl7K9Xgwtl5J3lSmv-cR7ynKeNmPgrmULSU__xK8RrS6Elbeb-uFsk6sQnqBT0LQWi9ruFM_5ORYTRxs.js" defer="defer"></script>
<script defer src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.min.js" integrity="sha384-cn7l7gDp0eyniUwwAZgrzD06kc/tftFf19TOAs2zVinnD/C7E91j9yyk5//jjpt/" crossorigin="anonymous"></script>
</body>
</html>
<!-- Page cached by Boost @ 2026-02-07 21:39:26, expires @ 2026-05-30 21:39:26, lifetime 3 месяца 3 недели -->
<!-- cache/normal/nsportal.ru/npo-spo/informatika-i-vychislitelnaya-tekhnika/library/2026/01/27/lektsiya-osnovy-yazyka-html_ -->
Основные понятия Язык HTML представляет собой довольно простой набор команд, описывающий структуру документа и позволяет выделить в документе отдельные. Файлы с текстом кода на языке HTML имеют расширение . html или . htm . Имя конечного тега идентично имени начального, но перед именем конечного тега ставится косая черта (/) (например, для тега заголовка <ТIТLЕ> закрывающей парой будет ). Атрибуты прописываются в начальных тегах. Конечные теги никогда не содержат атрибутов. Теги определяют область действия правил интерпретации текстовых документов. <" имя тега" "список атрибутов"> содержимое контейнера <"/ имя тега">
Структура Web -страницы Содержимое web- страницы
Заголовок W е b- страницы