Заглавная страница Избранные статьи Случайная статья Познавательные статьи Новые добавления Обратная связь FAQ Написать работу КАТЕГОРИИ:  Археология Биология Генетика География Информатика История Логика Маркетинг Математика Менеджмент Механика Педагогика Религия Социология Технологии Физика Философия Финансы Химия ЭкологияТОП 10 на сайте Приготовление дезинфицирующих растворов различной концентрацииТехника нижней прямой подачи мяча. Франко-прусская война (причины и последствия) Организация работы процедурного кабинета Смысловое и механическое запоминание, их место и роль в усвоении знаний Коммуникативные барьеры и пути их преодоления Обработка изделий медицинского назначения многократного применения Образцы текста публицистического стиля Четыре типа изменения баланса Задачи с ответами для Всероссийской олимпиады по праву 
Мы поможем в написании ваших работ! ЗНАЕТЕ ЛИ ВЫ?
Влияние общества на человека
Приготовление дезинфицирующих растворов различной концентрации Практические работы по географии для 6 класса Организация работы процедурного кабинета Изменения в неживой природе осенью Уборка процедурного кабинета Сольфеджио. Все правила по сольфеджио Балочные системы. Определение реакций опор и моментов защемления |
Вставка графических изображенийСодержание книги
Поиск на нашем сайте
1.2.1. Методические рекомендации Вставка графики Для вставки в документы изображений с целью повышения наглядности и привлекательности документов, а также для вставки рисунков-текстов, например, математических формул, которые трудно воспроизвести при помощи текста, используется следующий тег: <IMG SRC=”images/ris1.jpg”>. Это минимальная форма, в которой ris1.jpg – это имя графического файла, вставляемого в документ, images – папка, в которой рекомендуется хранить все графические изображения. Развернутая (максимальная) форма тега IMG имеет следующий вид: <IMG SRC=”image1.jpg” LOWSRC=”image1-1.jpg” ALT=”image1.jpg” WIDTH=… HEIGHT=… ALIGN=”left” HSPACE=”20” VSPACE=”10” BORDER=”2” >. Здесь: – LOWSRC – необязательный параметр, используемый для увеличения скорости передачи графики. Файл image1-1.jpg содержит то же изображение, что и image1.jpg, но выполнен с низким разрешением. Этот файл загружается вместе с текстом, а затем уже загружается основное изображение; – ALT – задает имя файла изображения, которое отображается при наведении курсора на ссылку. Особенно полезно, когда программа по каким-то причинам не находит файла изображения. Этот файл загружается вместе с текстом, а затем уже загружается основное изображение; – WIDTH, HEIGHT – ширина и высота изображения в пикселях. Использование этих атрибутов существенно ухудшает качество изображения и не обеспечивает более быстрой загрузки изображения, так как фактический размер файла изображения (в байтах) при этом не изменяется (качество не ухудшится, если точно выдержать соотношение размеров изображения по ширине и высоте); –атрибут ALIGN принимает значения: 1) left – обеспечивает выравнивание изображение по левому краю. При этом текст обтекает изображение располагается справа; 2) right – обеспечивает выравнивание изображение по правому краю. При этом текст обтекает изображение слева; 3) top – выравнивает одну строку текста (например название рисунка) по верху изображения. При этом текст располагается слева или справа от изображения, в соответствии с расположением текста относительно изображения в исходном тексте. При этом не надо ставить тег <BR>; 4) bottom – выравнивание текста внизу изображения (по высоте); 5) midlle – выравнивание текста по середине изображения (по высоте); – HSPACE – горизонтальное поле (отступ в пикселах) вокруг изображения; – VSPACE – вертикальное поле (отступ в пикселах) вокруг изображения; – BORDER – ширина черной рамки вокруг изображения. Замечание Анимационные GIF-файлы встраиваются в документ точно таким же образом, и не требуют дополнительных параметров. Теги абзаца и перевода строки для графики Тег перевода строки <BR> отделяет строку от последующего текста или графики. Тег <NoBR> предотвращает произвольное перемещение графики и текста при переполнении строки окна браузера. Этот тег парный. Чтобы прервать обтекание встроенной графики, используется тег <BR Clear=…>. В качестве аргумента может применяться одно из трех ключевых слов: right, left, all, обеспечивающие размещение текста там, где свободно левое, правое или оба поля соответственно (не надо многократно писать <BR>). Теги <LEFT>, <RIGHT>, <CENTER> выравнивают графику по левому, правому краю, в центре. Дополнительные элементы оформления 1. Разделительные полосы Тег <HR> (horizontal rule –горизонтальная полоса) разбивает текст (аналогично тегу <P>) и проводит горизонтальную полосу шириной во весь экран. Вид стандартных полос можно изменить с помощью необязательных атрибутов: SIZE – толщина полосы, WIDTH – длина полосы, ALIGN – выравнивание полосы. Атрибут NOSHADE создает сплошную черную полосу без оттенения (Color – цвет полосы). Пример <HR SIZE=”10” WIDTH=”200” ALIGN=”center” NOSHADE COLOR=”blue”> 2. Установочные атрибуты тега <BODY> Цвета фона, текста и ссылок определяются в начале HTML-файла в теге BODY: <BODY BGCOLOR=”#aaefff” TEXT=“black” LINK =”#ff0000” VLINK=”red” BACKGROUND = ”recbg.jpg” BGPROPERTIES=”fixed”>. Атрибуты тега: – BGCOLOR – задает цвет фона; – TEXT – цвет основного текста; – LINK – цвет непросмотренных гипертекстовых ссылок; – VLINK – цвет просмотренных ссылок; – BACKGROUND – имя графического файла, используемого в качестве фона. Фоновое изображение – это графический файл (расширение GIF или JPG). Если размеры изображения малы, то при просмотре в браузере это изображение многократно повторяется, заполняя все окно. Чем меньше объем изображения в байтах, тем быстрее будет загружаться весь фон. В качестве фоновых изображений чаще всего используют текстуры, а не полноцветные изображения; – BGPROPERTIES="fixed". Аргумент fixed отключает прокрутку фона в окне браузера (действует только в Internet Explorer). Цвета ссылок можно определить также в теге стилей <STYLE> (это так называемые каскадные стили). При этом значения атрибутов, определенных в теге <STYLE> имеют приоритет перед определениями, сделанными в теге BODY или в теле документа. Пример <head> <style> a:link {color:”#ff5500”; font-weight:”normal”; } a:visited {color:”#00ff00”; font-weight:”normal”; } a:hover {color:”blue”; font-weight:”normal”; } </style> </head> Здесь link – цвет гипертекстовой ссылки; visited – цвет посещавшейся ссылки; hover – цвет, приобретаемый ссылкой при наведении на нее курсора. 3. Фоновый звук Internet Explorer распознает оба формата оцифрованного звука (WAV, AU), а также формат MIDI. Следует помнить, что большие звуковые файлы замедляют время передачи и загрузки Web-страниц. Тег <BGSOUND SRC=”file.wav” LOOP=”10”> обеспечивает загрузку и воспроизведение на соответствующем аппаратном обеспечении. Здесь: – SRC это сокращение от Sourse (источник); – LOOP определяет число повторений звукового клипа. Чтобы звук повторялся бесконечно, надо задать ключевое слово infinite. Задание к лабораторной работе №2 1. В программе Photoshop создать графическое изображение (размер не более 100х100 пикселей) для использования в качестве элемента текстуры заднего плана WEB-документа. Изображение сохранить в формате JPG или GIF, используя при сохранении режим оптимизации. 2. Установить это изображение как фоновый рисунок (тег BODY, атрибут BACKGROUND) в WEB-странице, созданной на 1-й лабораторной работе. 3. Ввести на WEB-странице между параграфами текста разделительные полосы (тег HR), придав атрибутам полосы различные значения высоты, ширины и выравнивания. 4. В программе Photoshop подготовить 5 графических изображений (на основе существующей коллекции) и вставить их в WEB-документе в различные абзацы текста. Изменить размеры изображений в соответствии с особенностями абзацев созданного документа и его общей компоновкой. Выполнить подрисуночные надписи, привести примеры выравнивания и обтекания графики текстом. Сделать отступы и выделение изображений рамкой. 5. Ввести в документ WEB-страницы фоновый звук.
Лабораторная работа №3 Создание гиперссылок 1.3.1. Методические рекомендации Гиперссылки позволяют щелчком по выделенному слову или фразе перейти к другому документу или части того же документа. Эта возможность называется гипертекстом. Гипертекстовые ссылки выделяются в тексте документа специальным цветом. Чтобы включить ссылку в ваш документ, необходимо указать в тексте открывающего тега <A> имя файла, на который происходит ссылка, в следующем формате: HREF=”имя файла”. Далее ввести текст ссылки и указать на завершение тега </а>. Пример (простая ссылка) <A HREF=”glava2.htm”> Глава вторая </a> В данном примере фраза «Глава вторая» является ссылкой на HTML-документ, содержащийся в файле GLAVA2.htm, в том же каталоге (папке), что и текущий документ. Если же документ находится в подчиненном каталоге, то необходимо указать имя этого каталога, например: <A HREF=”BOOK/glava2.htm”> Глава вторая </a>. Такие ссылки называются относительными. При необходимости можно задать и абсолютные имена файлов в формате UNIX. Последние обычно используются для ссылок на несвязанные между собой документы, например: <A HREF=”http://www.cpress.ru/BOOK/glava2.htm”> Глава вторая </a>. Здесь http:/www.cpress.ru – это URL-адрес сайта (Uniform Resource Locator – унифицированный адрес ресурса).
|
||||
|
|
Последнее изменение этой страницы: 2016-04-18; просмотров: 303; Нарушение авторского права страницы; Мы поможем в написании вашей работы! infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 3.144.255.198 (0.009 с.) |
