Главная страница Карта сайта Написать письмо

HTML, Excel, Word, SEO   Учебник HTML (хтмл) Работа с html-графикой
JavaScript + DHTML HTML Word Excel VBA Графика Свой сайт Free soft вебмастера SEO-новости Статьи
HTML профессионально
Учебник HTML (хтмл)
...Старт
...Основные тэги
...Заголовки и комментарии
...Специальные символы
...Форматирование текста ч.1
...Форматирование текста ч.2
...Форматирование текста ч.3
...Создание списков
...Работа с графикой ч.1
...Работа с графикой ч.2
...Работа с графикой ч.3
...Работа с графикой ч.4
...Таблицы ч.1
...Таблицы ч.2
...Таблицы ч.3
...Гиперссылки
...Фреймы
...Что такое формы
...Что такое JavaScript
...Маленькие секреты Вэб-дизайна
...Эффект постепенной прорисовки
...Карта ссылок
...Внутренний лист стилей
...Работа с листами стилей
...Свойства шрифта - font
...Свойства текста
...Свойство фона - background
...Рамки и размеры
...Относительное и абсолютное позиционирование элементов
...Основные мета тэги
...Таблица дескрипторов HTML и их атрибутов
...Таблица свойств css
...Заключительное слово
HTML-редакторы
...Что такое HTML-редактор
...FrontPage 2003
...Adobe GoLive CS
...Macromedia Dreamweaver MX 2004
...HomeSite
...CuteSite Builder
...Namo WebEditor
...CoffeeCup HTML Editor
...1stPage 2000
...Arachnophilia
...HotDog Professional
...CSE HTML Validator Pro
 
 

«вставка изображения  ||  язык HTML  ||  формат изображения»

Работа с графикой html-страницы (ч.2)

Выравнивание текста

Пустая область вокруг изображения

Горизотнальная линейка

Списки с графическими маркерами

Выравнивание текста html-страницы

Атрибут ALIGN тэга <IMG>, принимающий значения top, middle, bottom позволяет задавать вертикальное положение текста относительно границ графического изображения. По умолчанию браузер выравнивает текст по нижней кромке изображения. Если в строке текста включено несколько изображений, то выравнивание может привести к неожиданным эффектам. Следует учесть и тот факт, что если атрибут ALIGN уже был применен для задания параметра обтекания графики текстом, установить признак выравнивания текста относительно графики в пределах конкретной страницы не удастся.

Пример:

HTML-код:


<p> <img src="img/majak.jpg" align="top">Выравнивание по верхней кромке</p>

<p> <img src="img/majak.jpg" align="middle">Выравнивание по середине</p>

<p> <img src="img/majak.jpg" align="bottom">Выравнивание по нижней кромке</p>

Отображение в браузере:


Выравнивание по верхней кромке

Выравнивание по середине

Выравнивание по нижней кромке
Пустая область вокруг изображения html-страницы

Графические изображения в Вэб-браузере имеют, по умолчанию, пустую рамку в несколько пикселей, которая отделяет их от текста. Для увеличения пустой области вокруг изображения служат атрибуты HSPACE, VSPACE тэга <IMG>.

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

Атрибут HSPACE задает ширину чистой области СЛЕВА И СПРАВА от изображения.

Атрибут VSPACE задает ширину чистой области СВЕРХУ И СНИЗУ от изображения.

Пример:

HTML-код:


<p><img src="img/tigr.jpg" align="left" hspace="20" vspace="20">Этот зверь называется тигр. Он относится к семейству хищных зверей и питается свежим мясом.</p>

Отображение в браузере:


Этот зверь называется тигр. Он относится к семейству хищных зверей и питается свежим мясом.
Горизотнальная линейка html-страницы

Для построения горизонтальной линейки служит дескриптор <HR>. По умолчанию браузер строит линейку толщиной в 2 пикселя. Для изменения ширины и длины линейки служат атрибуты SIZE, WIDTH.

По умолчанию браузер выравнивает линейку посреди страницы. Для изменения выравнивания надо воспользоваться атрибутом ALIGN.

Атрибут NOSHADE устраняет эффект объемности линейки.

Пример:

HTML-код:


<hr>

<hr align="left" width="50" size="5" noshade>

Отображение в браузере:
Списки с графическими маркерами html-страницы

С помощью маленьких изображений можно строить списки. Такие списки с графическими маркерами заметно оживляют внешний вид страницы. Размеры изображений должны соответствовать параметрам форматирования текста.

Чтобы воспользоваться графическими маркерами, надо применить атрибут ALIGN, присвоив ему одно из значений - top, middle, bottom, позволяющих соответствующим образом выровнять строку текста элемента списка по вертикали относительно границ маркера.

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

Пример:

HTML-код:


<ul>

<br><img src="img/list.gif" align="middle" hspace="5">Глава 1

<br><img src="img/list.gif" align="top">Глава 2

<br><img src="img/list.gif" align="middle" hspace="15">Глава 3

</ul>

Отображение в браузере:



    Глава 1
    Глава 2
    Глава 3

top

«вставка изображения  ||  язык HTML  ||  формат изображения»
Рекомендую
Смотреть все книги»
 
 
 
БОНУС

Спасибо, что заглянули на сайт. Надеюсь, Вам понравилось. Заходите еще. Здесь всегда рады вам :)
При копировании материалов, размещенных на сайте, ссылка на первоисточник обязательна.

© 2008
Айнур Турушев All Rights Reserved

  

E-mail:
sozdaysait@narod.ru

Хостинг от uCoz