Заглавная страница
Избранные статьи
Случайная статья
Познавательные статьи
Новые добавления
Обратная связь

ТОП 10 на сайте

Приготовление дезинфицирующих растворов различной концентрации

Техника нижней прямой подачи мяча.

Франко-прусская война (причины и последствия)

Организация работы процедурного кабинета

Смысловое и механическое запоминание, их место и роль в усвоении знаний

Коммуникативные барьеры и пути их преодоления

Обработка изделий медицинского назначения многократного применения

Образцы текста публицистического стиля

Четыре типа изменения баланса

Задачи с ответами для Всероссийской олимпиады по праву

Мы поможем в написании ваших работ!

ЗНАЕТЕ ЛИ ВЫ?

Влияние общества на человека

Приготовление дезинфицирующих растворов различной концентрации

Практические работы по географии для 6 класса

Организация работы процедурного кабинета

Изменения в неживой природе осенью

Уборка процедурного кабинета

Сольфеджио. Все правила по сольфеджио

Балочные системы. Определение реакций опор и моментов защемления

Главная Избранные Случайная статья Познавательные Новые добавления Обратная связь FAQ

Свойства размещения блоков относительно других элементов страниц.

⇐ ПредыдущаяСтр 3 из 3

Clear – свойство определяет с какой стороны от текущей стороны элемента нельзя располагать другие элементы. None – нет запретов. Left, right, both – слева нельзя, справа, с обеих сторон относительно.

Display – видимость элемента. None – элемент невидим. Block, table – в виде блока, в виде таблицы относительно.

Visibility – видим либо невидим элемент. Visible, hidden – видим, невидим относительно.

Position – показывает положение элемента относительно других, расположенных на странице. Static – будет размещаться в том месте где он закодирован html-документом, relative – координаты будут отсчитываться от элемента, absolute – размещение элемента по координатам.

Свойство позиционирования

Чаще всего позиция задается отступами от границ родительского документа (относительная), либо от окна браузера (абсолютная).

Vertical-align: вертикальное выравнивание, относительно родительского документа. Baseline – элемент располагается на базовой линии родительского объекта, top, bottom, middle.

z-index: которое позволяет видеть 1 картинку перед другой. Auto – автоматическая расстановка, кто последний встретился тот ближе к вам, число – 0, самый низкий.

Cursor: auto – по умолчанию, pointer – рука с пальцем, crosshair – перекрестие, text – вертикальная палочка (как в тексте), wait – песочные часы, help – вопрос помощь, url – адрес картинки, которая будет использоваться в качестве курсора.

«Использование CSS на HTML-странице»

Четыре способа размещение таблиц стилей в веб-документе:

1. Связывание. Это ситуация, когда таблица стилей размещается в отдельном файле (файл.CSS). Преимущества: возможность использования одну таблицу стилей для нескольких страниц. Минимизация размера веб-страниц. Высшая безопасность (не главное, только теория). Как производится вставка таблицы: <head> <link rel=”styleSheet” type=”text/css href=”my.css”> </head>

2. Внедрение. Таблица стилей приводится в заголовочной части самого веб-документа. Рекомендуется: когда на сайте присутствует 1 страница с таким оформлением, либо когда надо выделить одну из страниц оформлением. <head> <style type=”text/css”> <!- … --> </style> </head>

3. Импортирование (комбинация 2-х выше названных). <head> <style=”text/css”> @import: my.css <!- … --> </style> </head>

4. Встраивание в тег. Когда какому-то конкретному элементу нужно сделать соответствующее оформление. <P style=”background – color = red …”> сами свойства взять в кавычки.

Степень приоритета определяется порядком размещения таблиц стилей на странице.

Механизм повышения веса правило (свойства): P {… Color: red! Important;}

Лекция №6

Тема: «Скрытый HTML»

Тэги заголовочной части

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

<title> … </title> - строка из 80 символов, эта строка является ссылкой для перехода на ваш документ в поисковой системе.

<base …> - позволяет задать базу для относительного задания адреса. Пример, <base href = “www. ….ru”> … <a href=”/img1.png”>

Режимы представления документа

В настоящее время есть место быть несоответствие языка на котором написана сама страница и языка который понимает браузер. Спецификация языка html (document type detinition). Для корректного отображения документа, нужно конкретно указать в тексте используемый язык написания этого документа. Режимы браузера: - «причудливый» (Quirks) – режим минимальной функциональности браузера, при котором возможности оформления страницы. – «стандартный» - «почти стандартный» - в принципе стандартный режим, но допускаются вольности в оформлении ячеек таблицы и вставляемых объектов.

В самом начале документа перед тэгом хтмл вставляются директива браузеру: <!doctype html (открыты ли данные)public либо system(не виден в сети) “-(документ не сертифицирован исо) // w3c(название организации) // dtd(тип документа) имя документа // EN(язык на котором написан документ)” “адрес документа” -->

Название документа (хтмл4) html 4.0 …

Размещение документа (хтмл4) http://www.w3c.org/tr/html4/strict.dtd

(хтмл5) <!doctype html>

Валидация документа HTML

Валидация – процедура проверки, вашего кода странички на соответствие используемой спецификации.

http://validator.w3c.org указать адрес, либо загрузить на сайт или копипаст.

Лекция №7

Тема: «Объектная модель документа».

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

DOM – это интерфейс прикладного программирования, через который взаимодействуют компоненты DHTML.

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

Все объекты выстраивают такую схему.

Иногда на схемах, объект HTML может опускаться. Но в любом случае все объекты являются потомками объекта DOCUMENT.

Имена классов DOM соответствуют именам тегов.

Модель дом предлагает 2 модели идентификации объектов:

1. Порядковый номер.

2. По уникальным именам. <P id=”имя”> необходимо в явном виде указать имя, с помощью которого будем обращаться к этому тэгу в рамках 1 документа. Name – в рамках 1 объекта.

Каждый объект характеризуется своим состоянием (совокупность значений полей этого объекта). Иногда в HTML состояние объекта описывается свойствами CSS. Обращение к свойству document.body.color = …

Каждый объект имеет поведение, поведение – есть совокупность методов, описывающих реакцию на какое-то событие.

Методы и свойства корневого объекта DOCUMENT:

Свойства:

· Cookie

· Domain полное имя сервера, на котором размещена данная страница

· URL узнать текущий адрес страницы

· Title можно узнать что находится в заголовочной части документа

· Forms массив ссылок на имеющиеся формы в документе

· Images массив ссылок на все имеющиеся картинки в документе

· Liuks массив ссылок на все ссылки

· Refer адрес, с которого был переход на текущую страницу

Методы:

· CreateElement (‘имя’) создание объекта

· getElementByID (‘имя’) получить ссылку на объекта по его айди

· getElementByTagName(‘имя тега’, номер) получить ссылку объекта по его имени

· alert(‘строка’) выводит строку на экран в окне оповещений

Вставка на страницу тэга P:

var elem = document createElement (‘P’);

elem.appendchield (“текст …”);

document.body.appendchield (elem);

События DOM:

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

Обработка события:

· действия «по умолчанию»

· всплывание событий (сообщение события получают все предки и каждый метод может запускать свой обработчик события)

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

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

События с точки зрения DOM

Программный объект, который создается браузером в момент какого-то происшествия, есть имя EVENT у него есть поля (type – тип события, target – цель) и методы (initevent () – производит генерацию объекта). Событие –как объект, проживает жизненный цикл.

ЖЦ события:

1. происшествие (запуск initevent)

2. создается event – создаются поля

3. инициализация обработчика источника (имя обработчика записывается в поле)

4. инициализация обработчика родителя

5. обработчик цели

6. событие генерирования, запуск

7. уничтожение

Тема: «Базовые понятия http://».

Протокол взаимодействия в сети интернет, хттп подразумевает до 2 участников взаимодействия клиента и сервера. Инициатор взаимодействия является клиент. Клиент формирует запрос и отправляет его серверу, это сообщение строго установленного формата. Сервер получил запрос от клиента, производит обработку запроса, по окончанию обработки отправляет ответ клиенту, клиент получает. После отправки сервером ответа клиенту, сеанс связи закрывается и сервер “забывает” про клиента.

Структура запроса серверу:

· Статусная строка

· Поля заголовка

· Пустая строка

· Тело запроса (может отсутствовать)

Статусная строка состоит 3 поля, которые разделены между собой пробелами, метод (способ воздействия на ресурс к которому обращается клиент [2 способа: GET,POST]), адрес ресурса (не только веб-страница, может быть аудио, видео и т.д.) и версия протокола хттп.

Метод GET предполагает получение большого вида информации в виде файла от сервера. если вдруг, ресурс на который ссылается запрос является каким то исполняемым файлом или скриптом, то клиенту отправляется не сам файл, а результат обработки на сервере.

Метод POST предполагает передачу информации серверу, передаваемый объем данных шифруется и передается в закрытом, защищенном виде. А в ответ клиент ничего не получает.

Поля:

Host – адрес сервера

Referrer - адрес ресурса

Accept – типы данных

Accept-language – языки клиента

Content-type – тип передаваемых данных

Content-length – число символов передаваемых данных

User-agent – сведения о браузере клиента

Структура ответа сервера:

· Статусная строка

· Поля заголовка

· Пустая строка

· Тело запроса (может отсутствовать)

Ответ формирует уже программист скрипта, статусная строка формируется автоматически сервером.

Статусная строка ответа состоит: версия протокола (на каком языке отвечает сервер), код результата и пояснение. Пример: http/1.0 404 not found. Работа сервера по обработки клиентов разделяются на 5 классов, и 1 цифра определяет класс результата.

Классы результатов:

1. Информационный класс (очень редкий, 100 – получена часть запроса)

2. Успешная обработка (200 – ОК, 201 – ОК и создали новый ресурс, 202 – обработка ресурса ведется, но очень долго)

3. Символизирующий перенаправление запроса (301 – указывалось несколько ресурсов сразу, 302 – ресурс перемещен, запрос перенаправлен)

4. Ошибка клиента (400 – в коде запроса была синтаксическая ошибка, 403 – полномочий не хватает (доступ запрещен данному клиенту к данному ресурсу), 404 – ресурс не найден, 405 – метод запроса не поддерживается)

5. Ошибка сервера (500 – сервер работает неправильно, 501 – функций сервера недостаточно, 503 – сервер временно недоступен, 505 – не поддерживается данная версия http)

Поля заголовка ответа:

· Server – имя и версия сервера

· Content – language – перечень языков необходимых у клиентов

· Content-type – тип данных ответа

· Content-length – длина ответа

· Last-modified – последняя модификация сервера

· Date – время генерации ответа сервером

· Expires – время и дата после которых ответ будет считаться устаревшим

Стандарт CGI: сервер по умолчанию, способен только на передачу данных в формате хтмл, либо других форматов файлов, никаких манипуляций с данными он не может проводить, необходимо запустить программу обработчик, она должна действовать по технологии CGI (интерфейс общего шлюза). Программа написана с учетом стандартов CGI на любом языке веб-программирования.

Создается папка на сервере CGI-bin (script) куда складываются все скрипты. Если не найден нужный скрипт, то запускается анализ расширения.

Получение аргументов для запуска скрипта. Размещение данных для запуска скрипта зависит от поля которое указано в заголовке запроса. Если используется метод GET в этом случае для запуска скрипта они доступны, если используется метод POST в этом случае нужно обратиться через стандартный поток ввода. Особенности вывода результатов: должны передать клиенту сообщение в формате html и протоколу http, необходимо строго помнить, что поля заголовка ответа формируются программистом. Сначала пишутся поля, затем пропускается строка, а потом только начинает запускаться наш документ. В поле ответа необходимо написать следующее: content-type:text/html

⇐ Предыдущая 1 23

Приготовление дезинфицирующих растворов различной концентрации

Занятость населения и рынок труда

Социальный статус семьи и её типология

Последнее изменение этой страницы: 2016-08-06; просмотров: 191; Нарушение авторского права страницы; Мы поможем в написании вашей работы!

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 18.216.121.55 (0.043 с.)