К контейнерным тэгам относятся:
Контрольная работа №1 по теме «Язык гипертекстовой разметки HTML»
ФИО___________________________ Класс_____________ Дата__________
Вариант 1
За что отвечает тег <HTML>HTML>? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой параметр тега <font> отвечает за размер текста? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой тег отвечает за вставку таблицы? (1 балл)
__________________________________________________________________________________________________________________________________________________
Напишите отрывок кода HTML, вставляющий картинку 1.jpg с высотой 350 пикселей, шириной 500 пикселей, с всплывающим описанием картинки «Моя картинка» и с рамкой в 2 пикселя. (2 балла)
__________________________________________________________________________________________________________________________________________________
Напишите код данной таблицы (2 балла):
Критерии оценивания: «5» - 6-7 баллов, «4» - 4-5 баллов, «3» - 2-3 балла, «2» - 0-1 балл.
Контрольная работа №1 по теме «Язык гипертекстовой разметки HTML»
ФИО___________________________ Класс_____________ Дата__________
Вариант 2
За что отвечает тег <title> title >? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой параметр тега <font> отвечает за шрифт текста? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой тег отвечает за вставку картинки? (1 балл)
__________________________________________________________________________________________________________________________________________________
Напишите отрывок кода HTML, вставляющий картинку 2.gif с высотой 300 пикселей, шириной 450 пикселей, с всплывающим описанием картинки «Мое фото» и с рамкой в 1 пиксель. (2 балла)
__________________________________________________________________________________________________________________________________________________
Напишите код данной таблицы (2 балла):
Критерии оценивания: «5» - 6-7 баллов, «4» - 4-5 баллов, «3» - 2-3 балла, «2» - 0-1 балл.
Контрольная работа №1 по теме «Язык гипертекстовой разметки HTML»
ФИО___________________________ Класс_____________ Дата__________
Вариант 3
За что отвечает тег <body>body>? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой параметр тега <font> отвечает за цвет текста? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой тег отвечает за вставку ссылки? (1 балл)
__________________________________________________________________________________________________________________________________________________
Напишите отрывок кода HTML, вставляющий картинку 3.bmp с высотой 400 пикселей, шириной 550 пикселей, с всплывающим описанием картинки «Мой рисунок» и с рамкой в 3 пикселя. (2 балла)
__________________________________________________________________________________________________________________________________________________
Напишите код данной таблицы (2 балла):
Критерии оценивания: «5» - 6-7 баллов, «4» - 4-5 баллов, «3» - 2-3 балла, «2» - 0-1 балл.
Ответы
№
Вариант 1
Вариант 2
Вариант 3
1
Тэг <HTML>HTML> определяет язык, на котором исполнен код страницы
Тэг <title>title> отвечает за заголовок окна HTML-документа
Тэг <body>body> - это тело HTML-документа.
2
Size
Face
Color
3
4
Моя картинка' border='2'>
Мое фото' border='1'>
Мой рисунок' border='3'>
1 2 3 4 5 6 7 8 1 2 3 4 5 6 7 8 9 1 2
34 5 6 7 8
botana.cc
Контрольная работа по теме «Язык гипертекстовой разметки HTML»
ФИО___________________________ Класс_____________ Дата__________
Вариант 1
За что отвечает тег <HTML>HTML>? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой параметр тега <font> отвечает за размер текста? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой тег отвечает за вставку таблицы? (1 балл)
__________________________________________________________________________________________________________________________________________________
Напишите отрывок кода HTML, вставляющий картинку 1.jpg с высотой 350 пикселей, шириной 500 пикселей, с всплывающим описанием картинки «Моя картинка» и с рамкой в 2 пикселя. (2 балла)
__________________________________________________________________________________________________________________________________________________
Напишите код данной таблицы (2 балла):
2
3
4
5
6
7
8
Критерии оценивания: «9-10» - 6-7 баллов, «7-8» - 4-5 баллов, «5-6» - 2-3 балла, «3-4» - 0-1 балл.
Контрольная работа по теме «Язык гипертекстовой разметки HTML»
ФИО___________________________ Класс_____________ Дата__________
Вариант 2
За что отвечает тег <title> title >? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой параметр тега <font> отвечает за шрифт текста? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой тег отвечает за вставку картинки? (1 балл)
__________________________________________________________________________________________________________________________________________________
Напишите отрывок кода HTML, вставляющий картинку 2.gif с высотой 300 пикселей, шириной 450 пикселей, с всплывающим описанием картинки «Мое фото» и с рамкой в 1 пиксель. (2 балла)
__________________________________________________________________________________________________________________________________________________
Напишите код данной таблицы (2 балла):
2
3
4
5
6
7
8
9
Критерии оценивания: «9-10» - 6-7 баллов, «7-8» - 4-5 баллов, «5-6» - 2-3 балла, «3-4» - 0-1 балл.
Контрольная работа по теме «Язык гипертекстовой разметки HTML»
ФИО___________________________ Класс_____________ Дата__________
Вариант 3
За что отвечает тег <body>body>? (1 балл)
__________________________________________________________________________________________________________________________________________________
Какой параметр тега <font> отвечает за цвет текста? (1 балл)
__________________________________________________________________________________________________________________________________________________
infourok.ru
Контрольная работа «Основы web-конструирования»
Цель: проверить уровень усвоения материала по теме «Основы web-конструирования».
Контрольная работа состоит из двух частей: теоретической части и практической части. Вся контрольная работа разбита на пять уровней сложности. Первые три уровня составляют теоретическую часть контрольной работы и оцениваются в 12 баллов. На выполнение данной части отводится 10 минут. Четвертый и пятый уровни сложности - это практическая часть контрольной работы. Она оценивается в 18 баллов. Учащиеся работают над созданием фрагмента сайта по заданному образцу. Создание фрагмента сайта выполняется в программе MS FrontPage.
Шкала выставления отметки
Отметка | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |
Кол-во баллов | 1 | 2 | 3-4 | 5-7 | 8-10 | 11-14 | 15-19 | 20-24 | 25-28 | 29-30 |
Контрольная работа
Основы WEB-конструирования
Вариант 1
Теоретическая часть
1 уровень (2 балла)
1.Установите соответствие между понятиями и определениями:
1)Статическая страница | А) размещение сайта на сервере или локальном компьютере с возможностью вызова из сети. |
2) Мета-тег | Б) отображается браузером пользователя в том виде, в каком была создана и размещена на веб-сервере. |
3) Публикация | В) имеет название (имя) и определенное значение, которое записывается в кавычках после знака «равно». |
4) Атрибут | Г) содержит служебную информацию для браузера и поисковых систем. |
2 уровень (4 балла)
2.Вставьте недостающее слово:
…методы позволяют производить работы по созданию веб-страниц с высокой степенью автоматизации.
3 уровень (6 баллов)
3. Укажите правильный вариант ответа:
1. HTML (HYPER TEXT MARKUP LANGUAGE) является:
2. Программа для создания Web-страницы с использованием языка HTML:
3. Программа для просмотра гипертекстовых страниц называется:
4. Какие тэги указывают браузеру, что это HTML документ?
6. Какие тэги помещают название документа в оглавление программы просмотра web-страниц?
Практическая часть
4 уровень (8 баллов)
4.Используя редактор FrontPage, создайте фрагмент веб-сайта (1 страница главная,
4 страницы второго уровня). Использовать таблицы для размещения информации. Размер главной страницы 600 х 500 пикселей.
5 уровень (10 баллов)
5.Продумайте систему навигации по сайту и создайте необходимые гиперссылки на текст и графику. Добавьте на главную страницу бегущую строку.
Контрольная работа
Основы WEB-конструирования
Вариант 2
Теоретическая часть
1 уровень (2 балла)
1.Установите соответствие между понятиями и определениями:
1)Тег | А) метка языка HTML. |
2) Гиперссылка | Б) генерируется по запросу пользователя (с загрузкой информации серверными программами из баз данных). |
3) Динамическая станица | В) уменьшение размера файла изображения с минимальными потерями качества. |
4)Оптимизация | Г) может указывать не только на отдельные документы, но и на защитные места в документе. |
2 уровень (4 балла)
2.Вставьте недостающее слово:
…- специально разработанный набор элементов оформления и цветовых схем документа.
3 уровень (6 баллов)
3. Укажите правильный вариант ответа:
1. Гипертекст - это:
4.Инструкция браузеру, указывающая способ отображения текста:
5.Web-страница (документ HTML) представляет собой:
Практическая часть
4 уровень (8 баллов)4.Используя редактор FrontPage, создайте фрагмент веб-сайта (1 страница главная,4 страницы второго уровня). Использовать таблицы для размещения информации.Размер главной страницы 600 х 500 пикселей.
5 уровень (10 баллов)
5.Продумайте систему навигации по сайту и создайте необходимые гиперссылки на текст и графику. Добавьте на главную страницу бегущую строку.
xn--j1ahfl.xn--p1ai
Автор публикации: Епифанова Т.Н.
Дата публикации: 2016-05-07
Краткое описание: ...
I вариант
Создать Web-страницу, содержащую следующие элементы
Название страницыТаблица на 2 колонки, ширина рамки – 1, ширина таблицы 80%, содержимое – нумерованный список и подходящее по теме изображение.
Нумерованный список:
Файловые вирусы
Макровирусы.
Сетевые вирусы
ARIAL
B
BLUE
BODY
BR
CENTER
COLOR
FACE
FONT
GREEN
h2
HEAD
HR
HREF
HTML
I
LEFT
LI
OL
P
RED
RIGHT
SIZE
SRC
TITLE
U
UL
WIDTH
HEIGHT
II вариант
Создать Web-страницу, содержащую следующие элементы
Таблица на 3 колонки, ширина рамки – 1, ширина таблицы 80%, содержимое – текст, маркированный список и подходящее по теме изображение.
Маркированный список:
Внешний диск
ЖД
…
Для долговременного хранения информации используется долговременная (внешняя) память. Информация хранится на носителях (магнитных, оптических, картах памяти).
ARIAL
B
BLUE
BODY
BR
CENTER
COLOR
FACE
FONT
GREEN
h2
HEAD
HR
HREF
HTML
I
LEFT
LI
OL
P
RED
RIGHT
SIZE
SRC
TITLE
U
UL
WIDTH
HEIGHT
III вариант
Создать Web-страницу, содержащую следующие элементы
Таблица на 2 колонки, ширина рамки – 1, ширина таблицы 90%, содержимое – маркированный список и подходящее по теме изображение.
Маркированный список:
Текстовые редакторы.
Графические редакторы.
Электронные таблицы.
СУБД.
ARIAL
B
BLUE
BODY
BR
CENTER
COLOR
FACE
FONT
GREEN
h2
HEAD
HR
HREF
HTML
I
LEFT
LI
OL
P
RED
RIGHT
SIZE
SRC
TITLE
U
UL
WIDTH
HEIGHT
III вариант
Создать Web-страницу, содержащую следующие элементы
Таблица на 2 колонки, ширина рамки – 1, ширина таблицы 90%, содержимое – маркированный список и подходящее по теме изображение.
Маркированный список:
Текстовые редакторы.
Графические редакторы.
Электронные таблицы.
СУБД.
ARIAL
B
BLUE
BODY
BR
CENTER
COLOR
FACE
FONT
GREEN
h2
HEAD
HR
HREF
HTML
I
LEFT
LI
OL
P
RED
RIGHT
SIZE
SRC
TITLE
U
UL
WIDTH
HEIGHT
Читать полностью »docbaza.ru
Тема урока: Контрольная работа по теме «Создание Web-страниц»
Цели и задачи урока:
Образовательная: проверка знаний, умений и навыков работы с основными принципами создания WEB-страниц и командами оформления текста; создания простейших WEB-страниц
Развивающая: коммуникативно-технические умения; расширение кругозора, умение создавать Web-страницы с использованием таблиц
Воспитательная: самостоятельность, ответственность, добросовестное отношение к труду, информационная культура
Оборудование: ПК или ноутбук с ОС Windows XP/Vista/SP3, текстовый редактор Блокнот, браузер Internet Explorer, конспект.
Тип урока: урок закрепления знаний, умений и навыков
Здравствуйте! Садитесь. Сегодня, как уже объявлялось на прошлом уроке, будет проверочная работа по предыдущим темам. Проверочная работа будет состоять из двух частей: написания теста и работы за компьютером. Ребята, попадающие в первую половину списка класса, будут писать тест, а те, кто во вторую – делать задания на компьютере. Как только сделаете задания на компьютере, подзывайте меня, я буду оценивать проделанную вами работу. Через 22 минуты поменяетесь местами. Итак, рассаживайтесь на свои места и приступайте к работе.
Через 22 минуты работа учеников, сидящих за компьютерами оценивается учителем, и ученики меняются местами. Учитель собирает тесты.
До свидания.
Тест на тему: «Создание WEB-страниц»
Замечание: в вопросах 1-17 выберите один правильный ответ
HTML – это:
язык разметки гипертекста
гипертекстовый редактор
страница Internet Explorer
браузер
Тэг – это:
Контейнер
Команда, заключенная в угловые скобки
Гиперссылка
Указатель ссылки
Заголовок WEB-страницы заключается в контейнер:
Основное содержание страницы помещается в контейнер:
Контейнер
предназначен для:Разделения текста на абзацы
Форматирования шрифта любого фрагмента текста
Разделения текста на заголовки
Определения URL-адреса программы, расположенной на WEB-сервере
Набор веб-страниц, связанных между собой перекрестными ссылками, расположенный под одним общим корневым именем, называется … :
Тегом
Контейнером
Электронным учебником
Сайтом
Web-страница (документ HTML) представляет собой:
Текстовый файл с расширением txt или doc
Текстовый файл с расширением htm или html
Двоичный файл с расширением com или exe
Графический файл с расширением gif или jpg
Для просмотра Web-страниц в Интернете используются программы:
MicroSoft Word или Word Pad
MicroSoft Access или MicroSoft Works
Internet Explorer или NetScape Navigator
HTMLPad или Front Page
Для вставки изображения в документ HTML используется команда:
Гиперссылка задается тегом:
текст
Гиперссылки на Web - странице могут обеспечить переход...
только в пределах данной web - страницы
только на web - страницы данного сервера
на любую web - страницу данного региона
на любую web - страницу любого сервера Интернет
Ссылка на адрес электронной почты задается тегом:
kompas@email.ru
текст
текст
Гипертекст - это:
Текст очень большого размера
Текст, в котором используется шрифт большого размера
Структурированный текст, где возможны переходы по выделенным меткам
Текст, в который вставлены объекты с большим объемом информации
Для создания Web-страниц используются программы:
MS FrontPage и Блокнот
Turbo Pascal и QBasic
Visual Basic и ACDSee
ScanDisk и Defrag
… используются для разбивки окна браузера на несколько областей, каждая из которых представляет собой отдельный HTML-документ:
линии
контейнеры
гиперссылки
фреймы
Элемент для создания и использования гипертекстовых ссылок:
…
…
…
…
Для выравнивания текста в документе используется атрибут:
align
valign
src
text
Замечание: в вопросах 18-20 выберите несколько правильных ответов
Тэги могут быть:
Закрывающими
Главными
Автономными
Одиночными
Парными
Авторитетными
В теле документа body> могут использоваться следующие элементы:
li> li>
Оценка выполнения теста:
«5» - 80-100% (16-20 правильных ответов)
«4» - 60-79% (12-15 правильных ответов)
«3» - 40-59% (8-11 правильных ответов)
Менее 40% (менее 8 правильных ответов) оценивается на «2».
Задания для практической работы за компьютером:
Задание 1. Оценивается на оценку «3».
Создать страницу, подобную той, которая показана на рис. 1. Цвет фона #66CCFF, цвет шрифта #0000FF.
рис. 1.
Задание 2. Оценивается на оценку «4».
Создать страницу, подобную той, которая показана на рис. 2. Цвет фона #66CCFF, цвет шрифта #0000FF, размер рисунка 80x80, текст, описывающий картинку «рисунок».
рис. 2.
Задание 3. Оценивается на оценку «5».
Создать две страницы (index1.htm и index2.htm), подобные тем, которые показаны на рис. 3. На странице index1.htm цвет фона #66CCFF, цвет шрифта #0000FF, размер рисунка 80x80 (причем рисунок является ссылкой на страницу index2.htm), текст, описывающий картинку «Ссылка». На странице index2.htm цвет фона #0000FF, цвет шрифта #66CCFF.
рис. 3.
© Хисматуллина Айсылу Фазегатовна, 2014
doc4web.ru
_______________________________________________________________________________
Указания по созданию сайта «Виртуальный зоопарк»
Вам необходимо создать сайт, состоящий из 7 страниц, имеющий следующую структуру:
Порядок выполнения:
Создать на локальном диске D папку, где будут храниться созданные странички, материалы для сайта.
Создадим первую страницу нашего сайта – index.html. Для этого открыть Блокнот, набрать следующий код:
<html>
<head>
<title>Виртуальный зоопарк</title>
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000D0">
<table border="3" bordercolorlight="#00CC30" bordercolordark="#00CC30" align="center">
<tr>
<td bgcolor="#CCFFCC" colspan="3" height="125">
<div align="center">
<h2> <font color="#00CC33">В</font><font color="#FF0033">И</font><font color="#CCCC00">Р</font><font color="#0099FF">Т</font><font color="#FF00FF">У</font><font color="#00CC30">А</font><font color="#FF0030">Л</font><font color="#CCCC00">Ь</font><font color="#0098FF">Н</font><font color="#FF00FF">Ы</font><font color="#00CC30">Й</font>
<font color="#FF0030">З</font><font color="#D0CC00">О</font><font color="#0098FF">О</font><font color="#FF00FF">П</font><font color="#00CC30">А</font><font color="#FF0030">Р</font><font color="#D0CC00">К</font>
</h2>
<p><font color="#336633">Знаете ли вы, что <i><b>слон - ловок и осторожен</b></i>,
домашний <i><b>верблюд - коварен</b></i> и может сыграть с вами злую
шутку, а <i><b>у медведя есть тайное имя</b></i> ? Если нет, то вы хорошо
проведете у нас время. Здесь есть фотографии и шутливые рисунки, интересные
факты и анекдоты из жизни "братьев наших меньших ".</font> </p>
</div>
</td>
</tr>
<tr>
<td bgcolor="#CCFFCC" align="center" height="13">
<a href="camel.htm">ВЕРБЛЮД</a>
</td>
<td bgcolor="#99CC66" align="center" height="13">
<a href="bear.htm">МЕДВЕДЬ</a><font color="#306830"> </font>
</td>
<td bgcolor="#CCFFCC" align="center" height="13">
<a href="elephant.htm">СЛОН</a>
</td>
</tr>
</table>
</body>
</html>
Сохранить полученный документ под именем index.html в созданной папке (файл-сохранить как-имя файла - index.html - тип файла – все файлы)
Просмотреть полученную страничку.
Изменить цвет фона на любой другой, изменить цвет букв надписи ВИРТУАЛЬНЫЙ ЗООПАРК.
Создадим вторую страничку – camel.html (страничка про верблюда). Для этого откроем новый блокнот и наберём следующий код:
<html>
<head>
<title>Верблюд</title>
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000D0" background="fon.png">
<h2 align="center"><font color="#999900">ВЕРБЛЮД</font></h2>
<p align="left"><font color="#336633"> <img src="camel_foto.gif" width="183" align="left" alt="Фотография верблюда">Гордый
<a href="camel_shutka.htm">верблюд</a>, настолько гордый, что готов оплевать
любого, кто рискнет его унизить. А плевочек у него не маленький - с полведра.
Так что советуем не испытывать его терпения. Рост у него тоже хороший
- около 3,6 м. Этим, с выгодой для себя, пользуются египетские погонщики
верблюдов, предлагающие туристам сфотографироваться на экзотическом животном.
Как только турист садится на "корабль пустыни", тот сразу встает. Немногие
рискуют спрыгнуть с такой высоты - приходится раскошеливаться... </font></p>
<font color="#336633">[ </font><a href="index.htm#metka">К началу</a>
<font color="#336633">]</font> </p>
<p> </p>
</body>
</html>
Скопировать в Вашу папку рисунки, на которые идут ссылки в данном коде, с сервера (сетевое окружение – отобразить компьютеры рабочей группы – SERVER – зоопарк). В противном случае ни один рисунок не отобразится!!! Сохранить аналогично первой странице.
Создадим 3 страницу – шутка про верблюда.
В блокноте набираем
<html>
<head>
<title>Шутка про верблюда</title>
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000D0" background ="fon.png">
<h2 align="center"><font color="#999900">Шутка про верблюда</font></h2>
<p align="center"><img src="camel_ris.gif" height="169" alt="Рисунок верблюда"></p>
<p align="left"><font color="#336633">Идет экскурсия в музее. Экскурсовод
останавливается перед картиной: - Перед вами картина "Семь верблюдов".
Первый верблюд смотрит вдаль. Второй верблюд смотрит в затылок первому,
третий верблюд смотрит в затылок второму, четвертый верблюд смотрит в
затылок третьему, пятый верблюд смотрит в затылок четвертому, шестой верблюд
смотрит в затылок пятому, седьмой верблюд смотрит в затылок шестому. Шестой
верблюд смотрит в затылок пятому, пятый верблюд смотрит в затылок четвертому,
четвертый смотрит в затылок третьему, третий смотрит в затылок второму,
второй смотрит в затылок первому, первый верблюд смотрит вдаль... А теперь
переходим к картине "33 богатыря"... </font></p>
<font color="#336633">[ <a href="camel.htm#metka">Назад</a> ] [ </font><a href="index.htm#metka">К
началу</a> <font color="#336633">]</font> </p>
<p> </p>
</body>
</html>
Сохраняем под именем camel_shutka.html.
Создать аналогичным образом ещё 4 страницы, указанные в структуре. Тексты для страниц находятся в файле Zoo.txt. Внимательно следите за правильностью написания ссылок, адресов, тэгов.
Сдать работу преподавателю. Желаю Вам успехов!
Административная контрольная работа по теме «Язык HTML».
Вариант 1.
1. Расширение для файлов, содержащих html-документ.
2. Что такое атрибут?
3. Элемент, определяющий тело документа.
4. Атрибут элемента <body>, задающий цвет фона
5. Атрибут элемента <body>, задающий цвет непосещённых гиперссылок
6. Заголовок 1-го уровня указывается тэгом…
7. Курсив задаётся тэгом…
8. Для задания названия шрифта (например, ARIAL) используется атрибут … элемента …
9. Переход на следующую строку при форматировании текста осуществляется с помощью элемента…
10. Выравнивание абзаца по левому краю осуществляется с помощью следующего кода:
11. Для задания типа маркера используется атрибут…элемента…
12. Маркированный список задаётся следующими элементами:
13. Для создания гиперссылки в форме текста (текст-гиперссылка) необходимо набрать следующие команды:
14. Для вставки картинки на страничку используется элемент…
15. Для выравнивания картинки используется атрибут…элемента…
16. Для задания высоты картинки используется атрибут…элемента…
17. Элемент, задающий таблицу
18. Значение атрибута…элемента…выравнивающего картинку по левому краю =
19. Элемент, задающий столбцы таблицы
20. Атрибут элемента <table>, указывающий положение таблицы
21. Атрибут элемента <td>, указывающий количество строк для слияния
22. Атрибут элемента <table>, указывающий толщину внешней границы таблицы
23. Написать html-код для построения следующей таблицы:
24. Написать html-код для странички Контрольная работа по информатике, содержащую заголовок Контрольная работа, напечатанный зелёным шрифтом, изображение компьютера (файл computer.jpeg), вопросы Вашего билета в форме маркированного списка (3 вопроса) и гиперссылку на ресурс www.rambler.ru.
25. Отметьте синтаксически неправильный вариант:
1) <a href='start.htm'>
2) <a href="start.htm">
3) <a href="../start.htm">
26. Отметьте синтаксически правильный вариант:
1) <img src="cat.gif">
2) <img><src="cat.gif">
3) <img scr="cat.gif">
4) <img scr="cat.gif" alt="кошка">
27. Какого атрибута нет у тега <body>?
1. Background
2. Bgcolor
3. Link
4. Xlink
5. Text
6. atext
Практическая работа
Работа с каскадными таблицами стилей
Цель работы: Освоить основные положения CSS.
Задание 1. На рис. приведено изображение HTML-документа. Ниже приведен текст данного документа. Ввести данный текст. Посмотреть, как будет изменяться отображение документа, при изменении значений таблиц стилей.
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Пример с CSS</title>
<style type="text/css">
<!--
p{
font-size:26pt;
font-family: 'comic sans MS', 'fantasy';
color:maroon;
}
-->
</style>
</head>
<body>
<p>Параграф отформатированный с помощью CSS.</p>
</body>
</html>
Задание 2. На рис. приведено изображение HTML-документа. Ниже приведен текст данного документа. Ввести данный текст. Посмотреть, как будет изменяться отображение документа, при изменении значений таблиц стилей.
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Использование class</title>
<style type="text/css">
<!--
p{
font-size:16pt;
font-family:'comic sans MS', 'fantasy';
color:maroon;
}
.bigsans{
font-size:24pt;
font-family:arial,sans-serif;
color:blue;
}
-->
</style>
</head>
<body>
<p>Это первый параграф</p>
<p class="bigsans">Это второй параграф, использующий селектор class</p>
</body>
</html>
Задание 3. На рис. приведено изображение HTML-документа. Ниже приведен текст данного документа. Ввести данный текст. Посмотреть, как будет изменяться отображение документа, при изменении значений таблиц стилей.
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Использование стиля</title>
</head>
<body>
<div>
Это параграф имеет размер шрифта - 16 pt, цвет - blue, имя шрифта - arial.
</div>
<div>
Этот параграф отображается с помощью значений, установленных в браузере по умолчанию.
</div>
<div>
Это параграф имеет размер шрифта - 18 pt, цвет - yellow, имя шрифта - courier new. Он отображается на синем фоне.
</div>
<div>
Этот параграф отображается с помощью значений, установленных в браузере по умолчанию на фоне - yellow с полями вокруг = 24pt.
</div>
<div>
Этот параграф отображается с помощью значений, установленных в браузере по умолчанию.
</div>
</body>
</html>
Задание 4. Создать HTML-документ с использованием внешней таблицы стилей, который при отображении имеет подобный вид.
В Microsoft Word теперь реализована возможность сохранять документы в формате XML, таким образом можно разделить содержимое документа и границы его двоичного формата (.doc). Содержимое становится доступным для процессов автоматического сбора и анализа данных с последующей корректировкой. Содержимое легко искать и даже изменять отличными от Microsoft Word процессами, например серверной обработкой данных.
Кроме того, при использовании Microsoft Office Professional версия 2003 или отдельно Microsoft Office Word 2003 можно присоединить XML-схемы к любому документу, используя вкладку XML-схема диалогового окна Шаблоны и надстройки. Требуется задать имя файла схемы и, при необходимости, — проверку соответствия правилам схемы в Microsoft Word.
Затем, используйте область задач Структура XML для применения XML-тегов и просмотра разметки XML в документе.
Примечание: Пример подключения внешней таблицы стилей.
<head>
<title>Использование внешней таблицы стилей</title>
<link rel="stylesheet" type="text/css" href="pb-margins.css" />
</head>
Задание 5. Создать HTML-документ с использованием внешней таблицы стилей, который при отображении имеет подобный вид.
Используя устройства ввода рукописных данных (например, планшетный ПК (Tablet PC) и планшетное перо), можно вводить рукописный текст. Кроме того, в Microsoft Office Word 2003 будут доступны следующие возможности.
· Внесение в документ пометок в виде рукописных заметок и примечаний.
· Включение рукописного содержания в документ Word.
· Отправка рукописных сообщений по электронной почте при помощи функции WordMail в Microsoft Outlook.
Задание 6. Создать HTML-документ с использованием внешней таблицы стилей, который при отображении имеет подобный вид.
Наилучшим способом для создания брошюры является использование нового чистого документа. Это позволяет избежать трудностей при расположении текста, графических и прочих элементов. В брошюру можно преобразовать и существующий документ, но при этом может возникнуть необходимость перемещения ряда элементов.
1. Создайте новый документ.
2. Выберите в меню Файл команду Параметры страницы, а затем откройте вкладку Поля.
3. В списке Несколько страниц выберите пункт Брошюра.
Если документ имеет книжную ориентацию, она будет заменена на альбомную.
4. В списках Правое и Левое выберите (или введите) размер правого и левого полей документа.
Если в брошюру необходимо добавить дополнительные пробелы для размещения переплета, то введите или выберите необходимое количество в поле Переплет.
5. В списке число страниц в брошюре выберите число страниц в брошюре.
Если количество страниц в документе превышает количество страниц в брошюре, документ будет распечатан в виде нескольких брошюр.
6. Установите другие необходимые параметры в окне Параметры страницы.
7. Текст, графика, колонтитулы и другие элементы добавляются в документ как обычно.
msi-ikt.narod.ru