Сайт о телевидении

Здравствуйте, уважаемые читатели блога. С этой статьи мы начнем изучать основы языка HTML.

Вам скорей всего уже известно, что основным языком Internet-а является язык гипертекстовой разметки HTML (HyperText Markup Language) . В этой статье мы узнаем базовые понятия HTML и научимся создавать простейшие WEB-страницы.

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

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

Браузер — это специальная программа, предназначенная для просмотра веб-сайтов, например Internet Explorer. При помощи браузера вы бродите по сайтам, щелкая по ссылкам. Любой такой щелчок заставляет браузер сделать запрос на html-страницу web-серверу, получить ответ и отобразить страницу в своем окне. Именно при отображении страницы начинает работать язык HTML, он сообщает браузеру все о структуре и содержимом web-страницы. С помощью команд — тегов , HTML указывает браузеру, где начинаются абзацы текста, какая часть текста является заголовком и указывает куда вставлять таблицы, и даже картинки. А теги это слова в угловых скобках, например

, ,

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

Первая версия языка HTML появилась еще в 1992 году. На момент 2013 года разрабатывается спецификация новой версии HTML под номером 5. Разработкой данной спецификации занимается организация World Wide Web Consortium, или сокращенно W3C. Организация W3C занимается разработкой и других Web-стандартов. Ознакомится с этими стандартами вы можете на их сайте www.w3.org . Кстати, Многие Web-браузеры уже поддерживают некоторые возможности HTML 5.

Предлагаю начать изучение языка HTML сразу с примера. Поэтому давайте создадим нашу первую Web-страничку. Для создания WEB-страниц подойдет любой текстовый редактор. Я предлагаю для начала воспользоваться встроенным в Windows Блокнотом (Notepad) (вообще в дальнейшем для редактирования html-кода я советую использовать ). Найти его можно: «Пуск->Все программы->Стандартные->Блокнот». Давайте создадим страничку об автомобилях. Итак, откроем Блокнот и наберем в нем текст:

Пример Web-страницы


Сайт об автомобилях.

Добро пожаловать на наш автомобильный сайт. Здесь Вы найдете много интересных и полезных статей об автомобилях. На сайте есть описания многих импортных и отечественных автомобилей.

Далее сохраним созданную web-страницу в файл с именем index.html. При этом в диалоговом окне сохранения файла необходимо задать кодировку UTF-8 и заключить имя файла в кавычки, иначе Блокнот добавит к нему расширение txt, и наш файл получит имя index.htm.txt:

Теперь осталось открыть созданный файл в браузере и посмотреть на результат. Для этого можно воспользоваться поставляемым в составе Windows браузером Microsoft Internet Explorer, либо любым другим установленным на вашем компьютере браузером, щелкнув два раза мышкой по файлу index.html или перетаскиванием файла на значок браузера. Открываем и видим примерно такой результат:

Таким образом, мы создали Web-страницу в Блокноте, хоть и немного невзрачную, но уже содержащую большой заголовок и абзац текста, который автоматически разбивается на строки и содержит фрагмент, выделенный полужирным шрифтом.

Теперь поговорим подробнее о структуре страницы. Рассмотрим фрагмент: Сайт об автомобилях. Здесь мы видим текст, который отображается на странице как заголовок, заключенный в теги и . Что же такое тег в html языке?

Тег HTML - это обычные слова и символы, заключенные в угловые скобки, например ,

, . Так тег является открывающим тегом, тег закрывающим тегом, а текст между ними называется содержимым тега. Также тег и тег называются парными тегами. Вместе открывающий тег плюс содержимое плюс закрывающий тег образуют элемент html-документа. Бывают еще элементы состоящие из одного открывающего тега:

Так парный тег определяет элемент заголовка первого уровня. Всего существует шесть уровней заголовков, это элементы — .

Элементы бывают блочные и строчные (текстовые). Блочные элементы осуществляют структурное форматирование страницы. Блочные элементы всегда отображаются на странице с новой строки и имеют отступ от соседних элементов. Строчные элементы осуществляют непосредственное форматирование текста или логическое форматирование. Элемент является блочным элементом.

На этом у меня все!!! До встречи в следующих постах!

HTML-теги — основа языка HTML. Теги используются для разграничения начала и конца элементов в разметке.

Каждый HTML-документ состоит из дерева HTML-элементов и текста. Каждый HTML-элемент обозначается начальным (открывающим) и конечным (закрывающим) тегом. Открывающий и закрывающий теги содержат имя тега.

Все HTML-элементы делятся на пять типов:

• пустые элементы — , ,
  , , , , , ,
  

	Используется для хранения дополнительной информации о странице. Эту информацию используют браузеры для обработки страницы, а поисковые системы — для ее индексации. В блоке может быть несколько тегов , так как в зависимости от используемых атрибутов они несут разную информацию.
	Индикатор измерения в заданном диапазоне.
	Раздел документа, содержащий навигационные ссылки по сайту.
	Определяет секцию, не поддерживающую сценарий (скрипт).
	Контейнер для встраивания мультимедиа (например, аудио, видео, Java-апплеты, ActiveX, PDF и Flash). Также можно вставить другую веб-страницу в текущий HTML-документ. Для передачи параметров встраиваемого плагина используется тег .
	Упорядоченный нумерованный список. Нумерация может быть числовая или алфавитная.
	Контейнер с заголовком для группы элементов .
	Определяет вариант/опцию для выбора в раскрывающемся списке , или .
	Поле для вывода результата вычисления, рассчитанного с помощью скрипта.
	Параграфы в тексте.
	Определяет параметры для плагинов, встраиваемых с помощью элемента .
	Элемент-контейнер, содержащий один элемент и ноль или несколько элементов . Сам по себе ничего не отображает. Дает возможность браузеру выбирать наиболее подходящее изображение.
	Выводит текст без форматирования, с сохранением пробелов и переносов текста. Может быть использован для отображения компьютерного кода, сообщения электронной почты и т.д.
	Индикатор выполнения задачи любого рода.
	Определяет краткую цитату.
	Контейнер для Восточно-Азиатских символов и их расшифровки.
	Определяет вложенный в него текст как базовый компонент аннотации.
	Добавляет краткую характеристику сверху или снизу от символов, заключенных в элементе , выводится уменьшенным шрифтом.
	Отмечает вложенный в него текст как дополнительную аннотацию.
	Выводит альтернативный текст в случае если браузер не поддерживает элемент .
	Отображает текст, не являющийся актуальным, перечеркнутым.
	Используется для вывода текста, представляющего результат выполнения программного кода или скрипта, а также системные сообщения. Отображается моноширинным шрифтом.
	Используется для определения сценария на стороне клиента (обычно JavaScript). Содержит либо текст скрипта, либо указывает на внешний файл сценария с помощью атрибута src .
	Определяет логическую область (раздел) страницы, обычно с заголовком.
	Элемент управления, позволяющий выбирать значения из предложенного множества. Варианты значений помещаются в .
	Отображает текст шрифтом меньшего размера.
	Указывает местоположение и тип альтернативных медиаресурсов для элементов , , .
	Контейнер для строчных элементов. Можно использовать для форматирования отрывков текста, например, выделения цветом отдельных слов.
	Расставляет акценты в тексте, выделяя полужирным.
	Подключает встраиваемые таблицы стилей.
	Задает подстрочное написание символов, например, индекса элемента в химических формулах.
	Создаёт видимый заголовок для тега . Отображается с закрашенным треугольником, кликнув по которому можно просмотреть подробности заголовка.
	Задает надстрочное написание символов.
Тема урока: Разработка web-сайтов с использованием языка разметки гипертекста HTML. Основные цели обучения: формирование познавательного интереса, развитие интеллектуальных и творческих способностей в области Web-технологий. Задачи. Обучающие: сформировать систему знаний по технологии создания Web-сайтов; обучить языку разметки гипертекста HTML для создания сайтов; познакомить с этапами проектной деятельности. Развивающие: развить творческие способности к самовыражению, посредством создания сайтов; сформировать умение сопоставлять, искать аналог и осуществлять перенос знаний в новую предметную область Web-технологий; развить навыки работы на компьютере Воспитательные: воспитать добросовестное отношение к работе; воспитать чувства товарищества и личной ответственности за созданный сайт; воспитать художественный и эстетический вкус; воспитать грамотного и корректного пользователя сети Интернет. Ход урока 1. Организационный момент. Человеческая доброта - самое удивительное явление в мире. Попробуйте с помощью улыбки передать своё настроение. Я вижу настроение у вас хорошее, деловое, итак, за работу. 2. Актуализация знаний и умений -Ребята, скажите, что мы изучали на прошлых уроках? -Что такое Веб-страница ? (Веб-страница (англ. Web page ) - документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью веб-браузера) - Что представляет собой типичная веб-страница? (Типичная веб-страница представляет собой текстовый файл в формате HTML, который может содержать ссылки на файлы в других форматах - Что такое HTML – документ? (HTML – документ - это файл, содержащий текст и команды форматирования, предназначенный для размещения на web -серверах в сети Интернет. HTML – документ создается с помощью языка гипертекстовой разметки или HTML – кода.) -Что является основным элементом разметки HTML – кода? (основным элементом разметки HTML – кода является ТЭГ.) 3. Выполнение теста: Тест по теме « Язык разметки гипертекста HTML » 1. Каким тегом объявляется web-страница? 4) body body 2. Каким тегом объявляется заголовок web-страницы? 4) body body 3. В какой тег заключается основное содержание web-страницы? 4) body body 4. В какой тег заключается название web-страницы? 4) body body 5. Какой код для пустой web-страницы правильный?   Статьи по теме: Что такое кэшированные данные и кэширование? Удобство использования на высоком уровне Подробная расшифровка некоторых характеристик акустики Как найти потерянный, украденный ноутбук Как снять с флешки защиту от записи Новое: Еще тоньше, ярче и автономнее Как передать музыку по блютузу? История Huawei: Как китайский бренд меняет... Способы загрузки ос с флешки Как сделать на ноутбуке подсветку клавиатуры Создание MIDI мелодии в программе Anvil Studio Популярное: Hover-эффекты для изображений на чистом CSS3... Варианты переноса строк Как перейти на строчку... Надоела стандартная раскладка клавиш? Приложения для Android: обучающие программы для... Power bi отчет с 1с. BI - системы. Критерии для... Почему не работают USB порты на компьютере? optest.ru Copyright © 2024 Тег для создания таблицы. Определяет тело таблицы. Создает ячейку таблицы. Используется для объявления фрагментов HTML-кода, которые могут быть клонированы и вставлены в документ скриптом. Содержимое тега не является его дочерним элементом. Создает большие поля для ввода текста. Определяет нижний колонтитул таблицы. Создает заголовок ячейки таблицы. Определяет заголовок таблицы. Определяет дату/время. Заголовок HTML-документа, отображаемый в верхней части строки заголовка браузера. Также может отображаться в результатах поиска, поэтому это следует принимать во внимание предоставление названия. Создает строку таблицы. Добавляет субтитры для элементов и . Выделяет отрывок текста подчёркиванием, без дополнительного акцента. Создает маркированный список. Выделяет переменные из программ, отображая их курсивом. Добавляет на страницу видео-файлы. Поддерживает 3 видео формата: MP4, WebM, Ogg. Указывает браузеру возможное место разрыва длинной строки.