СДЕЛАЙТЕ СВОИ УРОКИ ЕЩЁ ЭФФЕКТИВНЕЕ, А ЖИЗНЬ СВОБОДНЕЕ

Благодаря готовым учебным материалам для работы в классе и дистанционно

Скидки до 50 % на комплекты
только до

Готовые ключевые этапы урока всегда будут у вас под рукой

Организационный момент

Проверка знаний

Объяснение материала

Закрепление изученного

Итоги урока

Таблицы тегов HTML

Категория: Информатика

Нажмите, чтобы узнать подробности

При создании веб-страниц рекомендуется использовать опорные схемы, на которых скелетно изложены основы HTML-кодирования

Просмотр содержимого документа
«Таблицы тегов HTML»

Таблицы тегов HTML


ШРИФТОВОЕ ОФОРЛЕНИЕ

Тег

Описание

B

Полужирное начертание

I

Курсивное начертание

U

Подчеркнутое начертание

S

Перечеркнутое начертание

SUP

Надстрочное начертание

SUB

Подстрочное начертание

TT

Моноширинный шрифт

PRE

Предварительно отформатированный текст

FONT

Шрифтовое оформление

SIZE = число от 1 до 7 или от -2 до +4

-размер шрифта.

РАСЕ="название, название, …"

- гарнитура шрифта

COLOR=#16-число | название

- цвет шрифта

BIG

Увеличить кегль на единицу (то же, что )

SMALL

Уменьшить кегль на единицу (то же, что )

БЛОКИ

Тег

Описание

BR

Новая строка

CLEAR =all | left | right | попе


отмена обтекания картинки текстом, начиная со следующей строки

P

Новый абзац

ALIGN=left | right | center | justify.

- выравнивание текста

TITLE="название"

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

CLEAR =all | left | right | попе

- отмена обтекания картинки текстом, начиная со следующего абзаца

DIV

Новый раздел

ALIGN=left | right | center | justify

- выравнивание текста

TITLE="название"

- всплывающая подсказка

SPAN

Новый блок внутри абзаца или раздела





ПРОЧИЕ ЭЛЕМЕНТЫ ВЕБ-СТРАНИЦ

Тег

Описание

A

Гиперссылка

HREF=адрес | #метка | адрес#метка

- адрес файла или метки

NАМЕ=имя

- присвоить метку

TITLE="название"

- всплывающее название

TARGET=new | имяокна | _top | _blank | _self |_ parent

- в каком окне или фрейме открыть

HR

Линия

WIDТН=пиксели | проценты

-ширина линии

SIZE=пиксели

-толщина линии

ALIGN=left | right | center

- расположение на странице

GOLOR=#16- число | название

-цвет

NOSHADE

- плоская линия без эффекта тени

MARQUEE

Бегущая строка

SCROLLDELAY= число

- задержка между движениями (в миллисекундах)

SCROLLAMOUNT=число

- скорость движения (в мс)

BEHAVIOR=alternate |slide | scroll

- поведение надписи

DIRECTION=down | left | right | up

- направление движения текста

LOOP=число

- число повторений

WIDТН=пиксели | %

- ширина

HEIGHT=пиксели| %

- высота

ALIGN=left | right | center

- расположение на странице

НSРАСЕ=число

- поля горизонтальные

VSРАСЕ=число

- поля вертикальные

Bgcolor ="цвет"

- фоновый цвет

Комментарий

BGSOUND

Фоновый звук стандарта Microsoft

SRC=адрес

- адрес файла mid, wav или mp3

LOOP=0 | -1

- количество повторов

VOLUME= число от -10000 до 0

- громкость

BALANCE= число от -10 000 до 10000

- баланс

EMBED

Внедренный мультимедийный объект

SRC=адрес

- адрес файла

ALIGN=left | right | top | bottom | middle | baseline

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

LOOP= число

- количество повторов

HEIGHT=число| %

- высота области

WIDТН=число | %

- ширина области

НSРАСЕ= число

- поля сверху и снизу

VSРАСЕ=число

- поля по бокам

PLUGINPAGE=адрес

- адрес веб-страницы, откуда можно скачать плагин

TYPE=MIME - тип

- тип объекта

HIDDEN

- скрыть объект (включая кнопки плеера)



ОФОРМЛЕНИЕ АБЗАЦА ИЛИ ИНОГО БЛОКА

Тег

Описание

CENTER

Расположение блока по центру

Н1-Н6

Заголовок

ALIGN=left | right | center | justify

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

BLOCKQUOTE

Оформление цитаты сдвигом

CITE

Оформление цитаты курсивом

СПИСОК

Тег

Описание

UL

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

TYPE=disk | square | circle

- тип пули (черный круг, квадрат, кольцо)

OL

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

- тип пули (цифры обычные, цифры римские большие и малые, буквы латинские большие и малые

начальный номер списка

TYPE=1|I|i | А | а

START=число

LI

Элемент списка (пуля)

СПИСОК ОПРЕДЕЛЕНИЙ

Тег

Описание

DL

Начало и конец списка определений (расположение текста, как в словаре)

DT

Термин (словарное слово)

DD

Определение термина (значение слова)

ИЗОБРАЖЕНИЯ

Тег

Описание

IMG

Изображение

SRC=адpec

- адрес файла

WIDТН=пиксели | проценты

- ширина изображения

HEIGHT=пиксели | проценты

- высота изображения

ALIGN= left | right | top| bottom | middle | baseline | absmiddle | texttop

- расположение относительно текста или других изображений

VSPACE=пиксели

- вертикальные поля

НSРАСЕ =пиксели

- горизонтальные поля

ALT="текст"

- альтернативный текст

TITLE="текст"

- название картинки (появляется во всплывающей подсказке)

BORDER=пикcели

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

USЕМАР=#имя_карты

- назначить изображение картой ссылок с данным именем

LOWSRС=адрес

- адрес файла низкого разрешения, который будет показан до полной загрузки основного изображения

MAP

Описание карты ссылок

NAМЕ= имя карты

- имя карты

AREA

Описание области на карте


SHAPE= rect | circ | poly

- форма области , (прямоугольник, круг, многоугольник)


COORDS=число, число,...

- координаты углов или центр + радиус


HREF= адрес

-адрес


ALT="текст"

- альтернативный текст


TARGET=new | имя окна | _top | _balnk | _self ] parent

- в каком окне или фрейме открыть



ТАБЛИЦЫ

Тег

Описание

TABLE

Таблица

WIDTH=пиксели или проценты

- ширина таблицы

ALIGN=left | right | center

- расположение на странице-

VSPACE=пиксели

- поля сверху и снизу от таблицы

НSРАСЕ =пиксели

- поля по бокам таблицы

BORDER=пикcели

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

BORDERCOLOR=4BeT

- цвет рамки

BGCOLOR -цвет

- фоновый цвет

BACKGROUND=адрес рисунка

- фоновое изображение

CELLSPACING=пикceли

- просвет между ячейками

CELLPADDING=пиксели

-просвет между текстом и границами ячейки

TR

Строка таблицы

ALIGNN=left | right | center

- расположение текста и графики

VALIGN=top | bottom|center

- вертикальное расположение

BGCOLOR-цзет

- фоновый цвет

TD

Ячейка таблицы

ALIGN=left| right | center

- расположение текста и графики

VALIGN=top| bottom | center

- вертикальное расположение

WIDTH=пиксели | проценты

- ширина ячейки

BGCOLOR=цвет

- фоновый цвет

BACKGROUND=адрес рисунка

- фоновое изображение

COLSPAN= число

- объединить несколько колонок

RAWSPAN= число

- объединить несколько строк

ТН

Заголовочная ячейка


Все как у TD

CAPTION

Заголовок таблицы

ALlGN=left| right | bottom VALIGN=top | bottom

- расположение заголовка относительно таблицы

COL

Ширина и выравнивание в колонке

WIDTH =число или %

- ширина колонки

ALIGN=left | center | right

- выравнивание текста в колонке по горизонтали

VALIGN=baseline | bottom| middle | top

- выравнивание текста в колонке по вертикали

SPAN=число

- количество колонок, на которые воздействует данный тег .

СЛУЖЕБНЫЕ ТЕГИ

Тег

Описание

HTML

Начало и конец кода веб-страницы

HEAD

Начало и конец области заголовка

TITLE

Название страницы

МЕТА

Метаданные, предназначенные для браузеров и поисковых систем

NAME=keywords | generator | author | description

- имя и назначение метаданных

HTTP-EQUIV=content-type | refresh | expires

- служебная информация (тип кодировки, загрузка другой страницы, дата и время устаревания)

СОNTENT=text/htm 1 | charset=...

- содержание

BASE

Базовый адрес для относительных ссылок

HREF=адрес

- базовый адрес

TARGET=new | имя окна | _top | _balnk | _self ] parent

- где открывать ссылки

BODY

Область основного текста

BACKGROUND= адрес

- фоновое изображение

BGCOLOR-#16-число или цвет

- фоновый цвет

ТЕХТ=#16-число или цвет

- цвет основного текста

LINK=#16-число или цвет

- цвет ссылки

VLINK=#16-число или цвет

- цвет посещенной ссылки

ALINK =#16-число или цвет

- цвет активной ссылки

BGPROPERTIES= fixed

- прокручивать фон с текстом

BOTTOMMARGIN= число

- нижнее поле

LEFTMARGIN= число

- левое поле

TOPMARGIN=число

- верхнее поле

SCROLL=yes или no

- разрешить | убрать полосы прокрутки

LINK

Ссылка на внешние данные

REL=stylesheet | shortcut icon | next | prev...

- тип ссылки (на стилевой файл, на значок для закладки, на следующую и предыдущую- страницу сайта и т. п.)

TYPE=text/css, image/x-icon

-тип данных

HREF= адрес

- адрес ссылки

ФРЕЙМЫ

Тег

Описание

FRAMESET

Описание фреймовой структуры

COLS=ширина 1, ширина 2

- ширина вертикальных фреймов в пикселях (число), процентах (%) или авто (*)

ROWS= ширина 1, ширина 2

- высота горизонтальных фреймов

FRAMEBORDER=1 | 0

- рамка вокруг фрейма

BORDER=число

FRAMESPACING=число

- толщина рамки вокруг фрейма

BORDERCOLOR=#число | цвет

- цвет рамки

FRAME

Определение фрейма

SRC=адрес

- адрес html-файла

МАМЕ= имя

- имя фрейма

NORESIZE

- запретить изменение размеров

SCROLLING=no | yes | auto

- полосы прокрутки

FRAMEBORDER=1 | 0

- рамка вокруг фрейма

BORDERCOLOR=#число | цвет

- цвет рамки

NOFRAMES

Для браузеров, не поддерживающих фреймы

IFRAME

Плавающий фрейм

ALIGN=absmiddle | baseline | bottom | left | middle | right | texttop | top

- выравнивание на странице

HEIGHT =число

- высота

WIDTH =число

- ширина

SRC=адрес

- адрес файла, который будет показан во фрейме

NAМЕ=имя

-имя фрейма

HРАСЕ=число

- вертикальные поля

VSPACE=число

- горизонтальные поля

SCROLLING= yes | no | auto

- полоса прокрутки

FRAMEBORDER= 0 | 1 или yes | no

- рамка вокруг фрейма

ФОРМЫ

Тег

Описание

FORM

Форма для передачи данных от посетителя серверу (кнопки, переключатели, списки, поля ввода)

АСТION=адрес

- адрес скрипта на сервере, обрабатывающего данные формы

NAМЕ= имя

- уникальное имя формы

TARGET=_blank | _self | _parent | _self | _top

- где появится ответ сервера

METHOD=get | post

- метод передачи данных к серверу

ENCTYPE=MIME-тип

- MIME-тип отправляемых данных

INPUT

Элемент формы

NAМЕ= имя

- уникальное имя элемента

ALIGN= bottom | left | middle | right | _ texttop | top | absmiddle | baseline

- расположение на странице

TYPE=button | checkbox | file | password | radio | reset | submit | text | image | hidden

- тип элемента: кнопка (button), переключатель (checkbox), выключатель (флажок, radio), имя файла (file), пароль (password), кнопка сброса (reset), кнопка отправки данных (submit), текстовое поле (text), графическое изображение (image), скрытый элемент (hidden)

CHECKED

- этот элемент помечен (стоит точка в переключателе либо галочка в выключателе)

DISABLED

- блокирует доступ и изменение элемента

MAXLENGTH=число

- максимальное количество символов, разрешенных в поле ввода .

VALUE=значение

для кнопок (button | reset | submit) устанавливает текстовую надпись на них;

для текстовых полей (password | text) указывает предварительно введенную строку;

для выключателей

и переключателей (icheckbox | radio) уникально определяет каждый элемент

SIZE=число

- ширина текстового поля в буквах

SRC=адрес

- адрес картинки, которая будет показываться для кнопки с изображением

ALT=текст

- альтернативный текст для кнопки с изображением

SELECT

Элемент формы: список (строки в списке задаются тегами OPTION)

NAME=имя

- уникальное имя элемента

SIZE=число

- высота списка (в строках). При 1 обычный выпадающий ; список, при остальных - с полосой прокрутки

MULTIPLE

- разрешается выбор нескольких строк (с шифтом или контролом)


DISABLED

- заблокировать список

OPTION

Строки в списке

SELECTED

- пункт выделен по умолчанию

VALUE="значение"

- информация, которая будет передана серверу при выборе этой строки

TEXTAREA

Элемент формы: строка ввода


ROWS=число

- высота поля ввода (в, строках)


COLS=число

- ширина поля (в символах)


NAME-имя

- уникальное имя элемента


DISABLED

- поле недоступно



Литература:

  1. Левин, А.Ш. Самоучитель полезных программ. 5-е изд. СПб.; Питер, 2008. – 752 с.

  2. Комолова, Н.В. HTML. Самоучитель. СПб.; Питер, 2009. – 268 с.