Помощничек
Главная | Обратная связь


Археология
Архитектура
Астрономия
Аудит
Биология
Ботаника
Бухгалтерский учёт
Войное дело
Генетика
География
Геология
Дизайн
Искусство
История
Кино
Кулинария
Культура
Литература
Математика
Медицина
Металлургия
Мифология
Музыка
Психология
Религия
Спорт
Строительство
Техника
Транспорт
Туризм
Усадьба
Физика
Фотография
Химия
Экология
Электричество
Электроника
Энергетика

Изображения-гиперссылки



Изображения, особенно небольшие пиктограммы и значки, часто используются в качестве графического представления гиперссылок. Создание изображения‑гиперссылки выполняется очень просто: достаточно заключить HTML‑элемент IMG внутрь элемента A, как показано ниже:

<A href = «info.html»><IMG scr = «info.gif»></A>

Изображение‑гиперссылка обычно обводится браузером рамкой такого же цвета, что и цвет текста обычной гиперссылки в соответствующем состоянии (посещенная, не посещенная или активная).

Широкое распространение для веб-графики получили два формата — GIF и JPEG. Их многофункциональность, универсальность, небольшой объем исходных файлов при достаточном для сайта качестве, сослужили им положительную службу, фактически определив их как стандарт веб-изображений. Есть еще формат PNG, который также поддерживается браузерами при добавлении изображений и существует в двух ипостасях — PNG-8 и PNG-24. Однако популярность PNG сильно уступает признанию форматам GIF и JPEG.

 



 

35. Создание и оформление таблиц, управление шириной столбцов, объединение ячеек, добавление заголовка.

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

Для обозначения таблицы используется элемент TABLE, который является парным тегом. Многие параметры таблицы задаются установкой соответствующих атрибутов этого элемента. Например:

Ø Align – задает положение таблицы в окне

Ø Bgcolor – цвет фона таблицы

Ø Border – толщина внешней границы

Ø Bordercolor – цвет внешней границы и границы ячеек

Ø Width – определяет рекомендуемую ширину таблицы и др.

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

Пример:

<TABLE Align=center Border=5 Bgcolor=green Bordercolor=yellow Width=”50%”>

Строки задаются элементом TR (парный, закрывать необязательно). Элемент имеет ряд собственных атрибутов, задающих выравнивание текста ячеек строки, цвет фона ячеек строки, цвет рамок и пр.

Ячейки в простейшем случае задаются элементом TD, закрывать, который необязательно. Этот тег имеет аналогичные выше приведенным атрибуты. Следует обратить внимание на два атрибута:

Ø Colspan – задает количество столбцов для слияния

Ø Rowspan – определяет количество строк для слияния.

Эти два атрибута используются при необходимости создания более сложных таблиц.

Например:

<TR>

<TD Rowspan =2><B>Филиал\Период</B>

<TD Colspan =3><B>3 квартал</B>

<TD Colspan =3><B>4 квартал</B>

  Филиал\Период 3 квартал 4 квартал
           
             

 

Для создания заголовка таблицы используется парный тег <CAPTION>, помещенный после тега <Table>.

Последовательность тегов для задания простейшей таблицы:

<Table>

<CAPTION>текст заголовка</CAPTION>

<TR><TD>содержимое ячейки<TD>содержимое ячейки<TD> содержимое ячейки <TR><TD> содержимое ячейки……</Table>

К тексту элемента <CAPTION> применяются любые способы форматирования. Для этого элемента можно задать атрибут align, который определяет положение заголовка относительно таблицы, он принимает следующие значения:

Top – заголовок размещается сверху таблицы (используется по умолчанию)

Bottom – под таблицей

Left – слева от таблицы

Right – справа от таблицы


36. Создание и оформление списков в документе HTML. Вложенные списки, список определений.

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

Списки также определяют структуру документа. Визуально списки отображаются следующим образом:

· Текст 1

· Текст 2

· Текст 3

· Текст 4

Это пример маркированного списка. Маркированные списки применяются для перечисления неупорядоченной информации, здесь каждый новый элемент выделяется маркером. Неупорядоченные списки вводятся тэгом:

<ul>….</ul>

Между тегами помещаются элементы списка, текст которых начинается с тега <li> и этим тегом может заканчиваться. Закрывающий лег </li> можно пропустить, тогда текстои элемента списка считается весь текст, расположенный до следующего <li>.

К тексту элементов любых списков можно применять средства форматирования.

Элементы UL и LI имеют ряд атрибутов. Примером атрибутов являются:

compact– отображает список компактно (его действие зависит от конкретного браузера)

type – позволяет задать тип маркера списка, например: circle (круг без заливки), disk ( круг с заливкой), square ( квадрат). По умолчанию используется закрашенный круг.

Кроме неупорядоченных, маркированных списков существуют еще и упорядоченные, нумерованные списки:

Нумерованные списки применяются для упорядочивания данных и обозначаются тегом <OL></OL>. Атрибуты:

compact– отображает список компактно

type – задает тип нумерации, доступны следующие значения: 1- арабские цифры, I, i – большие или малые римские цифры, А или а – большие или малые буквы латинского алфавита

start –номер первого элемента списка(при задании атрибута нужно учитывать тип нумерации элементов списка, например номеру 5 соответствует латинская буква E). Атрибут используется, когда надо продолжить нумерацию.

 

      <ol type="I" > <li>Сначала сделаем это</li> <li>Затем мы сделаем то</li> <li>А также действие третье</li> <li>И с ним нас четвертое ждет </li> </ol>

Получаем:

I. Сначала сделаем это

II. Затем мы сделаем то

III. А также действие третье

IV. И с ним нас четвертое ждет

Кроме упорядоченных и неупорядоченных списков еще существуют и списки определений. Для задания списков определений используется парный тег <DL>. Каэдый элемент списка определений состоит из двух частей: термина (элемент DT) и определения термина (элемент DD). Браузер по-разному отображает термины и определения. Списки определений повышают наглядность текста и подчеркивают особую роль некоторых абзацев.

 


 




Поиск по сайту:

©2015-2020 studopedya.ru Все права принадлежат авторам размещенных материалов.