Читать «Веб-Самоделкин. Как самому создать сайт быстро и профессионально» онлайн - страница 111
Алексей Анатольевич Гладкий
Однако лучше всего для начинающих веб-разработчиков подходит третий способ вставки изображения, поскольку он является наиболее простым. Суть его заключается в использовании встроенного в программу Мастера вставки изображения, который позволяет полностью автоматизировать процесс формирования соответствующего фрагмента исходного кода. Дополнять этот фрагмент будет уже не нужно – всем атрибутам будут автоматически присвоены требуемые значения.
Итак, установим курсор в строку, следующую за фразой (мы продолжаем работать с исходным кодом, который сформировали ранее). После этого выполним команду главного меню или в инструментальной панели, которая расположена слева внизу окна, нажмем кнопку (чтобы прочесть название кнопки, подведите к ней указатель мыши). В результате любого из этих действий на экране отобразится окно, изображенное на рис. 6.8.
Мастер вставки изображения
В данном окне нужно щелчком мыши выбрать изображение, которое необходимо вставить на веб-страницу. Обратите внимание: в правой части данного окна демонстрируется изображение, на котором установлен курсор. Таким образом, вы можете последовательно просмотреть все имеющиеся изображения, поочередно щелкая по ним мышью.
После выбора изображения нажимаем кнопку либо клавишу – в результате в наш исходный код будет добавлен следующий фрагмент: . В этом фрагменте, как мы видим, автоматически сформировано значение атрибута —этим значением является имя файла графического объекта, а также указаны размеры изображения в пикселях. Дополним фрагмент: зададим обрамление изображения рамкой толщиной пикселей, и введем альтернативный текст, который будет отображаться при невозможности отображения картинки (например, по причине отключения соответствующей функциональности в настройках Интернет-обозревателя) – . После данного фрагмента вставим тег , чтобы следующая фраза была начата с новой строки, а не начиналась сразу после графического объекта. В результате выполненных действий исходный код нашей веб-страницы будет выглядеть так, как показано в листинге 5.7.
Вставка графического объекта с указанием его размеров, толщины рамки, альтернативного текста
<html>
<head><title>Сведения о компании</title></head>
<body>
<h1>Добро пожаловать</h1>
<b>Наша компания была создана в 2005 году.</b><br>
<img src="Образец.jpg" width="320" height="240" border=10 alt="Извините, изображение не может быть показано"><br>
