Html head title компьютер title head body все о компьютере body html: Title компьютер title — создание сайта в блокноте. – Практикум «Создание Web-сайта Компьютер» — PDF Free Download

Содержание

Title компьютер title — создание сайта в блокноте.

Не привычный заголовок для статьи? Речь пойдёт не о компьютерах, речь в статье пойдёт об элементарном HTML-сайте. Рассмотрим то, как с помощью блокнота, встроенного в стандартный пакет программ для Windows, создать простой сайт.

Создание WEB-сайта «Компьютер»

Создадим элементарный сайт на HTML про компьютеры. Пусть это будет WEB-сайт про персональный компьютер, на котором мы хотим рассказать о том, что такое Персональный Компьютер (ПК), создадим соответствующие страницы: главную, страницу о программном обеспечении и о компьютерных терминах. Начнём создавать сайт с самого начала, для этого нажимаем на меню компьютера «Пуск» — «Все программы» — «Стандартные» — «Блокнот», запускаем блокнот и начинаем разбираться с программированием сайта.

Самое первое в создании сайта

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

— это контейнер.

Закрывающий тег от открывающего отличается тем, что перед ним обязательно указывается прямой слэш, то есть знак «/». Все теги могут быть записаны как с помощью прописных, так и с помощью строчных букв.

Весь html-код страницы должен быть помещён внутри контейнера

Без указания этих тегов браузеры не смогут правильно интерпретировать содержимое страницы.

Далее что следует знать — web-страницы делятся на две логические части. Это заголовок и содержимое.

Заголовок страницы и TITLE

Есть такой контейнер

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

Также есть специальный контейнер

— между этим открывающим и закрывающим тегом указывается название веб-страницы. Данное название отображается в строке заголовка браузера. Допусти, указав

<ТIТLE>Компьютер</ТIТLЕ>

<ТIТLE>Компьютер</ТIТLЕ>

мы увидим в заголовке в браузере название «Компьютер».

Итак, заголовок нашей страницы принимает такой вид:

<HEAD> <ТIТLE>Компьютер</ТIТLЕ> </HEAD>

<HEAD>

<ТIТLE>Компьютер</ТIТLЕ>

</HEAD>

Содержимое веб-страницы

— это контейнер, куда помещается всё основное содержимое страницы сайта. Данный контейнер может содержать таблицы, бегущие строки, ссылки на звуковые, видео и графические файлы, текст и так далее.

Чтобы понимать принцип создания сайта с нуля в блокноте, поместит в основной контейнер текст:

<BODY> Компьютер — это электронное вычислительное устройство. </BODY>

<BODY>

Компьютер — это электронное вычислительное устройство.

</BODY>

Основа WEB-страницы

Итак, со структурой мы разобрались. Открываем блокнот и вносим туда следующий текст:

<HTML> <HEAD> <TITLE>Компьютер</TITLE> </HEAD> <BODY> Компьютер — это электронное вычислительное устройство. </BODY> </HTML>

<HTML>

<HEAD>

<TITLE>Компьютер</TITLE>

</HEAD>

<BODY>

Компьютер — это электронное вычислительное устройство.

</BODY>

</HTML>

Чтобы было удобнее — для размещения сайта создать также отдельную папку, куда можно будет складывать все файлы сайта. Сохраняем в эту папку созданную в блокноте страницу с именем файла index.htm или index.html. Таким названием принято называть титульный файл сайта.

Чтобы увидеть созданную и сохранённую страницу сайта — открываем файл index.htm или index.html с помощью браузера. Создание других страниц и дальнейшую проработку сайта рассмотрим в следующих статьях.

Практикум «Создание Web-сайта Компьютер» — PDF Free Download

УРОК 4. Гиперссылки на Web-страницах

УРОК 4. Гиперссылки на Web-страницах УРОК 4. Гиперссылки на Web-страницах Web-Сайт состоит из нескольких web-страниц. Создадим заготовки остальных Web-страниц. Такие «пустые» страницы должны иметь заголовок, но могут пока не иметь содержания.

Подробнее

<HTML> <HEAD> <TITLE>

<HTML> <HEAD> <TITLE> Лабораторная работа 1. Создание простейшего HTML-документа. Форматирование шрифта и абзаца Цель работы: Научиться создавать простейший гипертекстовый документ средствами текстового редактора Блокнот. Научиться

Подробнее

Глава 1. ОСНОВЫ ВЕБ-КОНСТРУИРОВАНИЯ

Глава 1. ОСНОВЫ ВЕБ-КОНСТРУИРОВАНИЯ 3. Основы языка разметки HTML 3.1. Создание HTML-документа в редакторе Блокнот Веб-страница представляет собой текстовый документ, в котором расставлены команды языка HTML. Они интерпретируются браузером.

Подробнее

Создание сайтов HTML

Создание сайтов HTML Создание сайтов HTML HTML Разработку web-сайта можно осуществлять двумя способами: с помощью специального web-редактора; непосредственно написанием программы на языке HTML. HTML (HyperText Markup Language)

Подробнее

Информатика и ИКТ Лекция 12

Информатика и ИКТ Лекция 12 Информатика и ИКТ Лекция 12 ГБОУ СПО «УМТК» Кондаратцева Т.П. 1 курс Методы создания и сопровождения сайта Основы языка гипертекстовой разметки HTML Интернет — это сложная электронная информационная структура,

Подробнее

WEB-программирование

WEB-программирование WEB-программирование Л Е К Ц И И [Shift]+[F5] Ситников С.Ю. Лекция 1 2 Лекция 1 3 Тимоти Джон Бернерс-Ли британский учёный, изобретатель URL, HTTP, HTML, создатель Всемирной паутины Лекция 2 4 Пример элемента

Подробнее

<html> <head> <title>название документа</title>

<html> <head> <title>название документа</title> Основы языка гипертекстовой разметки HTML Web-документ (иначе html-документ) является обычным текстовым файлом, к имени которого добавлено расширение.htm или.html. Такой документ открывается в обозревателе

Подробнее

Создание сайтов HTML

Создание сайтов HTML Создание сайтов HTML Начало В 1989 году Тим Бернерс-Ли разработал технологию гипертекстовых документов World Wide Web. Гипертекст это текст, в котором содержатся ссылки на другие документы. Основные понятия

Подробнее

Создание Web-страницы

Создание Web-страницы Создание Web-страницы MS Word можно использовать для создания вебстраниц. Несомненно, разрабатывать веб-страницы гораздо лучше при помощи специальных редакторов (например, Microsoft FrontPage), однако

Подробнее

Синтаксис языка HTML

Синтаксис языка HTML Введение в HTML Содержание История языка HTML Синтаксис языка HTML Структура документа HTML Цветовая разметка документа. Способы задания цветовых параметров Разметка текста. Физическое форматирование текста.

Подробнее

Приложение 1. Приложение 2

Приложение 1. Приложение 2

Приложение 1 Приложение 2 Создание Web сайта в программе FrontPage Прикладная программа FrontPage 2003 это визуальный html-редактор для быстрого создания сайта. Язык HTML является основным языком программирования

Подробнее

ОСНОВЫ ПРОГРАММИРОВАНИЯ

ОСНОВЫ ПРОГРАММИРОВАНИЯ ОСНОВЫ ПРОГРАММИРОВАНИЯ Зачем нам знания HTML? Для чего нужен HTML? Как самому создать HTML документ? Для создания HTML файла (документа) необходимо в первую очередь поменять расширение файла текстового

Подробнее

Глава 1. ОСНОВЫ ВЕБ-КОНСТРУИРОВАНИЯ

Глава 1. ОСНОВЫ ВЕБ-КОНСТРУИРОВАНИЯ

5.2.Работа в редакторе FrontPage Рассмотрим основные приемы работы в редакторе FrontPage на примере разработки веб-страницы Озера Беларуси. Она будет содержать текст и фотографии, которые следует подготовить

Подробнее

Arilot CMS руководство пользователя

Arilot CMS руководство пользователя Arilot CMS руководство пользователя 1 Вход в систему администрирования Внешний вид формы авторизации зависит от дизайна 1.1 При наличии кнопки «Вход» Нажмите кнопку «Вход» (Рисунок 1: Кнопка входа). Рисунок

Подробнее

Создание сайтов средствами сервиса Google

Создание сайтов средствами сервиса Google Создание сайтов средствами сервиса Google Краткие теоретические сведения Сервис Google Сайты позволяет быстро создать собственный сайт даже тем, кто не знаком с профессиональными инструментами веб-дизайна.

Подробнее

Глава 1. ОСНОВЫ ВЕБ-КОНСТРУИРОВАНИЯ

Глава 1. ОСНОВЫ ВЕБ-КОНСТРУИРОВАНИЯ 3.2. Изображения на веб-страницах Важную роль в оформлении веб-страниц играют графические объекты: фотографии, рисунки, фоновые изображения («обои»), разделительные линии. Они не только делают страницы

Подробнее

6. Графика. Учебник HTML. Изображения

6. Графика. Учебник HTML. Изображения 6. Графика Изображения Поддержка изображений в HTML — путь в мир графики. Создание и манипулирование изображениями, графическими форматами и другим графическим материалом не является частью HTML. Браузер

Подробнее

— неправильный код. Лекция 4 1

- неправильный код. Лекция 4 1 Будьте внимательны и не допускайте таких ошибок: — помещать внутрь тега … еще теги или нельзя, так как этот код будет не правильно распознан — неправильный код Лекция 4 1 Не будет ошибкой,

Подробнее

Разработка Web-страниц

Разработка Web-страниц Разработка Web-страниц Цель работы: получить представление о создании гипертекстовых документов с помощью языка HTML. Создать персональную Web-страницу. Результат работы файл Моя страница1_фамилия.doc

Подробнее

ПРАКТИЧЕСКОЕ ЗАНЯТИЕ 13

ПРАКТИЧЕСКОЕ ЗАНЯТИЕ 13 ПРАКТИЧЕСКОЕ ЗАНЯТИЕ 13 ТЕМА: Редактирование Web документов Цель занятия: 1) научиться создавать структуру и панель навигации сайта; 2) научиться изменять внешний вид кнопок, цветовую схему, фон Web-страниц;

Подробнее

Лекция Каскадные таблицы стилей (CSS)

Лекция Каскадные таблицы стилей (CSS) Министерство образования Республики Беларусь Учреждение образования Гомельский государственный университет им. Ф. Скорины Физический факультет «Информационные системы и сети» Лекция Каскадные таблицы стилей

Подробнее

Лекция 3 Текстовый процессор

Лекция 3 Текстовый процессор Лекция 3 Текстовый процессор Текстовый редактор Microsoft Word Приложение Microsoft Word 2010 это текстовый процессор, предназначенный для создания профессионально оформленных документов. Объединяя в себе

Подробнее

Создание вэб-приложений. 26 часов

Создание вэб-приложений. 26 часов Создание вэб-приложений 26 часов HTML HTML теговый язык разметки документов. Любой документ на языке HTML представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными

Подробнее

HTML. Создание таблиц.

HTML. Создание таблиц. Тема: Цель: Время: Задание: Практическая работа 43. HTML. Создание таблиц. Познакомиться с языком HTML, получить навыки работы с обязательными тегами, научиться создавать и форматировать документ. 80 мин.

Подробнее

Рис. 1. Диалоговое окно Маркеры и нумерация.

Рис. 1. Диалоговое окно Маркеры и нумерация. Лабораторная работа 5 Оформление текста в виде списков и колонок Создание списков В текстовых документах перечисления различного типа оформляются в виде списков. Существуют списки различных типов: нумерованные

Подробнее

1.1. Общие понятия HTML

1.1. Общие понятия HTML 16 Для создания веб-страниц часто используется язык гипертекстовой разметки HTML. Конечно, каждый сайт индивидуален, но существуют общие правила построения HTML-страниц. Им обязательно нужно следовать

Подробнее

HTML: работа с текстом Урок 2

HTML: работа с текстом Урок 2 HTML: работа с текстом Урок 2 Основной текст располагается body между метками >…. Разд В отличие от текстовых документов прерывания строк в HTML-файлах не существенны. При про Разбиение документа

Подробнее

ИНСТРУКЦИЯ К HTML РЕДАКТОРУ CKEDITOR

ИНСТРУКЦИЯ К HTML РЕДАКТОРУ CKEDITOR ИНСТРУКЦИЯ К HTML РЕДАКТОРУ CKEDITOR Описание редактора CKeditor Форматирование текста 1. Сервисы редактора CKeditor 2. Стили шрифта 3. Структурирование текста 4. Выравнивание текста 5. Вставка ссылок,

Подробнее

Руководство пользователя

Руководство пользователя Руководство пользователя по работе с редакционной системой EDUkIT (www.edu.kh.ua) «Создание и редактирование страниц» Контактное лицо: Дарья Рыжкова [email protected] телефон: (057) 751 86 15 Содержание

Подробнее

АТИЛЕКТ.CMS. [Текстовый редактор]

АТИЛЕКТ.CMS. [Текстовый редактор] ИНСТРУКЦИЯ к системе администрирования АТИЛЕКТ.CMS [Текстовый редактор] Оглавление Модуль «Текстовый редактор»… 2 Редактирование данных… 2 Как разместить в тексте ссылку… 4 Ссылка… 4 Якорь… 4

Подробнее

Практическая работа 1

Практическая работа 1 Порядок выполнения работы Практическая работа 1 1. Выполните упражнения 1, 2, 3, 4, 5, 6. Упражнение 1 1. Создайте новый документ. Сохраните документ с именем Текст1.doc. 2. Установите параметры страницы

Подробнее

Лекция 6. Элементы HTML 4.01 (продолжение)

Лекция 6. Элементы HTML 4.01 (продолжение) Донецкий национальный технический университет Факультет компьютерных наук и технологий Кафедра компьютерной инженерии Лекция 6. Элементы HTML 4.01 (продолжение) Иваница Сергей Васильевич, ассистент кафедры

Подробнее

Вопрос 3. HTML формы

Вопрос 3. HTML формы Вопрос 3. Язык гипертекстовой разметки HTML. HTML (HyperText Markup Language) это коллекция стилей (указанных в терминах языка HTML), которые определяют различные компоненты WWW документов. Годом рождения

Подробнее

Компьютер

Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>

  2. <head>

  3. <title> Компьютер </title>

  4. </head>

  5. <body>

  6.  

  7. <font color=»blue»>

  8. <h2 align=»center»> Все о компьютере </h2>

  9.  

  10. </font>

  11. <hr>

  12.  

  13. <font size=»4pt»>

  14. <p align=»left»> На этом сайте вы сможете получить « различную информацию

  15. </i> о компьютере, его программном обеспечении и ценах на компьютерные

  16. комплектующие.</p>

  17. <p align=»right»> Терминологический словарь познакомит вас с

  18. <b> компьютерными терминами </b>, а также вы сможете заполнить анкету. </p>

  19. </font>

  20.  

  21. <img src=computer.png title=»KourizioTep»

  22. align=right>

  23. </body>

  24. </html>

<html> <head> <title> Компьютер </title> </head> <body> <font color=»blue»> <h2 align=»center»> Все о компьютере </h2> </font> <hr> <font size=»4pt»> <p align=»left»> На этом сайте вы сможете получить « различную информацию </i> о компьютере, его программном обеспечении и ценах на компьютерные комплектующие.</p> <p align=»right»> Терминологический словарь познакомит вас с <b> компьютерными терминами </b>, а также вы сможете заполнить анкету. </p> </font> <img src=computer.png title=»KourizioTep» align=right> </body> </html>

We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!

 

Знакомства с html тэгами — Вэб-шпаргалка для интернет предпринимателей!

Ну а теперь давайте разберем все по порядку.

<html>
<head>
<title>Моя первая страница</title>
</head>
<body>
Получилось!!! <br/> Это моя первая страница.
</body>
</html>

Все, что находится между символом «<» и « >» — это тэг. Текст, не находящийся между такими скобками < > — весь виден при просмотре в брaузере.

Тэги, как вы уже догадались, бывают разные и для разных случаев. На пример тег <br/> говорит браузеру, что надо перейти на новую строку.

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

<html> — Этот тэг должен открывать документ. Если есть открывающий тэг, то должен быть и закрывающий: </html>.
Он говорит браузеру, что все, что он увидит в рамках этого тэга написано на языке html.

Дальше обозначаем голову документа тэгами:
<head>
Вся информация, которая находиться между ними является «служебной» тоесть она предназначено для поисковиков, браузеров и скриптов обработчиков. Обратите внимание, где находится предложение, заключенное в тэгах: <title> </title>. Подсказка: посмотрите на вкладку вашего браузера.
</head>

Все что расположено между тэгами <body> </body> — и есть содержимое документа, то что вы видите перед экраном монитора. Вы должны понять сам механизм работы этих тэгов, дело в том, что <тэг> </тэг> — это не просто тэг, это контейнер, который может содержать внутри себя другие тэги, текст, изображения и т.п.

Обратите внимание:

<тэг1> <тэг2> <тэг3> … </тэг3> </тэг2> </тэг1>

Только такая очередность закрывающих тэгов верна: тэг, который мы открыли первым — закрываем последним, второй – предпоследним и т.д. Другая очередность открывающих и закрывающих тэгов приведет к неправильному отображению вашего сайта в браузере.

Рекомендуем к прочтению

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *