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

Реферат Курсовая Конспект

Методическое пособие по созданию HTML-странички

Методическое пособие по созданию HTML-странички - раздел Программирование, Министерство Здравоохранения И Социального Развития Российской Федерации ...

Министерство здравоохранения и социального развития Российской Федерации

Государственное бюджетное образовательное учреждение высшего профессионального образования

ПЕРВЫЙ МОСКОВСКИЙ ГОСУДАРСТВЕННЫЙ МЕДИЦИНСКИЙ УНИВЕРСИТЕТ имени И.М.СЕЧЕНОВА

Медико-профилактический факультет

Кафедра медицинской информатики и статистики

 

Методическое пособие по созданию HTML-странички

(для факультета ВСО )

 

Москва


 

Оглавление

Начало работы с HTML.. 3

Структура HTML-документа. 5

Связь между документами <LINK>. 6

Раздел BODY.. 6

Изменение цвета и фона документа. 6

Фреймы.. 9

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

Создание простейших таблиц. 12

Таблица тэгов. 14

 

 


 

 

Начало работы с HTML

D:\Страничка   Cегодня язык разметки HTML является основой всех размещенных в Интернете электронных документов. Так же, как обычный…

Структура HTML-документа

  Пример тэга: <br> (перенос текста на другую строку). Попробуйте вставить…

Lt;head> </head> - открывающий и закрывающий тэги голова документа

Lt;body> </body> - открывающий и закрывающий тэги тело документа

Некоторые тэги, вроде <br>, не требуют закрывающего тэга. Например <title>- заголовок. Все тэги, расположенные между <body>и</body> - непосредственное содержание документа

Раздел BODY

Раздел BODY является одним из самых важных компонентов любого HTML-документа, т. к. в нем располагается содержательная часть, которая выводится браузером на экран монитора пользователя.

Раздел описывается парным тегом <BODY></BODY>, внутри которого размещается большинство существующих тегов HTML. Тег <BODY> имеет ряд параметров, которые условно можно разделить на четыре основные группы (параметры фона, границ документа, текста и гиперссылок).

 

Изменение цвета и фона документа

1 Представление в виде трёх пар шестнадцатеричных цифр, где каждая пара отвечает за свой цвет: две первые цифры — красный; две в середине — зелёный;

Фреймы

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

Более подробно остановимся на 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, в котором далее будет записан список группы :

 

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

    Как видно из примера, после каждого пункта списка осуществляется перенос строки, причем без указания каких-либо…

Создание простейших таблиц

Теги <TR>, <TD> и< TH > могут не иметь своих закрывающих тегов. Однако все же рекомендуется их указывать для предотвращения… Таблица может состоять из любого количества рядов, каждый из которых может… <table>

Таблица тэгов.

Тэг Назначение и атрибуты
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-странички

Что будем делать с полученным материалом:

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

Еще рефераты, курсовые, дипломные работы на эту тему:

Для подготовки к практическим занятиям по дисциплине Безопасность жизнедеятельности методическое пособие для студентов Методические указания
высшего профессионального образования... Волгоградский государственный медицинский университет... Министерства здравоохранения и социального развития РФ...

Создание фигур и изменение их геометрии в приложении MS Visio. Создание и разработка планировок в приложении MS Visio. Графический редактор Adobe Photoshop. Изучение панели инструментов редактора. Создание и обработка графических изображений.
Лабораторная работа Создание фигур и изменение их геометрии в приложении... ЦЕЛЬ РАБОТЫ приобретение навыков создания фигур средствами MS Visio...

МЕТОДИЧЕСКОЕ ПОСОБИЕ СОЗДАНИЕ ТОВАРИЩЕСТВА СОБСТВЕННИКОВ ЖИЛЬЯ
МЕТОДИЧЕСКОЕ ПОСОБИЕ... СОЗДАНИЕ ТОВАРИЩЕСТВА СОБСТВЕННИКОВ ЖИЛЬЯ... КАК РЕАЛИЗАЦИЯ ВЫБОРА СПОСОБА УПРАВЛЕНИЯ МНОГОКВАРТИРНЫМ ДОМОМ...

Методическое пособие по MathCad по учебной дисциплине «Математические пакеты программ»
Среднее профессиональное образование... Методическое пособие по MathCad по учебной дисциплине Математические пакеты программ Наименование специальности СПО Информационные системы по отраслям...

УЧЕБНО – МЕТОДИЧЕСКОЕ ПОСОБИЕ БЕЗОПАСНОСТЬ И ОХРАНА ОБЪЕКТОВ
УЧЕБНО МЕТОДИЧЕСКОЕ ПОСОБИЕ... БЕЗОПАСНОСТЬ И ОХРАНА ОБЪЕКТОВ Тактика и правовые основы частной охранной деятельности...

МЕТОДИЧЕСКИЕ РЕКОМЕНДАЦИИ на методическом совещании
Харьковский национальный медицинский университет... Кафедра стоматологии детского возраста детской челюстно лицевой хирургии и...

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

ТЕХНИЧЕСКОЕ ОБСЛУЖИВАНИЕ АВТОМОБИЛЕЙ Методическое пособие по курсовому проектированию
Вергазов М К... Мишкин Б И Попелышко А П...

МЕТОДИЧЕСКОЕ ПОСОБИЕ по учебной дисциплине «История»
МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ... ГАОУ СПО АЛЬМЕТЬЕВСКИЙ ПОЛИТЕХНИЧЕСКИЙ ТЕХНИКУМ...

Методические указания к семинарским занятиям Методические указания по самостоятельной работе Банк тестовых заданий в системе UniTest
ВСЕОБЩАЯ ИСТОРИЯ ИСКУССТВА... Учебная программадисциплины gt Курс лекций Методические... Лекция Основные понятия истории искусства ч...

0.035
Хотите получать на электронную почту самые свежие новости?
Education Insider Sample
Подпишитесь на Нашу рассылку
Наша политика приватности обеспечивает 100% безопасность и анонимность Ваших E-Mail
Реклама
Соответствующий теме материал
  • Похожее
  • По категориям
  • По работам