Реферат Курсовая Конспект
Методическое пособие по созданию HTML-странички - раздел Программирование, Министерство Здравоохранения И Социального Развития Российской Федерации ...
|
Министерство здравоохранения и социального развития Российской Федерации
Государственное бюджетное образовательное учреждение высшего профессионального образования
ПЕРВЫЙ МОСКОВСКИЙ ГОСУДАРСТВЕННЫЙ МЕДИЦИНСКИЙ УНИВЕРСИТЕТ имени И.М.СЕЧЕНОВА
Медико-профилактический факультет
Кафедра медицинской информатики и статистики
Методическое пособие по созданию HTML-странички
(для факультета ВСО )
Москва
Оглавление
Начало работы с HTML.. 3
Структура HTML-документа. 5
Связь между документами <LINK>. 6
Раздел BODY.. 6
Изменение цвета и фона документа. 6
Фреймы.. 9
Нумерованные списки. 10
Создание простейших таблиц. 12
Таблица тэгов. 14
Lt;head> </head> - открывающий и закрывающий тэги голова документа
Раздел BODY
Раздел BODY является одним из самых важных компонентов любого HTML-документа, т. к. в нем располагается содержательная часть, которая выводится браузером на экран монитора пользователя.
Раздел описывается парным тегом <BODY></BODY>, внутри которого размещается большинство существующих тегов HTML. Тег <BODY> имеет ряд параметров, которые условно можно разделить на четыре основные группы (параметры фона, границ документа, текста и гиперссылок).
Фреймы
Фреймы позволяют нам открыть в окне броузера - не один, а одновременно несколько документов, например документ который содержит меню, документ, который содержит логотип, шапку страницы, документ с непосредственным содержанием нашего сайта
Более подробно остановимся на Iframe.
IFrame - "плавающий" или встроенный фрейм. Iframe позволяет нам вставить один html-документ в другой html-документ. «Плавающий» фрейм вводится в наш обычный html-документ при помощи тэга <Iframe><Iframe>:
<IFRAME src="ancorpri.html" width="300" height="250" scrolling="auto" frameborder="1"></IFRAME>
В атрибуте src мы указываем путь к документу, который отобразиться во встроенном фрейме.
Атрибуты height и width отвечают за ширину и высоту встроенного фрейма.
Атрибут scrolling(полоса прокрутки), он может принимать несколько значений: no - это значит совсем не будет полосы прокрутки, ни при каких обстоятельствах; yes - это значит полоса прокрутки будет всегда; auto - полоса прокрутки появится только тогда, когда она нужна.
Атрибут frameborder указывает отображать или нет границы встроенного фрейма, возможные значения 1 (да, отображать) и 0 (нет, не отображать). Iframe может выравниваться относительно содержимого страницы: текста и картинок, и может, соответственно, быть заключен в тэги выравнивания и таблицы.
Добавим в наш файл Index.html фрейм со ссылкой на внешний файл Список.html, в котором далее будет записан список группы :
Таблица тэгов.
Тэг | Назначение и атрибуты |
A | ссылка |
href="другой_документ.html" - путь к документу | |
target=_blank - открывает ссылку в новом окне | |
name="anchor1" - имя закладки | |
title="Ваша подсказка" - подсказка к ссылке (текстовой) | |
AREA | определяет геометрические области внутри карты и ссылки для них |
shape="rect" (circle, poly) - тип области | |
coords="x1,y1,..." - координаты области | |
alt="описание" - описание, подсказка | |
href="document.html" - ссылка | |
B | выделение текста полужирным шрифтом |
BIG | выделение текста более крупным шрифтом, чем основной |
BODY | тело документа, обязательный тэг |
text="#cc0000" - задает цвет текста всего документа | |
bgcolor="#000000" - задает цвет фона документа | |
background="картинка.jpg" - задает фоновую картинку | |
link="#ff9999" - задает цвет ссылки | |
alink="#ff9999" - задает цвет активной (нажатой) ссылки | |
vlink="#ff9999" - задает цвет посещенной ссылки | |
topmargin="0" - ширина верхнего и нижнего полей документа для IE | |
leftmargin="0" - ширина левого и правого полей документа для IE | |
marginheight="0" - ширина верхнего и нижнего полей документа для NN | |
marginwidth="0" - ширина левого и правого полей документа для NN | |
BR | принудительный перенос текста на другую строку |
clear="all" (left, right) - завершение обтекания текстом объекта | |
CENTER | центрирование текста и объектов |
DIV | выравнивание текста и объектов |
align="center" - центрирование | |
align="right" - выравнивание по правому краю документа | |
align="left" - выравнивание по левому краю документа | |
align="justify" - выравнивание по обоим краям документа | |
FONT | управление шрифтами |
color="#cc0000 - задает цвет для блока текста | |
size="+0" - задает размер шрифта текста (от -2 до +4) | |
face="Arial" - задает определенный тип шрифта | |
FRAME | определяет содержимое и вид одного фрейма |
marginheight="0" - ширина верхнего и нижнего полей фрэйма | |
marginwidth="0" - ширинау левого и правого полей фрэйма | |
scrolling="yes" (no, auto) - линейка прокрутки | |
name="window-1" - имя фрейма | |
noresize - запретить посетителю менять размеры фреймов | |
FRAMESET | определяет макет основного окна в виде прямоугольных пространств |
rows="100,200,*" - определяет расположение горизонтальных фреймов | |
cols="10%,20%,70%" - определяет расположение вертикальных фреймов | |
border - определяет ширину рамок фрэймов в пикселах | |
Hx | заголовки (H1, H2, H3, H4, H5, H6) |
HEAD | голова документа, обязательный тэг |
HR | линия |
align="right" (center или left) | |
width="30%" (ширина линии в процентах) | |
size="6" (толщина линии) | |
NoShade (отмена объемности) | |
color="cc0000" (цвет линии, только в IE) | |
HTML | указывает на тип документа, обязательный тэг |
I | выделение текста курсивом |
IFRAME | "плавающий" фрейм |
src="ancorpri.html" - путь к подгружаемому документу | |
width="300" - вширина "плавающего" фрейма | |
height="250" - высота "плавающего" фрейма | |
scrolling="auto" (yes, no) - полоса прокрутки | |
frameborder="1" (0) - отображать или нет границы фрейма | |
IMG | подгрузка изображений (картинок) |
Border="5" - рамка покруг картинки | |
width="500" - ширина картинки | |
height="100" - высота картинки | |
align="left" - расположение текста по отношению к картинке | |
vspace="10" - расстояние от картинки до текста по вертикали | |
hspace="30" - расстояние от картинки до текста по горизонтали | |
alt="описание" - описание картинки | |
usemap="#karta1" - ссылка на карту | |
LI | определяет элемент списка |
MAP | определяет клиентскую навигационную карту |
name="karta1" - имя карты | |
MARQUEE | бегущая строка текста (только IE) |
bgcolor - цвет фона бегущей строки | |
height - высота строки | |
width - ширина строки | |
behavior="scroll" обычная прокрутка | |
behavior="slide" - строка пробегает до края и останавливается | |
behavior="alternate" - строка будет двигаться от края к краю | |
scrollamount="1" (1-10) - скорость движения строки | |
direction="left" (right, up, down) - движение влево (вправо, вверх, вниз) | |
OL | упорядоченные списки |
type="I" (i, 1, a, A) - стиль элемента списка | |
P | параграф, выравнивание текста и объектов |
align="center" - центрирование | |
align="right" - выравнивание по правому краю документа | |
align="left" - выравнивание по левому краю документа | |
align="justify" - выравнивание по обоим краям документа | |
PRE | форматированный текст |
S | перечеркнутый текст |
SMALL | выделение текста более мелким шрифтом, чем основной |
STRIKE | перечеркнутый текст |
SUB | нижний индекс |
SUP | верхний индекс |
TABLE | таблица |
bgcolor="#FFCC33" - цвет фона таблицы (строки, ячейки) | |
background="картинка.gif" - задает фоновый рисунок | |
width="50" или width="50%"- ширина таблицы | |
height="45" или height="45%"- высота таблицы | |
cellspacing="5" - расстояние между ячейками | |
cellpadding="5" - расстояние внутри ячеек | |
border="3" - задает толщину рамки таблицы | |
bordercolor="#000000" - задает цвет рамки таблицы | |
TD | ячейка данных таблицы |
bgcolor="#FFCC33" - цвет фона | |
background="картинка.gif" - задает фоновый рисунок | |
width="50" или width="50%"- ширина | |
height="45" или height="45%"- высота | |
align="center" (right, left) - горизонтальное выравнивание содержимого | |
valign="middle" (top, bottom) - вертикальное выравнивание содержимого | |
colspan="2" - растянуть ячейку на несколько стобцов | |
rowspan="2" - растянуть ячейку на несколько рядов | |
cellspacing="5" - расстояние между ячейками | |
TITLE | заголовок документа |
TR | строка таблицы |
bgcolor="#FFCC33" - цвет фона | |
background="картинка.gif" - задает фоновый рисунок | |
width="50" или width="50%"- ширина | |
height="45" или height="45%"- высота | |
TT | шрифт пишущей машинки (моноширинный) |
U | подчеркнутый текст |
UL | неупорядоченные списки |
type="disk" (circle, square) - стиль элемента списка |
– Конец работы –
Используемые теги: Методическое, пособие, созданию, HTML-странички0.072
Если Вам нужно дополнительный материал на эту тему, или Вы не нашли то, что искали, рекомендуем воспользоваться поиском по нашей базе работ: Методическое пособие по созданию HTML-странички
Если этот материал оказался полезным для Вас, Вы можете сохранить его на свою страничку в социальных сетях:
Твитнуть |
Новости и инфо для студентов