HTML for beginners by Alina N - Ourboox.com
This free e-book was created with
Ourboox.com

Create your own amazing e-book!
It's simple and free.

Start now

HTML for beginners

  • Joined Dec 2019
  • Published Books 1

Содержание

  • Что такое HTML, основные понятия
  • Теги
  • Таблицы
  • Фрэймы
  • Атрибуты
  • Музыка в HTML
  • Вставка произвольных объектов
2

HTML (HyperText Markup Language) – язык разметки гипертекста – предназначен для создания Web-страниц.
Под гипертекстом в этом случае понимается текст, связанный с другими текстами указателями-ссылками.

HTML представляет собой достаточно простой набор кодов, которые описывают структуру документа. HTML позволяет выделить в тексте отдельные логические части (заголовки, абзацы, списки и т.д.), поместить на Web-страницу подготовленную фотографию или картинку, организовать на странице ссылки для связи с другими документами.

HTML не задает конкретные и точные атрибуты форматирования документа. Конкретный вид документа окончательно определяет только программа-броузер на компьютере пользователя Интернета.

3

 

 

 

4

HTML также не является языком программирования, но web-страницы могут включать в себя встроенные программы-скрипты на языках Javascript и Visual Basic Script и программы-апплеты на языке Java.

Даже, если вы не собираетесь в дальнейшем редактировать “вручную” текст HTML (предполагая использовать графические редакторы), знание языка HTML даст вам возможность как лучше использовать эти средства, так и увеличит ваши шансы сделать HTML-документ более доступным и “читаемым” при просмотре броузерами разных фирм.

Основными компонентами HTML являются:

  • Тег (tag). Тег HTML это компонент, который командует Web- броузеру выполнить определенную задачу типа создания абзаца или вставки изображения.
  • Атрибут (или аргумент). Атрибут HTML изменяет тег. Например, можно выровнять абзац или изображение внутри тега.
  • Значение. Значения присваиваются атрибутам и определяют вносимые изменения. Например, если для тега используется атрибут выравнивания, то можно указать значение этого атрибута. Значения могут быть текстовыми, типа left или right, а также числовыми, как например ширина и высота изображения, где значения определяют размер изображения в пикселях.

Теги представляют собой зарезервированные последовательности символов, начинающиеся с < (знака меньше) и заканчивающиеся > (знаком больше).
Закрытие тега отличается от открытия только наличием символа ‘/’.

Предположим, у нас есть гипотетический атрибут форматирования текста, управляемый кодом <X>, и мы хотим применить его к словам “Это мой текст”.
HTML-последовательность кодов и собственно текста будет выглядеть так:

   <X>Это мой текст</X>

Теги могут вкладываться друг в друга иерархически, но без пересечений, то есть допустимо вложение вида <teg1><teg2></teg2> </teg1>, но не <teg1><teg2> </teg1></teg2>.
Действие вложенных тeгов объединяется.Например, если внутрь тега, создающего жирное начертание шрифта, вложен тег курсива, то в результате получится жирный курсив.

5

6
HTML for beginners by Alina N - Ourboox.com

8
HTML for beginners by Alina N - Ourboox.com
HTML for beginners by Alina N - Ourboox.com

11
HTML for beginners by Alina N - Ourboox.com
HTML for beginners by Alina N - Ourboox.com

14

15

Формы дают возможность пользователям вводить информацию. Вам наверно, не раз встречались всевозможные тесты, опросы, голосования. Для того, чтобы все это сделать на своих web-страницах и нужны формы.

Здесь следует заметить, что html-формы сами по себе только позволяют вводить информацию, а вот обрабатывать ее HTML не умеет (это все-таки язык разметки, а не программирования). Для обработки информации используются такие языки, как javascript, php и другие.

Но всему свое время, пока мы научимся добавлять html-формы на свои страницы, а обрабатывать информацию из них будем учиться в других уроках, посвященных, например, javascript.

Итак, в html форма задается тегами <form></form>. Все остальные элементы формы располагаются между этими тегами.

У тега <form> есть несколько параметров:

  • name – имя формы. Необходимо, если на странице несколько форм
  • action – определяет URL-адрес, по которому будет отправлена информация введеная пользователем
  • method – определяет способ отправки информации
  • target – указывает имя окна, в котором будут отображаться результаты обработки отправленной формы
16

Фоновая музыка в html
На web-страницу можно интегрировать фоновую музыку. Когда пользователь будет попадать на эту страницу, будет проигрываться мелодия, конечно, если у пользователя есть колонки или наушники.
Для этого нужен аудифайл в одном из форматов: WAV, AU, MIDI. Для примера можете взять такой файл в папке C:WINDOWSMedia или скачать мелодию с сайта http://midi.bun.ru.
Положите этот файл в тот же каталог, где лежат ваши html-страницы. Теперь в код любой страницы (в теги body)добавьте следующий тег:

<bgsound scr=”Love_Me_Do_Beatles.mid” loop=”1″/><bgsound>

Теперь при просмотре этой страницы всегда будет присутствовать фоновая музыка. Рассмотрим параметры тега <bgsound>:

  • src – адрес звукового файла
  • loop – число повторов мелодии (если равно -1, то повторяется бесконечно)
  • balance – стереобаланс (значения от -10000 до 10000)
  • volume – громкость, максимальное значение = 0 (возможные значения от -10000 до 0)
17

Подключаемые модули позволяют управлять проигрыванием звуковых файлов.

Здесь тоже не все просто. Когда мы встраиваем в html-страницу какой-либо объект, браузер пытается отобразить его самостоятельно. Если это простой объект (текст или рисунок), то браузер это сделает без посторонней помощи. Если объект незнакомый, то браузер попробует прибегнуть к помощи внешней программы или встроенного в браузер программного модуля (плагина), которые и отобразят этот объект. Если же нужного приложения браузер не найдет, то появится сообщение о том, где его можно скачать и как установить (в большинстве случаев, но не всегда).

А по статистике лишь 5% людей станут устанавливать себе дополнительные модули, остальные 95% просто уйдут со страницы.

Для примера всего вышеизложенного создадим html-страницу со следующим кодом:

(Здесь тег <embed> указывает браузеру вставить на web-страницу модуль управления звуковым файлом, а его параметры задают адрес музыкального файла, а также ширину и высоту консоли органов управления.)
18
Здесь тег указывает браузеру вставить на web-страницу модуль управления звуковым файлом, а его параметры задают адрес музыкального файла, а также ширину и высоту консоли органов управления.
HTML for beginners by Alina N - Ourboox.com

Как видите, Opera не отработал так, как ожидалось, т.е. не дала возможность управлять прослушиванием файла.

Стоит ли отказываться от музыки в html? Вряд ли, мультимедиа завоевывает интернет семимильными шагами, поэтому встраивать такие объекты иногда просто необходимо, но делать это лучше с помощью элемента <object>, которому посвящен следующий урок.

Правда, проблему это не решит, пользователю все равно придется устанавливать дополнительные модули, но с развитием мультимедийных технологий и пользователи становятся другими и уже у многих стоят различные проигрыватели тех или иных файлов. И будем надеяться, что в скором времени установка маленького плагина перестанет быть преградой.

21
HTML for beginners by Alina N - Ourboox.com
HTML for beginners by Alina N - Ourboox.com
HTML for beginners by Alina N - Ourboox.com
This free e-book was created with
Ourboox.com

Create your own amazing e-book!
It's simple and free.

Start now

Ad Remove Ads [X]
Skip to content