1. Вставка Изображения
Важнейшей возможностью, которой обладает язык HTML, является
возможность вставки иллюстраций в текстовый документ. Для того, чтобы
вставить изображение в редактируемый документ, необходимо нажать
кнопку Images на панели объектов и в открывшемся списке выбрать Image
(рис. 6.1) или выполнить команду Insert=>Image. В открывшемся
диалоговом окне необходимо выбрать графический файл (в формате GIF,
JPEG или PNG).
Следует обратить внимание на то, что документ перед вставкой графических
и большинства других элементов необходимо сохранить, иначе путь к
подключаемому файлу может быть абсолютным (начиная от корня диска).
Рис. 6.1. Вставка изображения
Если выделить изображение (для этого достаточно щелкнуть по нему
мышью), то на панели свойств будут отображены его свойства (рис. 6.2).
Рис. 6.2. Свойства графического объекта
Параметры W и H определяют соответственно ширину и высоту
изображения. По возможности следует изменять размеры самого
графического
файла (используя графические редакторы), оставляя параметры W и H
равными
исходным размерам. Если одна из этих величин не соответствует истинному
значению размеров изображения, она будет выделена жирным шрифтом. Для
того, чтобы вернуть параметрам их действительные значения, достаточно
2. щелкнуть мышкой по подписи к полю (буквам W или H) или
воспользоваться
кнопкой Reset Size.
В поле Src указан путь к графическому файлу: при необходимости его
можно отредактировать
Вставка гиперссылок
Настроика гиперссылок производится в свойствах страницы
на вкладке Links.
Комбинированный список Шрифт ссылки (Link font)
задает шрифт гиперссылки и аналогичен рассмотренному
ранее списку Шрифт страницы(Page font) в категории
Внешний вид. Кроме знакомых нам по предыдущей
категории селекторов и кнопок, здесь есть четыре селектора
цвета, задающие цвета различных гиперссылок:
3. • Link color(Цвет ссылок)-задает цвет обычных
гиперссылок(по умолчанию синий)
• Просмотренные ссылки-задает цвет уже
посещенных гиперссылок(по умолчанию темно-красный)
• Выделение ссылок-задает цветгиперссылки, над
которой находится курсор(по умолчанию-синий)
• Активные ссылки-задает цвет активной
гиперссылки(по умолчанию ярко-красный)
Раскрывающейся список Стиль подчеркивания
(Underline style) позволяет установить или убрать
подчеркивание гиперссылок
Перевод рисунка
4. И так приступаем к созданию гиперссылок. Давайте вставим в текст
нашей web страницы две гиперссылки. Одну из них на сайт Sevidi (внешняя
гиперссылка) и другую на сайт, созданный в первом цикле уроков "Сайт о
сайтах".
5. Выделим название сайта Sevidi и обратим внимание на редактор
свойств. Мы сразу заметим большой комбинированный список Ссылка(Link),
где задается интернет-адрес гиперссылки.
6. Введем в него интернет-адрес сайта Sevidi htth://sevidi.narod.ru/ и нажмем
клавишу <Enter>
Теперь при просмотре страницы в web обозревателе посетитель
может просто щелкнуть мышью по слову Sevidi, чтобы перейти на этот сайт.
После создания ссылки слово Sevidi изменило цвет на синий и стало
подчеркнутым.
7. Приступим к созданию второй гиперссылке. Выделим текст "Сайт о
сайтах" и опять обратимся к редактору свойств. Нажмем кнопку указанную
на рисунке
На экране появится диалоговое окно Выбрать файл(Select File)
8. Выберем файл html, в нашем случае в нем находится
первая страница выше упомянутого сайта.
9. Нажимаем ОК. Словосочетание "Сайт о сайтах" изменило
цвет и стало подчеркнутым.
Теперь зададим цель гиперссылки с помощью
комбинированного списка Назначение(Target),
находящимся в редакторе свойств.
В этом списке выбираем способ открытия страницы, на которую
сделана ссылка
_blank позволяет открывать новую страницу в новом окне
браузера;
10. _self открывает новую страницу в том же окне браузера;
_top и _parent здесь указывается фрейм, в котором открывается
страница.
Он содержит четыре пункта, из которых полезными для нас в данный
момент будут два пункта: blank и self. Первый из них позволяет вывести
целевую страницу в новом окне web обозревателя, а второй -в том же окне.
Мы можем легко исправить интернет адрес любой созданной
гиперссылки. Для этого поставим текстовой курсор на текст гиперссылки,
изменим интернет-адрес в комбинированном списке Ссылка(Link) редактора
свойств и
Якоря
Теперь рассмотрим еще одну разновидность гиперссылок, так
называемые якоря. В отличие от других, они не указывают на другую web-
страницу, а помечают некоторый фрагмент текущей страницы, чтобы другая
гиперссылка могла на него сослаться.
Для того чтобы научиться работать с якорями, создадим небольшую
учебную страничку, наберем текст, достаточно большой, чтобы он не
помещался на экране полностью.. После этого напишем небольшое
оглавление, и создадим первый якорь. Поместим текстовой курсор в начало
первого абзаца текста и переключимся на вкладку Вставить(Common) панели
Общий(Insert). Нажмем кнопку вставки якоря.
11. На экране появится диалоговое окно Именованная
привязка (Named Anchor). В поле ввода Имя привязки
введем имя создаваемого якоря par1.
Имена якорей должны состоять из латинских букв цифр,
причем первым символом должна быть буква. Введя имя,
нажмем ОК.
Маркер якоря будет отображен в позиции, где тот был вставлен. Это
делается для удобства web- дизайнера. якоря на страницах web-обозревателя
не отражаются.
12. Создадим гиперссылку, ссылающуюся на якорь. Выделим строку
"Что такое HTML?" в оглавлении. Интернет-адрес, на который будет
ссылаться гиперссылка, будет выглядеть так: #par1.
Введем его в комбинированный список Ссылка(Link) редактора
свойств и нажмем клавишу <Enter>. Значок решетки # обозначает имя якоря.
Имя файла web-страницы не указано. Это значит, что мы ссылаемся на якорь,
расположенный на той же странице. Если мы хотим сослаться на данный
якорь из другой страницы, то должны сослаться на эту страницу. Например,
1.1.html#par1. Создаем якоря на оставшийся список оглавления. Как это
делать, мы уже знаем.
Задания для закрепления материала
Задание 1. Создать страницу с гиперссылками внутри документа. Сохранить
документ под названием «Города». Определить заголовок страницы
«Города». Задать фон страницы. Установит цвет ссылки-краснный,
просмотренной - зеленый, активной - голубой, убрать подчеркивание.
13. Задание 2.
Открыть документ, созданный ранее. Создать гиперссылки на другие
веб-страницы на городах Омск (ссылается на документ Omsk.html документ
14. открывается в этом же окне) и Барнаул (ссылка Barnaul.html открывается в
новом окне).
Документ Omsk.html содержит текст, приведенный ниже.
Отформатировать текст: цвет, выравнивание, отступы.
Документ Barnaul.html содержит текст, приведенный ниже. Отформатировать
текст: цвет, выравнивание, отступы.
Барнау́л — город (основан в 1730-х годах, статус города с 1771 года) в России,
административный центр Алтайского края (с 1937 года). Расположен на юге
Западной Сибири в месте впадения реки Барнаулки в Обь. Площадь города — 321
км², население — 621,7 тыс. человек (2012)[1]
, город является 21-м по численности
населения в России. Вместе с подчинёнными населёнными пунктами, в границах
городского округа, население Барнаула составляет 681,5 тыс. человек[1]
. Крупный
промышленный, культурный и образовательный центр Сибири: 9 государственных
вузов, 5 театров, музеи, памятники архитектуры XVIII—XX веков.
15. Города России
По итогам переписи 2010 года 1100 населённых пунктов имеют статус города (было
1098 по итогам переписи 2002 года).
1 Города с населением более миллиона человек (города-миллионеры)
2 Города с населением 500 тыс. — 1 млн человек (крупнейшие города)
Города с населением более миллиона человек (города-миллионеры) по
данным Всероссийской переписи населения 2002 года, тыс. чел.
1. Москва 11 551,9
2. Санкт-Петербург 4 868,5
3. Новосибирск 1 485,3
4. Екатеринбург 1 386,5
5. Нижний Новгород 1 311,2
6. Самара 1 158,1
7. Омск 1 133,9
8. Казань 1 105,3
9. Челябинск 1 078,3
10. Ростов-на-Дону 1 070,2
11. Уфа 1 042,4
12. Волгоград 1 012,8
13. Пермь 999
наверх
Города с населением 500 тыс. — 1 млн человек (крупнейшие города)
По итогам переписи населения 2010 года 25 городов имеют население от 500 тыс. до
1 млн человек. Численность в тыс. чел. по переписи (текущая оценка в границах
муниципальных образований):
1. Пермь — 1000,6 (1092,3)
2. Красноярск — 973,9 (979,6)
3. Воронеж — 890,0 (979,9)
4. Саратов — 837,8 (837,4)
5. Краснодар — 744,9 (834,1)
6. Тольятти — 719,5 (719,5)
7. Ижевск — 628,1 (627,9)
8. Ульяновск — 613,8 (624,6)
9. Барнаул — 612,1 (670,9)
10. Иркутск — 600,0 (600,0)
11. Владивосток — 592,1 (616,1)
12. Ярославль — 591,5 (591,4)
наверх