ПГУТИ Отчет по лабораторной работе №10 Применение каскадных таблиц стилей CSS Выполнил: студент группы ИТ-71 Самара 2010 Задание 1 Создайте каталог /css/ Создайте в нем файл main.css Подключите его ко всем страницам сайта с помощью тега <LINK>. Задайте по умолчанию следующие параметры для всех страниц (переопределив тег <body>): - цвет фона - размер шрифта - цвет шрифта - семейство шрифта (например Arial) 5. Проверьте работоспособность. 6. В комментариях (в файле main.css) поясните эти параметры. 1. 2. 3. 4. Листинг файла main.css: body { background-color: #FFFAAA; /*цвет фона*/ text-size: 16pt; /*размер шрифта*/ color: #002200; /*цвет текста*/ font-family: Arial; /*Шрифт arial*/ } Задание 2 1. Задайте по умолчанию следующие параметры для всех абзацев (переопределив тег <p> и псевдоклассы тега <p>): - выравнивание абзаца - отступ красной строки - размер и цвет первой буквы 2. Проверьте работоспособность. 3. В комментариях (в файле main.css) поясните эти параметры. Листинг файла main.css: p { text-align: left; /*выравнивание*/ text-indent: 20pt; /*отступ в 50 пунктов*/ } p:first-letter { font-size: 22pt; color: #FF0000; } /*размер 1-й буквы*/ /*цвет первой буквы*/ 2 Задание 3 1. Задайте по умолчанию следующие свойства ссылок для всех страниц: - цвет и оформление ссылки - цвет и оформление посещенной ссылки - цвет и оформление активной ссылки - цвет и оформление ссылки, в момент нахождения курсора мыши над ней 2. Проверьте работоспособность. 3. В комментариях (в файле main.css) поясните эти параметры. Листинг файла main.css: a:link { color: #DD0000; } /*цвет ссылки*/ a:visited { color: #00AA33; } /*посещенная ссылка зеленого цвета*/ a:active { color: #00CC33; } /*активная ссылка*/ a:hover { color: #AAAA11; text-decoration: none; } /*цвет ссылки при наведении*/ /*не подчеркнутые*/ Вывод: в данной работе я ознакомился с базовыми приемами css, которые мне позволили гибко задать оформление создаваемых мною html-страниц, изучив теорию, выполнил предложенные задания, тем самым закрепив теорию на практике 3