Главная Случайная страница


Категории:

ДомЗдоровьеЗоологияИнформатикаИскусствоИскусствоКомпьютерыКулинарияМаркетингМатематикаМедицинаМенеджментОбразованиеПедагогикаПитомцыПрограммированиеПроизводствоПромышленностьПсихологияРазноеРелигияСоциологияСпортСтатистикаТранспортФизикаФилософияФинансыХимияХоббиЭкологияЭкономикаЭлектроника






Добавление стилей в ваш HTML-документ

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

· bold (жирный)

· italic (наклонный)

· underlined (подчеркнутый)

Вы можете комбинировать различные виды стилей, например жирный и наклонный.

Стиль Элемент или тэг Результат
Bold <B> Этот текст жирный </B> Этот текст жирный
Italic <I> Этот текст наклонный </I> Этот текст наклонный
Underlined <U> Этот текст с непроп. шрифтом </U> Этот текст подчеркнутый

Комбинирование стилей позволяет вам отображать в одной строке несколько элементов различными стилями, например:

<b>Жизнь</b> - <i>это <b>песня!</b></i>

Внимание!Добавление большого количества стилей и их комбинаций приводит к затруднению чтения текста!

Дополнительные стили:

· big (юольшой)

· small (маленький)

· sub (подстрочник)

· sup (надстрочник)

 

Стиль Элемент или тэг Результат
Big Этот текст <BIG> большой </BIG> Этот текст большой
Small Этот текст <SMALL> маленький </SMALL> Этот текст маленький
Sub Этот текст <SUB> подстрочник </SUB> Этот текст подстрочник
Sup Этот текст <SUP> надстрочник </SUP> Этот текст надстрочник

Размер шрифта <FONT SIZE>

Вы можете изменять размер шрифта при помощи тэга:

<FONT SIZE=+|- n>

Шрифт может иметь размер от 1 до 7. Вы можете прямо указать размер шрифта цифрой, или указать смещение относительно базового значения (по умолчанию - 3) в положительную или отрицательную сторону. Базовое значение можно изменить при помощи тэга:

<BASEFONT SIZE=n>

Например:

Цвет шрифта <FONT SIZE>

Вы можете изменить цвет шрифта при помощи тэга:

<FONT COLOR="#xxxxxx>

Цвет указывается в RGB-формате (Red-Green-Blue) посредством указания размерности каждой компоненты цвета в шестнадцатиричном формате. Например, белый цвет обозначается "000000", черный - "FFFFFF", синий - "0000FF" и т.п.

<FONT COLOR="#FF0000">Красный </FONT>


HTML Таблицы

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

Основные тэги таблицы

Таблица: <TABLE>...</TABLE>

Это основноые тэги, описывающие таблицу. Все элементы таблицы должны находиться внутри этих двух тэгов. По умолчанию таблица не имеет обрамления и разделителей. Обрамление добавляется атрибутом BORDER.

Строка таблицы: <TR>...</TR>

Количество строк таблицы определяется количеством встречающихся пар тэгов <TR>..</TR>. Строки могут иметь атрибуты ALIGN и VALIGN, которые описывают визуальное положение содержимого строк в таблице.

Ячейка таблицы: <TD>...</TD>

Описывает стандартную ячейку таблицы. Ячейка таблицы может быть описана только внутри строки таблицы. Каждая ячейка должна быть пронумерована номером колонки, для которой она описывается. Если в строке отстутствует одна или несколько ячеек для некоторых колонок, то броузер отображает пустую ячейку. Расположение данных в ячейке по умолчанию определяется атрибутами ALIGN=left и VALIGN=middle. Данное расположение может быть исправлено как на уровне описания строки, так и на уровне описания ячейки.

Заголовок таблицы:<TH>...</TH>

Ячейка заголовка таблицы имеет ширину всей таблицы; текст в данной ячейке имеет атрибут BOLD и ALIGN=center.

Подпись: <CAPTION>...</CAPTION>

Данный тэг описывает название таблицы (подпись). Тэг <CAPTION> должен присутствовать внутри <TABLE>...</TABLE>, но снаружи описания какой-либо строки или ячейки. По умолчанию <CAPTION> имеет атрибут ALIGN=top, но может быть явно установлен в ALIGN=bottom. ALIGN определяет, где - сверху или снизу таблицы - будет поставлена подпись. Подпись всегда центрирована в рамках ширины таблицы.

Основные атрибуты таблицы

BORDER

Данный атрибут используется в тэге TABLE. Если данный атрибут присутствует, граница таблицы прорисовывается для всех ячеек и для таблицы вцелом. BORDER может принимать числовое значение, определяющее ширину границы, например BORDER=3.

ALIGN

Если атрибут ALIGN присутствует внутри тэгов <CAPTION> и </CAPTION>, то он определяет положение подписи для таблицы (сверху или снизу). По умолчанию ALIGN=top.
Если атрибут ALIGN встречается внутри <TR>, <TH> или <TD>, он управляет положением данных в ячейках по горизонтали. Может принимать значения left (слева), right (справа) или center (по центру).

VALIGN

Данный атрибут встречается внутри тэгов <TR>, <TH> и <TD>. Он определяет вертикальное размещение данных в ячейках. Может принимать значения top (вверху), bottom (внизу), middle (по середине) и baseline (все ячейки строки прижаты кверху).

NOWRAP

Данный атрибут говорит о том, что данные в ячейке не могут логически разбиваться на несколько строк и должны быть представлены одной строкой.

COLSPAN

Указывает, какое количество ячеек будет объединено по горизонтали для указанной ячейки. По умолчании - 1.

ROWSPAN

Указывает, какое количество ячеек будет объединено по вертикали для указанной ячейки. По умолчании - 1.

COLSPEC

Данный параметр позволяет задавать фиксированную ширину колонок либо в символах, либо в процентах, например COLSPEC="20%".

Пример таблицы

<TABLE BORDER=5>
<CAPTION ALIGN=bottom> Таблица №1 </CAPTION>
<TR><TD ROWSPAN=2></TD><TH COLSPAN=2>Среднее значение</TH></TR>
<TR><TH>Рост</TH><TH>Вес</TH></TR>
<TR><TD>Мужчины</TD><TD ALIGN=center>174</TD><TD ALIGN=center>78</TD></TR>
<TR><TD>Женщины</TD><TD ALIGN=center>165</TD><TD ALIGN=center>56</TD></TR>
</TABLE>

 

Список базовых тэгов HTML

Стартовый Завершающий Описание
<HTML> </HTML> Обозначение HTML-документа
<HEAD> </HEAD> Заголовочная часть документа
<TITLE> </TITLE> Заголовок документа
<BODY> </BODY> Тело документа
Параметры тега <BODY>
BGCOLOR= Фоновый рисунок
BACKGROUND= Цвет фона
<H1> </H1> Заголовок абзаца первого уровня
<H2> </H2> Заголовок абзаца второго уровня
<H3> </H3> Заголовок абзаца третьего уровня
<H4> </H4> Заголовок абзаца четвертого уровня
<H5> </H5> Заголовок абзаца пятого уровня
<H6> </H6> Заголовок абзаца шестого уровня
<P> </P> Абзац
Параметры тега <P>
ALIGN=left|center|right Выравнивание текста
<PRE> </PRE> Форматированный текст
<BR> Не требуется Перевод строки без конца абзаца
<BLOCKQUOTE> </BLOCKQUOTE> Цитата
<CENTER> </CENTER> Центрирование элементов документа
<B> </B> Выделение текста жирным
<I> </I> Выделение текста курсивом
<U> </U> Подчеркнутый текст
<OL> </OL> Пронумерованный список
Параметры тега <OL>
TYPE=A|a|I|i|1 Тип нумерации
START= Число, с которого начинается отсчет
<UL> </UL> Маркированный список
Параметры тега <UL>
TYPE=disk|circle|square Тип маркера
<LI> Не требуется Элемент списка (внутри тегов <OL> и <UL>

<A> </A> Гипертекстовая ссылка
Параметры тега <A>
  HREF= Адрес документа
<IMG> Не требуется Вставка картинки
Параметры тега <IMG>
  ALT= Подпись к рисунку
  HEIGHT= Высота рисунка
  WIDTH= Ширина рисунка
  ALIGN=top|middle|bottom Выравнивание рисунка
<HR> Не требуется Горизонтальная линия
Параметры тега <HR>
  SIZE= Толщина
  WIDTH= Ширина (в пикселах или процентах)
  ALIGN= Выравнивание
  NOSHADE Без тени
<BIG> </BIG> Текст большими буквами
<SMALL> </SMALL> Текст маленькими буквами
<SUB> </SUB> Надстрочный индекс
<SUP> </SUP> Подстрочный индекс
<FONT> </FONT> Шрифт
Параметры тега <FONT>
  SIZE= Размер
  COLOR= Цвет
  FACE= Шрифт
<TABLE> </TABLE> Таблица
Параметры тега <TABLE>
  BORDER= Граница
  ALIGN= Выравнивание
  ROWSPAN= Указывает, какое количество ячеек будет объединено по вертикали для указанной ячейки
  COLSPAN= Указывает, какое количество ячеек будет объединено по горизонтали для указанной ячейки
<TR> </TR> Строка таблицы
<TD> </TD> Ячейка таблицы
<TH> </TH> Заголовок таблицы
Параметры тега <TH>
  BOLD Заголовок жирным
  ALIGN= Выравнивание
<CAPTION> </CAPTION> Подпись таблицы

 

 

Последнее изменение этой страницы: 2016-07-22

lectmania.ru. Все права принадлежат авторам данных материалов. В случае нарушения авторского права напишите нам сюда...