Знакомство с HTML

Приступаем к следующей теме - знакомству с языками программирования HTML и PHP.
Считается, что  HTML является языком разметки и вряд ли может претендовать на звание полноценного языка программирования. Нас он будет интересовать как инструмент для представления информации на веб-странице и для пересылки на сервер данных о клиенте.

С HTML вы знакомитесь самостоятельно, используя лекции на сервере, пример (ниже), ссылки на источники в сети Интернет (список в конце).
Вы должны знать:

•  Структуру HTML-документа
•  Назначение некоторых тегов (перечислены ниже)
•  Некоторые атрибуты тегов (перечислены ниже)
•  Приемы использования таблиц для размещения материалов на веб-странице
•  Назначение HTML-форм и их атрибутов

 Используя эти знания Вы  должны будете создать  Файл Reshenie_1_№.htm (вместо № - номер Вашей задачи) - описание см. ниже. Номер задачи такой же, как у задачи №2. 

Тексты задач

Файл создать «вручную», в редакторе Блокнот (Html-редакторы не использовать), проверяеть с помощью браузера.

Подробнее:

           Теги

• • <p>...</p> — основной текст 
  •  <hN>...</hN> — заголовок N-ного уровня (N = 1...6) 
  • <a>...</a> — гиперссылка
  • <ol>...</ol> — нумерованный список
  • <ul>...</ul> — маркированный список
  • <li>...</li> — элемент списка
  • <table>...</table> — контейнер таблицы
  • <tr>...</tr> — строка таблицы
  • <td>...</td> — ячейка таблицы
  • <img> — изображение
  • <form>...</form> — форма
  • <i>...</i> — отображение текста курсивом
  • <b>...</b> — отображение текста полужирным шрифтом
  • <br> — принудительный разрыв строки
  • <!-- … --> -комментарии   

  Атрибуты
• 
  

  • •src="адрес" — адрес (URI) источника данных (например картинки или скрипта)
  • •align="left|center|right|justify" — выравнивание, по умолчанию left (по левому краю)
  • •width="число" — ширина элемента в пикс.
  • •height="число" — высота элемента href="адрес" — гиперссылка, адрес (URI) на который будет выполнен переход
  • •size="число" — размер элемента
  • •alt="строка" — альтернативный текст

   

Вы должны будете создать Файл Reshenie_1_№.htm (вместо № - номер Вашей задачи)

Файл должен содержать краткую информацию о Вас (фото или аватар, ФИО, кратко о интересах и др.), текст задачи, html-форму, соответствующую задаче, картинку-иллюстрацию. Всё размещается в таблице вида

Файл создать «вручную», в редакторе Блокнот (Html-редакторы не использовать), проверяется с помощью браузера (помните, что иногда разные браузеры отображают веб-страницы по-разному). 

Пример созданной страницы

HTML-формы

 

•Веб-формы – удобный способ получения информации от посетителей сайта.

Начинающий форму тег <form> содержит два атрибута:

• action содержит адрес URL сценария, который должен быть вызван для обработки формы.
• method указывает браузеру, какой вид HTTP запроса необходимо использовать для отправки формы; (POST или GET)

Главное отличие методов POST и GET заключается в способе передачи информации. В методе GET параметры передаются через адресную строку, т.е. по сути в HTTP-заголовке запроса, в то время как в методе POST параметры передаются через тело HTTP-запроса и никак не отражаются на виде адресной строки.

Нtml-форма, запрашивающая у посетителя Вашей страницы определенную информацию, может включать: Переключатели, Кнопку сброса формы, Выпадающий список, Текстовые поля, Многострочное поле ввода текста, Кнопка отправки формы и другие теги, по желанию.

Например, Html-файл 

Создаст форму:

Источники в сети Интернет:

•   http://htmlweb.ru/html/bhtml.php

•   http://citforum.ru/internet/html/table_exmpl.shtml

•   http://scriptic.narod.ru/html/teg.htm

•   http://www.ru.j-npcs.org/docs/html/lesson14.html