- •1. Архитектура Web-среды. Принципиальная схема работы. Назначение Web-сервиса и Web-браузера. Разновидности Web-сред
- •Понятия «Web-ресурс» и «Web-технология». Разновидности Web-ресурсов. Назначение и разновидности скриптов в Web-среде
- •2. Учебно-вычислительный Web-комплекс имэи игу
- •3. Понятие гипертекста. Структура элемента гипертекста
- •Назначение html и синтаксис
- •4. Гиперссылки html-документах
- •Диалоговые формы html как гиперссылки
- •5. Элементы управления html-формы. Общая характеристика
- •6. Элементы управления html-формы. Работа с текстом
- •Кнопки, флажки и списки на html-форме
- •Элементы управления для указания пары чисел, имени файла, скрытые поля
- •7. Простейшие визуальные элементы гипертекста. Понятие и роль текстового блока. Назначение рисунков и внедренных объектов
- •8. Структурные элементы гипертекста. Теги для описания списков и таблиц
- •9. Параметры оформления гипертекста. Общая характеристика
- •Разновидности значений и единицы измерений параметров оформления гипертекста
- •10. Таблицы стилей. Назначение, синтаксис, способы применения
- •11. Xml. Назначение и основные приложения. Синтаксис
- •12. Xml. Понятие dom
- •Контроль достоверности xml-документов
- •Преобразование xml-документов в текст
- •13. Vbse. Основные синтаксические единицы и их примеры
- •Разновидности лексем в vbse. Арифметические операторы
- •14. Разновидности лексем в vbse. Операторы сравнения и булевы операторы
- •15. Синтаксис vbse. Разновидности выражений и утверждений
- •Структура и исполнение vbse-скрипта
- •16. Vbse. Утверждения управления вычислительным процессом. Выполнение вычисленного кода
- •18. Данные в vbse. Понятие типа данных. Встроенные типы данных. Возможные действия с данными
- •19. Константы, поля и переменные. Назначение, описание и использование. Размещение данных в памяти
- •20. Массивы в vbse. Способы перебора элементов массивов. Динамические массивы
- •21. Подпрограммы в vbse. Описание и запуск подпрограмм. Способы передачи параметров. Подпрограммы в составе классов
- •22. Классы в vbse. Чд, методы и процедуры обработки событий, описание и применение свойств
- •23. Концепция клиентского скрипта в Web-среде
- •Объектная модель ie и доступ к ее элементам. Объект Body
- •24. Концепция и схема применения серверного asp-скрипта
- •Синтаксис и схема исполнения asp-скрипта
- •25. Назначение объектов Response, Request и Cookies. Примеры применения объектов Response и Request
9. Параметры оформления гипертекста. Общая характеристика
* Обеспечивают унификацию формирования визуального представления элемента гипертекста
* Примеры параметров – размер шрифта, указатель фоновой картинки, цвет и толщина рамки вокруг области, занимаемой объектом
* Количество параметров оформления – несколько сотен (!)
* Соглашения о возможных значениях параметров оформления многообразны и неочевидны
* Задаются двумя способами – либо специальными тегами и значениями атрибутов тегов, выделяющих часть HTML-документа, либо с помощью таблиц стилей
* Таблицы стилей считаются современным и прогрессивным способом реализации дизайнерских решений
Классификация параметров оформления
-
Шрифты и их характеристики
-
Фон и цвет линий, в том числе цвет контуров символов в тексте
-
Параметры оформления блока текста
-
Слои, из которых строится изображение в окне браузера
-
Выделенные области документа
-
Элементы документа, периодически изменяющие свое изображение
-
Авторские маркеры, нумерация абзацев и авторский стиль оформления текста
-
Выделение гиперссылок
Разновидности значений и единицы измерений параметров оформления гипертекста
I. Абсолютные:
* числовые и кодовые значения
* единицы измерения числовых значений – мм, см, дюймы (0,0254м), пункты (1/72 дюйма), цицеро (12 пунктов), твипы (1/1440 дюйма), пиксели (размер видимой точки, зависят от аппаратуры)
* кодовые значения – имя файла или ресурса, числовое представление двоичного кода, задающего цвет точки на экране дисплея
II. Именованные:
* не имеют единиц измерения. Перечень всех именованных значений для каждого параметра фиксирован
* bold – полужирный шрифт
* italic – курсив
* численные константы 100, 200 и т. п.
* inherit – наследованное значение
* em, ex и px – то же, что inherit для размера шрифта, высоты шрифта и пикселя соответственно
III. Относительные:
* указывает на коофициент изменения действующего абсолютно значения параметра, независимо от того, какое это было значение, как оно было установлено
* пример: 1.5 em, 150%, -8
Пример установки значений параметров тегами
<font size = 16> шрифт 16 </font> <br>
<font size = “-8”> -8 </font> <br>
<font size = “+8”> +8 </font>
10. Таблицы стилей. Назначение, синтаксис, способы применения
Основные понятия
Таблица стилей – комплект стилевых правил, каждое из которых задает перечень параметров оформления, их значения и области действия.
Применение таблиц стилей в составе HTML-документа унифицировано.
Общий вид и пример стилевого правила
Селектор {свойство-1: значение-1, …, свойство-n: значение-n}
STRONG {FONT-WEIGHT: BOLD, FONT-SIZE: 150%}
Внешние и внутренние таблицы стилей
Внешняя таблица стилей – Web-ресурс. Подключается к HTML-документу с помощью тега Link.
Внутренняя таблица стилей задается в составе HTML-документа, либо с помощью конструкции <style>…</style>, либо с помощью атрибута style.
Подключение внешней таблицы стилей
Задается тегом <Link rel = stylesheet href = “адрес”>
Type = “text/css”
Это делается в части head HTML-документа.
Внешние таблицы стилей применяются для корпоративных Web-ресурсов.
Подключение таблицы стилей атрибутом style
<p style = “margin-left: 0.5in;
margin-right: 0.5in;
font-style: italic”>
Текстовый блок </p>
Подключение таблицы стилей тегом style
<HEAD>
<STYLE TYPE = “text/css”>
DIV.Main {text-align: center;
background: green;}
SPAN.Light {background: white}
</STYLE>
…
</HEAD>
Таблицы. Селекторы
Типы селекторов
1. Теги
2. Классы
3. Идентификаторы
4. Псевдоклассы
* Селектор типа «тег»
Пример: STRONG{FONT-WEIGHT: BOLD;
FONT-SIZE: 150%}
* Селектор типа «класс»
Пример1: правило: p.abstract {margin-left: 0.5in; margin-right: 0.5in; font-style: italic}
область применения: <p class = “abstract”> </p>
Пример2: правило: fitalic {margin-left: 0.5in; margin-right: 0.5in; font-style: italic}
* Селектор типа «Идентификатор»
Правило: #.foo {color: red}
* Селекторы псевдоклассы:
– A: link – селектор гиперссылки, которая не была выбрана
– A: visited – селектор гиперссылки, которая была выбрана ранее
– A: active – селектор выбранной гиперссылки
– A: over – селектор гиперссылки, на которую указывает мышь