09/03/2023

Что такое Web-страницы?

Гиперссылка – «активная»ссылка на другой документ.
Гипертекст – текст, содержащий

09/03/2023

Какие бывают Web-страницы?

статические – существуют на сервере в виде готовых файлов:

09/03/2023

Язык HTML

HTML = Hypertext Markup Language (язык разметки гипертекста)

HTML-страница – это текстовый

09/03/2023

Тэги

Тэг – это команда языка HTML, которую выполняет браузер:

непарные тэги
парные тэги

09/03/2023

Простейшая Web-страница

Привет!

first.html

шапка («голова»)

Привет!

основная

09/03/2023

Редактор HEFS

файловые операции

буфер обмена

один экран

запуск
браузера (F9)

назад

вперед

текстовый

09/03/2023

Кодирование цвета

имена
red, green, blue, magenta, black,
шестнадцатеричные коды

white

R

G

B

# F F

09/03/2023

Тэг BODY – общие свойства страницы

цвет фона и текста
цвет гиперссылок

09/03/2023

Вставка тэгов в HEFS

09/03/2023

Вставка атрибутов в HEFS

вставить только код цвета

09/03/2023

цвет текста
размер шрифта

Тэг FONT – свойства блока текста

Привет!

Как дела?

Привет!

09/03/2023

Стили оформления

09/03/2023

Форматированный текст (листинги программ)

program qq;
var a, b: integer;
begin
writeln("Введите два числа");

09/03/2023

Заголовки: H1 … H6

Заголовок документа

Заголовок раздела

Заголовок подраздела

Заголовок параграфа

Комментарий

Авторские пометки

выравнивание:

История

left,
center,

09/03/2023

Форматирование текста в HEFS

Ctrl-B

09/03/2023

Специальные символы

09/03/2023

Специальные символы в HEFS

09/03/2023

Абзацы

переход на новую строку
абзац (с отступами)

Одно физическое тело захотело поменять три

09/03/2023

Выравнивание

Этот текст выровнен по центру.

Этот текст выровнен по ширине.
Этот

09/03/2023

Абзацы в HEFS

09/03/2023

Линия-разделитель

horizontal rule

ширина в пикселях или процентах

толщина

выравнивание

09/03/2023

Цвет гиперссылок

...

LINK ссылки, на которых не были
VLINK посещенные

09/03/2023

Ссылки на другие страницы сайта

Таблицы

страница в той же папке

anchor (якорь)

09/03/2023

Примеры (ссылки из файла rock.html)

09/03/2023

Ссылки на другие сайты

Почта

на главную страницу сайта

index.htm, index.html, default.asp, …

на

09/03/2023

Ссылки внутри страницы

Глава 1
Глава 2

Глава 1

09/03/2023

Запуск почтовой программы

Напишите мне!

09/03/2023

Гиперссылки в HEFS

локальная ссылка

Ctrl-A гиперссылка на выделенный блок, адрес вводить вручную

вставить

09/03/2023

Маркированные списки

• Вася
  
• Петя
  
• Коля
  

unordered list (неупорядоченный список)

list item (элемент списка)

изменение

09/03/2023

Нумерованные списки

1. Вася
   
2. Петя
   
3. Коля
   

ordered list (упорядоченный список)

изменение нумерации:

...

1, i,

09/03/2023

Списки определений

компьютер

устройство для обработки информации

дискета

гибкий магнитный диск

винчестер

жесткий магнитный диск

definition list

09/03/2023

Многоуровневые списки

• Города России       
  
• Города Украины   
  

  
1. Москва   
2. Санкт-Петерург

  
1. Киев   
2. Одесса

09/03/2023

Списки в HEFS

Ctrl-L вставить элемент списка

09/03/2023

Форматы рисунков

GIF (Graphic Interchange Format)
сжатие без потерь
прозрачные области
анимация
только с палитрой (2…256

09/03/2023

Фон страницы

"images/back.jpg"
"../images/back.jpg"
"http://www.vasya.ru/images/back.jpg"

09/03/2023

Рисунки в документе

из

09/03/2023

Выравнивание

left

right

top

bottom
(по умолчанию)

middle

09/03/2023

Отступы

VSPACE
(vertical space)

HSPACE
(horizontal space)

09/03/2023

Другие атрибуты

всплывающая подсказка
надпись на месте

09/03/2023

Рисунок-гиперссылка

ALT="Бесплатная почта" BORDER=0>

локальная

09/03/2023

Рисунки в HEFS

вставить рисунок

09/03/2023

Простейшая таблица

толщина рамки

TABLE таблица
TR = table row строка таблицы
TD = table data данные таблицы
TH = table header заголовок (жирный, по центру)

09/03/2023

Размеры

ширина в пикселях или в % от ширины окна

09/03/2023

Выравнивание

всей таблицы:

информации в ячейках:

left,
center,
right

left,
center,
right

top,
middle,
bottom

09/03/2023

Фон и цвет текста

цвет фона

фоновый рисунок

09/03/2023

Отступы

интервал между ячейками

отступ внутри ячеек

CELLSPACING

CELLSPACING

CELLPADDING

CELLPADDING

09/03/2023

Объединение ячеек

column span охват столбцов

row span охват строк

09/03/2023

Вложенные таблицы

09/03/2023

Таблицы в HEFS

09/03/2023

Фреймы

Фрейм (frame) – это часть сложной Web-страницы, в которую может быть

09/03/2023

Описание структуры

index.html

columns
столбцы

ширина в

09/03/2023

Граница между фреймами

...

...

граница между фреймами:
0 – невидима,

09/03/2023

Настройка фрейма (FRAME)

MARGINHEIGHT="0"
NORESIZE
SCROLLING="auto">

убрать отступы от

09/03/2023

Фреймы-строки

index.html

NAME="qq">

строки

ширина в

09/03/2023

Сложные структуры (3 фрейма)

index.html

09/03/2023

Как открыть ссылку в другом фрейме

TARGET="qq">Глава 2

TARGET

09/03/2023

Фреймы в HEFS

09/03/2023

Работа с несколькими страницами в HEFS

переключение страниц

закрыть текущую страницу (Ctrl-W)

просмотр активной

09/03/2023

Что может Javascript?

информация статична
нет интерактивности (только переход на другую страницу)

Чем плоха

09/03/2023

Основные принципы

каждый элемент на странице (текст, рисунок, таблица) – это объект,