Лаб 1 (Лабораторный практикум), страница 6
Описание файла
Файл "Лаб 1" внутри архива находится в папке "Лабораторный практикум". PDF-файл из архива "Лабораторный практикум", который расположен в категории "". Всё это находится в предмете "языки интернет-программирования" из 5 семестр, которые можно найти в файловом архиве МГТУ им. Н.Э.Баумана. Не смотря на прямую связь этого архива с МГТУ им. Н.Э.Баумана, его также можно найти и в других разделах. Архив можно найти в разделе "лабораторные работы", в предмете "языки интернет-программирования" в общих файлах.
Просмотр PDF-файла онлайн
Текст 6 страницы из PDF
Рассмотрим более подробноотладчик Firebug (реализован как дополнение) для Mozilla Firefox. Если Firebugустановлен, то для того, чтобы открыть отладчик на требуемой странице,необходимо нажать клавишу F12.В нижней части окна браузера появятся дополнительные окна. В Firebugдоступны следующие закладки: Console – сообщения браузера об ошибках, предупреждения иотладочный вывод Javascript-программ. HTML – структура разметки страницы. Позволяет найти поотображенному элементу его соответствие в разметке и наоборот.Возможно интерактивное изменение стилей любых элементов.39 CSS – позволяет изменить таблицы стилей загруженной страницы. Script – Javascript код страниц. Позволяет просматривать код,устанавливать точки останова, выполнять пошаговую отладку итрассировку значений переменных. По-умолчанию выключено. DOM – просмотр и изменение значение документа по модели DOM. Net – просмотр данных, передаваемых между браузером и сервером.Предоставляется возможность просмотра заголовков HTTP, переданныхданных, а также порядка передачи данных.
По-умолчанию выключено.Рисунок 13 Просмотр структуры и стилей в Firebug.Обратите внимание на то, что изменения, внесенные в отладчике, несохраняются в исходных файлах. Для того, чтобы сбросить внесенные в CSSили в HTML-разметку изменения, необходимо перезагрузить страницу.Закладка CSS отображает файлы стилей примерно в том виде, как они былисозданы.
Отличаться может форматирование и способ отображения кода цвета.Этот режим удобен в том случае, если редактируется стиль для несколькихэлементов сразу. Изменения такого стиля будут сразу же отображены наоткрытой странице.40Если же необходимо редактирование одного конкретного элемента, следуетиспользовать закладку HTML. В закладке HTML доступны следующиевложенные закладки: Style (Стиль) для редактирования стиля одного конкретного элемента.Причем Firebug группирует стили, назначенные конкретно навыделенный элемент и стили, унаследованные для этого элемента. Закладка Computed (Скомпилированный стиль) отображает результатприменения к элементу всех назначенных правил.
В отличии от закладкиStyle, здесь приводятся конкретные значения измененных свойств. Layout (Макет) позволяет работать с блочной моделью разметки иотображает размеры элемента, его полей и границ в пикселах. Возможноинтерактивное изменение отображаемых размеров.41Литература Языки HTML и CSS для создания Web-сайтов./М. Хольцшлаг; [пер. сангл. А. Климович].–М. Триумф, 2007.–304с, ил. Джон Дакетт. Основы веб-программирования с использованием HTML,XHTML и CSS.– М.: Эксмо, 2010. Мейер Э. CSS - каскадные таблицы стилей.
Подробное руководство, 3-еиздание. - Пер. с англ. - СПб: Символ-Плюс, 2008. - 576с., ил.42Задание к части 1Разметка HTML-страницы на основе устаревших элементов. Создать html-документ и указать старую спецификацию:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">Написать не менее 10 строк произвольного текста. Указать шрифт текста.Выделить в каждой строке одно из слов жирным шрифтом и краснымцветом.Подготовить второй вариант разметки, отличающийся шрифтом текста, атакже выделенными словами.
Заменить жирный шрифт курсивом, акрасный цвет – синим. Сформировать фрагмент расписания занятий с использованием элементаtable. Создать страницу, содержащую форму для ввода минимальных сведенийо человеке. На странице предусмотреть поля для ввода значений склавиатуры, а также селекторы выбора готовых значений. Проверить на корректность всех разработанных страниц и устранитьошибки. Составить таблицу выявленных ошибок и их фактическоепроявление в браузере.43Задание к части 2Разметка страницы при помощи стилей и блоков. Подготовить разметку произвольного текста, содержащего не менее 10строк (взять из части 1) с использованием таблицы стилей.Продемонстрировать выделением стилями цвета и шрифта отдельныхслов. Сформировать фрагмент расписания занятий с использованием элементаdiv и стилей. Сформировать страницу, содержащую форму с набором кнопок.
На этойже странице добавить список ссылок, соответствующих кнопкам.Модифицировать стилями отображение ссылок так, чтобы они сталипохожи на кнопки. Проверить на корректность всех разработанных страниц и устранитьошибки. Составить таблицу выявленных ошибок и их фактическоепроявление в браузере.44Контрольные вопросыНазовите организацию, координирующую развитие стандартов HTML.Укажите основной принцип формирования разметки в HTML.Приведите примеры устаревших элементов разметки.Приведите примеры селекторов CSS.Приведите примеры описания шрифтов с помощью CSS.Назовите основные виды вёрстки HTML и их отличия.45Требования к отчетуОтчет должен содержать: ФИО студента и номер группы. Наименование лабораторной работы. Название выполненного пункта и тексты реализованных HTML и CSSразметки с указанием имен файлов.Отчет должен быть предоставлен в электронном виде в формате pdf или odt.46.
