Образовательный портал Claw.ru
Всё для учебы, работы и отдыха
» Шпаргалки, рефераты, курсовые
» Сочинения и изложения
» Конспекты и лекции
» Энциклопедии

… - формирует строку таблицы.
3. Парный дескриптор - формирует ячейку внутри строки.
Пример:




Атрибуты дескриптора
:

* Атрибут WIDTH – определяет ширину таблицы (в процентах или пикселях).
Пример:

* Атрибут HEIGHT – высота (принимает такие же значения, как и атрибут WIDTH).
* Атрибут ALIGN – выравнивание таблицы по ширине относительно краев окна.
* Атрибут BORDER – определяет ширину рамки (если значение данного атрибута 0, то рамки отсутствуют).
* Атрибут bgcolor – для формирования фона таблицы с помощью цвета.
* Атрибут background - для формирования фона таблицы с помощью картинки.
* Атрибут cellpadding – для указания отступов от краев ячейки (в пикселях).
* Атрибут cellspacing – расстояние между ячейками.

Обычная таблица









* Атрибут bordercolor – цвет границ ячеек (рамки).

Атрибуты дескриптора :

1) Атрибут ALIGN – выравнивание текста в ячейках.
2) Атрибут VALIGN – определяет вертикальное выравнивание текста в ячейках.
Возможные значения атрибута VALIGN:
* =TOP – по верху.
* =MIDDLE – по центру.
* =BOTTOM – по нижнему краю ячейки.

3)Атрибут bgcolor – для указания фона строки.

Атрибуты дескриптора .
Дополнительно атрибуты:
* Атрибут COLSPAN – объединение ячеек, находящихся в одной строке. Значение атрибута равно количеству близлежащих ячеек находящихся в одной строке, которые будут объединены.
Пример:
:

* Атрибут ALIGN.
* Атрибут VALIGN.
* Атрибут bgcolor.
Вышеперечисленные атрибуты действуют так же, как для дескриптора







* Атрибут ROWSPAN – объединение ячеек, находящихся в одном столбце. Значение атрибута указывает количество близлежащих ячеек находящихся в одном столбце, которые будут объединены.
Пример:










1 2 4



Форматирование текстовых фрагментов HTML документа

Кроме ширины и высоты таблицы в целом можно регулировать ширину и высоту ячеек (то есть использовать такие же атрибуты в дескрипторе
, в пикселях и в процентах).
Если они не указаны, то браузер выравнивает размер ячейки по ширине текста.
Таблица является наиболее часто употребляемым инструментом в Web дизайне, позволяющим точно разместить на таблице отдельные мультимедийные элементы. Подобно спискам, таблицы могут быть вложены в другие таблицы.
Пример:









Чтобы добавить такую таблицу в контейнере дескриптора ячейки пишут следующее:






Фон отдельных ячеек могут отображать не все браузеры.


Размещение графических изображений в HTML документе

Для размещения изображений используются в основном два графических формата:
* JPG
* GIF

1.Формат JPG.
Плюсы - Графическое изображение, сохраненное в данном формате, имеют наименьший объем.
Минусы – при сохранении происходит довольно сильное сжатие картинки, а при сжатии изображение теряет качество и наблюдается эффект пикселизации.
Пример:
Картинка сжалась в девять раз.




Девять пикселей заменяются одним пикселем среднего цвета.

Изображение сохраняется в формате .jpg в том случае, если необходимо сохранить максимальное количество оттенков.

2.Формат GIF.
При сохранении картинок в этом формате также происходит сжатие, но пикселизации не происходит.
Минусы – изображение сохраняется с помощью ограниченного количества цветов (обычно 256 цветов) => изображение будет не очень красочным.

С помощью формата .gif сохраняются навигационные кнопки, навигационные графические элементы и фоновые изображения.

Для внедрения изображения используется одиночный дескриптор Claw.ru | Рефераты по информатике | Мировые информационные ресурсы.
* Атрибут SRC – основной атрибут. Он указывает путь и имя файла, в котором содержится графический элемент.
Пример:
Claw.ru | Рефераты по информатике | Мировые информационные ресурсы
* Атрибут WIDTH – ширина внедряемого изображения (в пикселях).
* Атрибут HEIGHT - высота внедряемого изображения (в пикселях).
* Атрибуты VSPACE, HSPACE – устанавливают отступ текста от внедряемого в HTML документ изображения.
* Атрибут BORDER – задает толщину рамки вокруг изображения.
* Атрибут ALT – задает альтернативный текст, который появляется в том месте, где должны быть картинки.
Пример:
ALT=”Здесь была картинка”.

Обычно атрибут используют при размещении навигационных изображений (ссылок), а так же при размещении изображений, о которых надо дать знать поисковой системе.

* Атрибут ALIGN – выравнивание.
Возможные значения:
=LEFT, CENTER, RIGHT.
Добавляются значения: =TOP, MIDDLE, BOTTOM.

* Если не используются атрибуты WIDTH, HEIGHT, то изображение внедряется оригинального размера.

Если используется только один атрибут, например HEIGHT, то браузер уменьшит или увеличит ширину пропорционально изображению.


Использование гипрессылок

Гипрессылка – это URL адрес того документа, который привязан к одному из элементов Web страницы (текстовому или графическому).
Для внедрения ссылок в HTML документ применяется парный дескриптор ….
Пример:

Все, что находится внутри контейнера, называется элемент привязки (текстовый фрагмент или графический элемент).

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

Пример привязки к изображению:

Claw.ru | Рефераты по информатике | Мировые информационные ресурсы

Изображение, к которому привязывается ссылка, называется навигационной картинкой (изображением).
В случае привязки к картинке ссылки вокруг картинки формируется рамка (чаще всего синего цвета). Чтобы ее убрать, необходимо указать:
Claw.ru | Рефераты по информатике | Мировые информационные ресурсы

Значением атрибута HREF может быть абсолютный адрес (URL адрес) или относительный адрес (имя файла, в котором хранится HTML документ, указываемый с помощью ссылки). Например, HREF=”1.htm”. Браузер будет искать данный документ в текущей папке, то есть в той, в которой находится активный документ.

Исключение составляет дескриптор

В случае использования данного дескриптора в заголовке HTML документа (то есть контейнера HEAD)относительные адреса (указанные в виде значений HREF) будут восприниматься браузером не относительно текущей папки, а относительно URL адреса, указанного в значении атрибута URL.

Использование дескриптора …
для указания отдельных элементов HTML документов.
1. Атрибут NAME используется для указания места, до которого необходимо пролистать
HTML документ.
Пример:



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

Для того чтобы с помощью ссылки адресоваться к якорю надо после URL адреса добавить # и указать имя якоря.

Пример:



Название якоря может формироваться без указания URL адреса HTML документа.

Пример:

Данный якорь будет искаться в текущей папке.

При использовании абсолютного адреса необходимо использовать аббревиатуру http (например, http://www.kirov.ru).


HTML форма

Форма (в документе HTML) – это средство, позволяющее организовать диалог пользователя и Web сайта.
Основные виды HTML форм:
1) Кнопки.
2) Списки.
3) Текстовые поля.
4) Переключатели (флажки).
5) Радиокнопки.

Элементы управления HTML форм позволяют пользователю вводить информацию с помощью браузера и отправлять её на обработку Web сайту.
Для обработки форм, заполненных пользователем, на Web сайте используется программа-обработчик. В ответ на данную форму эта программа формирует HTML код.

Группа дескрипторов, формирующих HTML форму.
1. Парный дескриптор - задает свойство формы и содержит в своем контейнере элементы этой формы.
Атрибуты:
* Атрибут NAME – для задания имя формы.
Например, NAME=”anketa”.
! Каждый элемент HTML формы, как и сама форма, должны быть обязательно поименованы.
* Атрибут METHOD – определяет, каким способом HTML форма будет отправляться к программе-обработчику.
Есть два варианта:
1)=POST – используется чаще всего.
2)=GET – используется для отправки HTML формы с помощью URL адреса.
(По умолчанию задается метод GET).
* Атрибут ACTION – задает местоположение программы-обработчика. Значением атрибута служит адрес (абсолютный или относительный).
Например,
ACTION=”executive.php” – файл, в котором хранится программа-обработчик.
Или ACTION=“mailto:a@kirov.ru” – пользовательская форма будет отсылаться по указанному электронному адресу.
* Атрибут ENCTYPE – тип кодировки.
Варианты:
=”text/htm/”
=”text/plain” – обычный текст без элементов форматирования.


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

1.Текстовые поля.
Бывают двух видов:
1) Многострочное. Парный дескриптор …
Атрибуты:
* Атрибут NAME.
* Атрибут ROWS – высота поля в строчках.
* Атрибут COLLS – ширина поля в символах.
Размещенный в контейнере дескриптора текст будет отображаться внутри этого текстового поля (по умолчанию).



2) Однострочное. Формируется с помощью одиночного дескриптора .
(Данный дескриптор также используется для переключателей, радиокнопок).
Атрибуты:
* Атрибут NAME.
* Атрибут TYPE – задает тип создаваемого элемента. Для создания однострочного поля значение атрибута TYPE=”Text”.
* Атрибут SIZE – ширина поля в символах.
* Атрибут MAXLENGTH – максимальная длина вводимого текста.
* Атрибут VALUE – используется для хранения значения элемента формы.
Пример:
Мы можем задать значение поля по умолчанию VALUE=”Например, пошел дождь”.



2.Переключатель или флажок.

Формируется с помощью дескриптора , атрибут TYPE которого принимает значение TYPE=”CHECKBOX”.

У данного дескриптора имеются также атрибуты:
* Атрибут NAME.
* Атрибут CHESKED – если он указан, то флажок будет установлен.

3.Радиокнопка.
(Выглядит как жирная точка).
Достигается с помощью двух дескрипторов , имеющих одинаковое имя. Например, NAME=”1”.






4.Текстовое поле типа пароль.

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



5.Кнопка.
*
Используется для вызова клиентских скриптов (сценариев).
Выглядит так:



* Кнопка созданная с помощью: предназначена для отправки формы на обработку в Web сайт.
Выглядит так:



* Кнопка сброса формы.
Предназначена для установления первоначального значения формы.

Выглядит так:



6.Списки выбора (меню) – это многоуровневая конструкция.
Парный дескриптор < SELECT >… (дескриптор первого уровня) формирует свойства меню.
Атрибуты:
* Атрибут NAME.
* Атрибут SIZE.
o Если данный атрибут равен единице, меньше единицы или не указан, то формируется выпадающее меню.
Выглядит так:


o Если SIZE больше единицы, то формируется прокручиваемый список.
Выглядит так:


Внутри контейнера дескриптора находятся элементы меню, которые формирует одиночный дескриптор (дескриптор второго уровня).
Пример:

Файл
Печать

Ширина меню определяется максимальным значением элемента меню.
* Атрибут MULTIPLE – для выбора нескольких разных опций.

Советы преподавателя:
1) Размещать каждый дескриптор с новой строки.
2) Перед большими конструкциями делать интервал.

HTML форма отсылается на обработку Web сайту в виде записей, которые выглядят следующим образом:
Имя элемента формы(Name) = значение(Value).

Для списков, переключателей, кнопок, радиокнопок обязательно задавать значение атрибута Value. В остальных случаях значение задает пользователь (во время ввода). В случае если при формировании элементов формы типа переключатель (флажок) атрибут Value не используется, в качестве значения будет формироваться предлог On.
Для списков таковым значением по умолчанию будет назначаться текст, расположенный сразу после дескриптора .
Если вы используете элемент Web формы для передачи информации Web сайту, при передаче формы на обработку должна появиться запись:
Имя элемента формы = его значение.


История создания Internet

Толчком к созданию сети Internet послужила холодная война.
Первые разработки по созданию глобальных компьютерных сетей были осуществлены американским агентством по созданию военных разработок DARPA (агентство было создано в 1957 году).

В 1965 году состоялся первый сеанс удаленной связи между компьютерами. Был выделен специальный проект по созданию сети ARPANET (прообраз сети Internet).

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

В 1972 году был запущен стандарт, регламентирующий основу транспортного протокола TCP.
В этом же году появились первые сервисы:
* TELNET (1972).
* FTP (1973).
С помощью этих сервисов пользователь получает удаленный доступ к командной строке сервера. Для передачи сообщений использовали командную строку. Для передачи электронной почты использовался протокол FTP.

В 1977 году появился стандарт на сервис электронной почты SMTP.

В 1983 году произошло официальное внедрение протокола TCP/IP.
В результате расширения сети было принято решение о передаче координации проекта ARPANET из обороны науке. И проект был переименован в NSFNET.

В середине 80-х к NSFNET подключились британская сеть, затем канадская, финская и другие.

В 1993 году к Internet присоединилась Россия, и был образован домен .ru

В 1991 году был создан сервис Gopher – прообраз Web сервиса.


Основные организационные структуры,
координирующие работу Internet

После выхода Internet за национальные рамки основная роль по управлению сетью была передана Всемирной общественной организации по назначению имен и чисел – ICANN.

Инженерная организация по развитию Internet – IETF.
Основная задача: Развитие старых и создание новых сетевых стандартов.

Развитием Web стандартов занимается W3C.
IOSC – интернет сообщество. Основная задача – развитие содержательной части, правовые вопросы.

РСИЦ – региональный сетевой информационный центр (в России). Этот центр занимается разработками, опираясь на стандарты четырех вышеперечисленных организаций.
В каждой стране есть такой центр.


Листы каскадных стилей или CSS

CSS – это набор правил для оформления и форматирования различных элементов HTML документов.

Правила подключения стиля к конкретному HTML документу:
1) С помощью одиночного дескриптора .

MEDIA – среда, в которой будут работать стили.
При задании значения атрибуту MEDIA правила будут действовать только при выводе страниц на:
MEDIA=”PRINT” – печать.
MEDIA=”SCREEN” – экран.

2) При помощи парного дескриптора .
В контейнере дескриптора располагаются правила, определяющие свойства отдельных элементов страницы.

3) Определение стиля непосредственно внутри элемента страницы.

.

4) Использование пользовательских стилей (то есть с помощью настроек браузера).


Правила описания стилей

Правила описания стилей - это команды, определяющие свойства HTML документов (цвет, выравнивание). Набор свойств, доступный через CSS гораздо больше, чем стандартный HTML набор.

Синтаксис:
P {text-align:right; color:red}, где
P – класс HTML документов, которые будут подвергаться форматированию (то есть к которым будет применяться стиль).
Набор таких правил у нас может храниться в отдельном файле, могут находиться в контейнере дескриптора .
Например,


P.krass{color:red} – все параграфы класса krass будут красного цвета.



P:first-letter {color:red; font-size:300%; float:left}, где first-letter – имя псевдонима. (Здесь первая буква).
P.krass:first-letter



A:visited {color:red; font-size:300%; float:left}
A:active
first-line

Псевдокласс – это множество HTML элементов, описываемых непосредственно спецификацией CSS.
#111{color:red} ,где #111 –идентификатор элемента.


Атрибут ID служит для присваивания идентификатора элементу.

Пример:
Claw.ru | Рефераты по информатике | Мировые информационные ресурсы

Так можно накладывать элементы друг на друга:
#111{top:10; left:100; width:100; height:200; width:100; height:200; z-index:2}
Координата z определяет место (порядок) элемента.

Каскадный приоритет – это порядок, в котором правила, определяющие конкретные стили будут применяться.
1) На первом месте правила, определенные атрибутом STYLE.
2) Правила, определяемые с помощью стилей.
Например, P.1{…}.
3) Правила, определяющие стили для дескрипторов определенного типа.
Например, P {text-align:right; color:red}

Подключение стилей с помощью дескриптора является более важным, чем подключение стилей с помощью дескриптора LINE.
Чтобы придать акцент (приоритет) определенному правилу используется important.
Пример:
P {text-align:right !important}- искусственное изменение приоритета.

4) На последнем месте каскадного приоритета (то есть наименьшие по важности) правила определения стилей указываемых пользователем с помощью браузера.

P, H1, DIV {…} – эта конструкция используется для одновременного присвоения свойств сразу нескольким классам.


XML - расширяемый язык разметки

Расширяемый язык разметки XML предназначен для описания внутренней логической структуры документа.
информация
В качестве команд языка HML используются элементы. Элемент начинается так же, как и дескриптор:
содержимое элемента
!Элемент всегда заканчивается закрывающимся тэгом. Одиночных элементов (как в HTML) не бывает.
При указании элементов могут использоваться атрибуты (свойства) элемента. В отличие от атрибута HTML, значения атрибутов обязательно должны заключаться в кавычки.

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



МИР
Выдрин А.Л.

Информация
< TEMA >Структура Интернета
… … …




Основное свойство HML – его расширяемость. Создатель документа может использовать для обозначения элементов любые названия, определяющие смысл элемента одинаково для него и пользователя.

Для определения смысла отдельных элементов HML документа используются специальные конструкции DTD – определители типа документов, которые определяют не только логический смысл элемента (дают комментарии по поводу описания использования элемента), но и жестко определяют структуру элемента.
Синтаксис данных определителей типа документов достаточно сложен и напоминает отдельный язык разметки (или язык программирования).
! Синтаксис достаточно строг. Нельзя делать ошибки.
DTD используются так же, как эталоны для проверки правильности XML документов.
Для задания внешнего представления XML документа используются стили. Основная нагрузка XML документа – содержание.



Классификация Web ресурсов

Навигационные сайты
Конечные (или функциональные) сайты
Информационные
(тематические)
сайты
Корпоративные
сайтыКаталоги
Поисковые
системы
Сайты
электронной
коммерции
Сайты, являющиеся
Web интерфейсами
сетей Internet
Порталы

Навигационные сайты – перенаправляют пользователей к конечным сайтам (указующая и направляющая роль). Например, порталы Яндекс, Кирилл и Мифодий и прочие.

Портал – это Web сайт, сочетающий в себе функции навигационного сайта и информационного ресурса по различным темам.

Конечный (функциональный) сайт – это сайты или ресурсы, которые содержат информацию или документы, ради которых пользователи приходят в глобальные сети (Internet).

Информационные сайты - обеспечивают доступ пользователей к документам определенной тематики.

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

Web интерфейс – это сайты, которые через стандартные HTML страницы (Web страницы) предоставляют доступ к сервисам Internet (электронной почты, телеконференций и другим).
Роль последней группы сайтов очень велика.


Семинарские занятия

1) Знакомство с Internet (чтение учебника). Подключится к серверу.
2) Создание учетных записей. Создание оригинального сообщения.
3) Получить ваше сообщение. Создать правила для сообщений почты в отношении названных вами сообщений.
4) Получить ваше сообщение, создать ответ и отправить сообщение. Перенаправить ваше сообщение вам и еще кому-нибудь, присоединив к нему файл.
5) Подписаться на группу новостей.
6) Создание запросов. Найти в документах данные вами слова и фразы.
7) Создать HTML документ. В заголовке использовать дескрипторы , (с атрибутами http-equiv, name, content). В теле опробовать действие атрибутов bgcolor, background, text, link, vlink, alink, topmargin, leftmargin.
8) Форматирование текста. Создать HTML документ. Скопировать текст. Попробовать действие дескрипторов ,,
, , ,

(с атрибутом align), заголовка от до (с тем же атрибутом), (с атрибутами align, color, width, size, noshade),< font> (атрибут face, color, size),< basefont> (атрибуты как у font), (в его контейнере создать таблицу стандартными средствами форматирования), , .
9) Форматирование текста. Создать HTML документ. Скопировать текст. Попробовать действие дескрипторов , , , , . Отобразить символы символов < (левая скобка), > (правая скобка), © (значок авторского права), ° (значок температуры),   (жесткий пробел).
10) Сложное форматирование. Создать HTML документ. Создать нумерованный и маркерный списки. То есть попробовать действие дескрипторов (атрибуты type, start), , (атрибут type). Создать многоуровневый список.
11) Сложное форматирование. Создать нарисованную на доске таблицу. Поменять ее размеры, ширину рамки, фон, расстояние между ячейками, цвет ячеек и их границ, выравнивание в ячейках. Попробовать создать таблицу в ячейке данной таблицы.
12) Внедрение графического изображения. Создать HTML документ. Скопировать текст. В тексте поместить картинки, как показано на доске. Использовать дескриптор Claw.ru | Рефераты по информатике | Мировые информационные ресурсы (атрибуты src, width, height, hspace, vspace, border, align, alt).
13) Создание ссылок. Создать три HTML документа. Связать их между собой с помощью ссылок, предусмотреть возможность перемещения обратно. Используем дескриптор атрибуты href, name.
14) Скачать с компьютера преподавателя картинки и расположить их так, чтобы получился лабиринт (смотри на доску).
15) HTML форма. Проверить действие дескрипторов (атрибуты name, method, action, enctype), (атрибуты name, rows, colls), (атрибут name, и всевозможные значения атрибута type с соответствующими каждому элементу формы возможными атрибутами), (атрибуты name, size, option)
16) HTML форма. Создать изображенную на доске форму заказа, заполнить ее и отправить ее на обработку в Web сайт. Проверить соответствие HTML кода и данных формы.
17) Листы каскадных стилей. Создать HTML документ. В него скопировать текст и поместить два рисунка (один на другой). Подключить стили всеми возможными способами. Поменять приоритет стилей.
18) Листы каскадных стилей. Создать HTML документ. В него скопировать текст создать правила, указанные на доске. Подключить стили. Поменять приоритет стилей.
19)XML. Создать XML документ, описывающий структуру HTML документа.




Скачали данный реферат: Гала, Vicin, Drokov, Милехин, Akim, Харзин, Алексий.
Последние просмотренные рефераты на тему: шпаргалка егэ, конспект речь, банк рефератов бесплатно, реферат лист.



Категории:




1


Поделитесь этой записью или добавьте в закладки

   



Рефераты от А до Я


Полезные заметки

  •