Вставляем в текст изображения

Для вставки изображений на веб-страницу используется элемент 'img', а путь к файлу изображения указывается в качестве значения его атрибута 'src'. При этом разрешается использовать как абсолютную, так и относительную адресацию.

Чтобы текст обтекал изображение слева или справа, необходимо сделать изображение плавающим при помощи свойства 'float'. Если нужно, чтобы данный элемент не обтекал плавающие элементы в коде выше, то для него можно использовать свойство 'clear'.

Также не стоит забывать, что исходный размер изображения можно изменять при помощи таблиц стилей. Поэтому по возможности нужно подбирать изображения с максимальным разрешением, чтобы качество изображения не ухудшалось при увеличении его размеров на странице.

Делаем простейшую фотогалерею

Все изображения и веб-странички, которые вставляются во фрейм, находятся в одной папке. Код страниц практически идентичный. Изображения подобраны одинакового размера. Чтобы у фрейма не появлялись полосы прокрутки, содержимое его тела документа прячется.

Создаем свой курсор мыши

Для того, чтобы в качестве курсора мыши установить свое изображение, необходимо в качестве значения свойства cursor использовать путь к файлу изображения (например, cursor: url("smile.png"), auto;). Разрешается указывать через запятую путевые адреса сразу к нескольким файлам изображений; при этом важно помнить, что поддерживаются не все форматы изображений, а только форматы CUR, PNG, GIF, JPG (анимация в формате GIF работать не будет, также старайтесь ограничивать размеры изображений в пределах 128x128 пикселей, т.к. изображения слишком больших размеров отображаться не будут); кроме того, после адреса или списка адресов нужно обязательно указать через запятую одно из стандартных значений (см. §5.5). Ниже созданы несколько абзацев, при наведении на которые стандартный курсор будет изменен на наш собственный (смотрите оформление в таблице стилей).

В данном абзаце в качестве курсора мы использовали изображение в формате GIF. Однако анимация работать не будет, хотя само изображение показывается.

В данном абзаце в качестве курсора мы использовали изображение в формате CUR.

В данном абзаце в качестве курсора мы использовали изображение в формате PNG размером 32x32 пикселя.

А вот здесь будет использован стандартный курсор, т.к. мы превысили допустимый размер изображения на один пиксель (129x129 пикселей).