КАТЕГОРИИ: Архитектура-(3434)Астрономия-(809)Биология-(7483)Биотехнологии-(1457)Военное дело-(14632)Высокие технологии-(1363)География-(913)Геология-(1438)Государство-(451)Демография-(1065)Дом-(47672)Журналистика и СМИ-(912)Изобретательство-(14524)Иностранные языки-(4268)Информатика-(17799)Искусство-(1338)История-(13644)Компьютеры-(11121)Косметика-(55)Кулинария-(373)Культура-(8427)Лингвистика-(374)Литература-(1642)Маркетинг-(23702)Математика-(16968)Машиностроение-(1700)Медицина-(12668)Менеджмент-(24684)Механика-(15423)Науковедение-(506)Образование-(11852)Охрана труда-(3308)Педагогика-(5571)Полиграфия-(1312)Политика-(7869)Право-(5454)Приборостроение-(1369)Программирование-(2801)Производство-(97182)Промышленность-(8706)Психология-(18388)Религия-(3217)Связь-(10668)Сельское хозяйство-(299)Социология-(6455)Спорт-(42831)Строительство-(4793)Торговля-(5050)Транспорт-(2929)Туризм-(1568)Физика-(3942)Философия-(17015)Финансы-(26596)Химия-(22929)Экология-(12095)Экономика-(9961)Электроника-(8441)Электротехника-(4623)Энергетика-(12629)Юриспруденция-(1492)Ядерная техника-(1748) |
Не забывайте каждый раз сохранять текст Web-страницы при ее корректировке в программе Блокнот и обновлять страницу при ее просмотре в программе браузера
Продублированый слой назовите Gem Reflection Жмем сочетание клавишCTRL+ SHIFT + ALT + E 15. Новый слой переименуется в слой 1 — layer 1. 16. Делаем видимым слой с Градиентной заливкой (Gradient Fill)
17. Переименуем слой layer 1 в Gem. Продублируем его 19. В этом шаге тексту добавим тень. Просто отразим слой по вертикали- Изображение - Трансформация - Отразить по вертикали (Edit - Transform - Flip Vertical). Зажав клавишу SHIFT перетаскиваем отражение вниз как на скрине
20. Создаем Маску слоя и выбираем градиент Gradient tool. Протяните вертикальную линию как на скрине
Смотрим на то что получилось:
Для практической работы использовались следующие материалы: Шрифт Poetsen One Фон / Текстура Glitter_by_renesmits.jpg
Задание № 3. Некоторые специальные команды форматирования текста
Существуют специальные команды, выполняющие перевод строки и задающие начало нового абзаца. Кроме того существует команда, запрещающая программе браузера изменять каким-либо образом изменять форматирование текста и позволяет точно воспроизвести на экране заданный фрагмент текстового файла.
Тег перевода строки <BR> отделяет строку от последующего текста или графики.
Тег абзаца <P> тоже отделяет строку, но еще добавляет пустую строку, которая зрительно выделяет абзац.
Оба тега являются одноэлементными, тег <P> – двойной, т.е. требуется закрывающий тег.
1. Внесите изменения в файл RASP.HTML
<HTML> <HEAD>
<TITLE>Учебный файл HTML</TITLE> </HEAD>
<BODY> <P>Расписание</P> <BR>занятий<BR>
на вторник </BODY> </HTML>
2. Сохраните внесенные изменения, переключитесь на панели задач на программу браузера, обновите Web-страницу.
Как изменилось отображение текста на экране? Выглядеть ваша Web-страница будет примерно так, как показано на рисунке 2.
Страница 3 из 16
Рис. 2
Задание № 4. Выделение фрагментов текста
1. Внести изменения в текст файла RASP.HTML
<HTML>
<HEAD>
<TITLE>Учебный файл HTML</TITLE> </HEAD>
<BODY> <B>Расписание</B> <I> занятий</I> <U> на вторник</U>
</BODY> </HTML>
2. Посмотрите полученную Web-страницу.
Возможно использование комбинированных выделений текста.
<I><B>Расписание</B></I> <I><U> занятий</U></I> <U> на вторник</U>
Но при этом необходимо помнить следующее правило использования комбинированных тегов:
<Тег_1><Тег_2>... </Тег_2></Тег_1> – правильная запись.
<Тег_1><Тег_2>... </Тег_1></Тег_2> –ошибочная запись.
Обратите внимание на «вложенность» тегов, она напоминает «вложенность» скобок.
Задание № 5. Задание размеров символов Web-страницы
Существует два способа управления размером текста, отображаемого браузером:
· использование стилей заголовка,
· задание размера шрифта основного документа или размера текущего шрифта. Используется шесть тегов заголовков: от <H1> до <H6> (тег двойной, т.е. требует закрытия). Каждому тегу соответствует конкретный стиль, заданный параметрами настройки браузера.
1. Внесите изменения в файл RASP.HTML
Страница 4 из 16
<HTML> <HEAD>
<TITLE>Учебный файл HTML</TITLE> </HEAD> <BODY> <P><H1>Расписание</H1></P>
<I> занятий</I><U> на вторник</U> </BODY> </HTML>
2. Просмотрите свою Web-страницу. На экране вы увидите то, что отображено на рисунке 3.
Рис. 3
Задание № 6. Установка размера текущего шрифта
Тег шрифта <FONT> позволяет задавать размер текущего шрифта в отдельных местах текста в диапазоне от 1 до 7.
1. Внесите изменения в текст RASP.HTML
<HTML>
<HEAD> <TITLE>Учебный файл HTML</TITLE> </HEAD>
<BODY> <FONT SIZE="7">Расписание</FONT> занятий на вторник </BODY>
</HTML>
2. Самостоятельно измените размер текста «занятий на вторник», используя тег <FONT>.
3. Измените оформление текста HTML-документа, используя тег выделения фрагментов и тег перевода строки и абзаца.
Задание № 7. Установка гарнитуры и цвета шрифта
Тег <FONT> предоставляет возможности управления гарнитурой, цветом и размером текста. Изменение гарнитуры текста выполняется простым добавлением к тегу <FONT> атрибута FACE. Например,для отображения текста шрифтом Arial необходимо записать: <FONT FACE=”ARIAL”>
Страница 5 из 16
Для изменения цвета шрифта можно использовать в теге <FONT> атрибут COLOR=”X”. Вместо “X” надо подставить английское название цвета в кавычках(“ ”),либо его шестнадцатеричноезначение. При задании цвета шестнадцатеричным числом необходимо представить этот цвет разложенным на три составляющие: красную (R – Red), зелѐную (G – Green), синюю (B – blue), каждая из которых имеет значение от 00 до FF. В этом случае мы имеем дело с так называемым форматом RGB.
Примеры записи текста в формате RGB приведены в Таблице 1:
1. Внесите изменения в файл RASP.HTML
<HTML> <HEAD> <TITLE>Учебный файл HTML</TITLE>
</HEAD> <BODY> <U><I><B><FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">
Расписание</FONT></B></I></U> занятий на вторник </BODY> </HTML>
2. Самостоятельно измените размер, цвет, гарнитуру стиль текста документа.
Задание № 8. Выравнивание текста по горизонтали
1. Внесите изменения в файл RASP.HTML
<HTML> <HEAD>
<TITLE>Учебный файл HTML</TITLE> </HEAD>
<BODY> <P ALIGN="CENTER">
<FONT COLOR="#008080" SIZE="7"> <B>Расписание</B></FONT><BR>
<FONT SIZE="6"><I> занятий на вторник</I></FONT> </P>
</BODY> </HTML>
Страница 6 из 16
2. Просмотрите изменения в браузере. На экране вы увидите то, что показано на рисунке 4.
Рис. 4
Задание № 9. Задание цвета фона и текста
При изображении фона и цвета браузеры используют цвета, установленные по умолчанию, – они заданы параметрами настройки браузера. Если вы хотите задать другие цвета, то это надо сделать в начале файла HTML в теге <BODY>. Атрибут BGCOLOR= определяет цвет фона страницы, атрибут TEXT= задает цвет текста для всей страницы, атрибуты LINK= и VLINK= определяют соответственно цвета непросмотренных и просмотренных ссылок (последние два примера будут рассмотрены позже).
1. Внесите изменения в файл RASP.HTML
<HTML> <HEAD> <TITLE>Учебный файл HTML</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFCC" TEXT="#330066"> <P ALIGN="CENTER">
<FONT COLOR="#008080" SIZE="7"> <B>Расписание</B></FONT><BR> <FONT SIZE="6"><I> занятий на вторник</I></FONT> </P>
</BODY> </HTML>
2. Просмотрите изменения Web-страницы в браузере.
Задание № 10. Размещение графики на Web-странице
Тег <IMG> позволяет вставить изображение на Web-страницу. Оно появится в том месте документа, где находится этот тег. Тег <IMG> является одиночным.
Необходимо помнить, что графические файлы должны находиться в той же папке, что и файл HTML, описывающий страницу. Графика в Web, как правило, распространяется в трех форматах:
GIF, JPG, PNG.
Страница 7 из 16
Для выполнения следующего задания поместите файл с именем CLOCK.JPG (или другим именем) в рабочую папку.
Дата добавления: 2015-07-13; Просмотров: 308; Нарушение авторских прав?; Мы поможем в написании вашей работы! Нам важно ваше мнение! Был ли полезен опубликованный материал? Да | Нет |