Министерство Образования, Культуры и Исследований

Технический Университет Молдовы Департамент Программной

Инженерии и Автоматики

ОТЧЕТ
Лабораторная работа №1
По предмету: Tehnologii WEB
Тема: Создание веб-страницы с помощью HTML, CSS и Bootstrap

Выполнил: Студент группы TI-185 Гаина Александра

Проверил: Преподователь Русу Кристиан

Кишинев 2020г.
Цель работы:
Изучение основ HTML, CSS и Bootstrap.
Задания к лабораторной работе:
Имплементировать полученные знания в создании веб-страницы
Краткая теория:
HTML (от англ. Hyper Text Markup Language — «язык гипертекстовой
разметки») — стандартизированный язык разметки документов во
Всемирной паутине. Большинство веб-страниц содержат описание
разметки на языке HTML (или XHTML). Язык HTML интерпретируется
браузерами; полученный в результате интерпретации
форматированный текст отображается на экране монитора компьютера
или мобильного устройства.
CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) —
формальный язык описания внешнего вида документа, написанного с
использованием языка разметки.
Преимущественно используется как средство описания, оформления
внешнего вида веб-страниц, написанных с помощью языков разметки
HTML .
Bootstrap (фреймворк) (также известен как Twitter Bootstrap) —
свободный набор инструментов для создания сайтов и веб-приложений.
Включает в себя HTML- и CSS-шаблоны оформления для типографики,
веб-форм, кнопок, меток, блоков навигации и прочих компонентов веб-
интерфейса, включая JavaScript-расширения.
Bootstrap использует современные наработки в области CSS и HTML,
поэтому необходимо быть внимательным при поддержке старых
браузеров .
Выполнение задания:
Теги, используемые мною:
1) <!DOCTYPE>-объявляет тип документа и предоставляет основную
информацию для браузера — его язык и версия.

Рис.1-Применение тега <!DOCTYPE>

2)Div (англ. division — раздел) — блочный тег в языке разметки html.

Позволяет выделить в структуре документа несколько разделов.

Рис.2-Пример работы тега <div>.

3) <form>- устанавливает форму на веб-странице. Форма предназначена
для обмена данными между пользователем и сервером .

Рис.3-Пример работы тега <form>.

4) <nav> -задает навигацию по сайту. Если на странице несколько блоков
ссылок, то в <nav> обычно помещают приоритетные ссылки. Также
допустимо использовать несколько тегов <nav> в документе.

Рис.4-Пример работы тега <nav>

5)<button>- создает на веб-странице кнопки и по своему действию
напоминает результат, получаемый с помощью тега <input>.

Рис.5-Пример работы тега <button>.

Тег <a> является одним из важных элементов HTML и предназначен для
создания ссылок. В зависимости от присутствия атрибутов name или href
тег <a> устанавливает ссылку или якорь.
HTML предлагает шесть заголовков разного уровня, которые показывают
относительную важность секции, расположенной после заголовка. Так, тег
<h1> представляет собой наиболее важный заголовок первого уровня, а
тег <h6> служит для обозначения заголовка шестого уровня и является
наименее значительным.
Тег <ul> устанавливает маркированный список. Каждый элемент списка
должен начинаться с тега <li>. Если к тегу <ul> применяется таблица
стилей, то элементы <li> наследуют эти свойства.
Тег <img> предназначен для отображения на веб-странице изображений в
графическом формате GIF, JPEG или PNG. Адрес файла с картинкой
задаётся через атрибут src.
HTML тег link определяет связь между текущим документом и внешним
ресурсом, чаще всего он используется для подключения внешних таблиц
стилей.
Тег <p> является блочным элементом, всегда начинается с новой строки,
абзацы текста идущие друг за другом разделяются между собой отбивкой.
 Результат:

Вывод: В данной лабораторной работе, мы изучили основы работы html,css.

Так же я использовала bootstrap для адаптивности сайта и облегчения верстки. В
завершении работы мы получили готовый сайт.

Список используемой литературы:

1. HTML, CSS [Электронный ресурс] - htmlbook.ru/html
2. Bootstrap (фреймворк) — Википедия [Электронный ресурс] - ru.wikipedia.org

Приложение А
https://github.com/sasha442/website-1