Создание основы сайта: Графические объекты
Вставка графических объектов на веб-страницу. Вставка графических объектов в тело страницы не вызывает трудностей, так как используется все тот же принцип - применение инструктирующего тега, которым является непарный тег < img>. Графические объекты, призванные украшать вебстраницы, должны сохраняться в файлах строго определенных форматов: JPG, GIF, PNG. Иными словами, подготовить небольшую картинку можно в любом графическом редакторе, главное - сохранить ее в надлежащем формате.
Нарисуем эмблему нашей компании - опоясанный кольцами Проктел - и сохраним в отведенной под рисунки папке graf под именем proctel.
У тега вставки графических изображений <img> довольно много атрибутов.
src - обязательный атрибут, указывающий местоположение графического файла, при этом необходимо задавать либо абсолютную ссылку на файл - полный URL, либо относительную - путь к текущей папке, в которой содержится веб-страница.
align - определяет способ обтекания рисунка текстом: left - рисунок слева, а текст справа, right - рисунок справа, а текст слева.
width и height - высота и ширина рисунка в пикселах, задаваемые явно и определяющие место, выделяемое браузером.
alt - альтернативный текст, появляющийся, пока рисунок не загрузился или вместо него, если режим отображения графики отключен в браузере посетителя.
border - определяет толщину рамки вокруг рисунка.
hspace и vspase - определяют горизонтальное и вертикальное поле, отделяющее рисунок от текста.
Поместим эмблему компании на главной странице нашего сайта, прописав следующие параметры тега <img>:
<img src=graf/proctel.png а1с="Эмблема компании Проктел" width=250 height=150 align=right>
Расшифровать их можно следующим образом: поместить рисунок с полным именем graf /proctel.png, объявив замещающий текст как Эмблема компании Проктел, зарезервировав ширину 250 пикселов, а высоту - 150 пикселов, а также расположив рисунок по правому краю страницы.
Если слегка уменьшить наше изображение и «притушить» яркость, то его можно использовать в параметрах тега <body> для задания фона страницы.
Продемонстрируем эту возможность формирования фонового изображения и замостим им страницу str2.html, записав следующий код:
<body background=graf/proctel.png>
Здесь proctel.png - имя фонового файла.
Применение изображений в качестве фона накладывает следующие требования: либо маленькие по размеру изображения, дублируясь браузером, мостят все пространство открытого окна, как в нашем случае, либо под конкретное фоновое изображение необходимо жестко задавать размеры страницы, которые будут четко соблюдаться для всех возможных настроек экрана пользователя.
| ← Создание основы сайта: Регистрация бесплатного хостинга | Создание основы сайта: Гиперссылки → |
|---|