Форматирование текста
Форматирование др. элементов
Позиционирование
Таблица параметров
Табл. 1. Параметры тега <TABLE>
| Свойство |
Значение |
Описание |
Пример |
| align |
left
right
center |
Выравнивание таблицы. |
<table align="center"> |
| background |
URL |
Определяет изображение, которое будет использоваться в качестве фонового
рисунка таблицы. |
<table background="pic.gif"> |
bgcolor
|
#rrggbb |
Цвет фона таблицы. |
<table bgcolor="#ff9900"> |
| border |
n |
Толщина рамки в пикселах. |
<table border="2"> |
| cellpadding |
n |
Расстояние между ячейкой и ее содержимым. |
<table cellpadding="7"> |
| cellspacing |
n |
Дистанция между ячейками. |
<table cellspacing="3"> |
| cols |
n |
Задает количество столбцов в таблице, помогая браузеру в подготовке к
ее отображению. |
<table cols="3"> |
| nowrap |
|
Запрещает переносы строк в тексте. |
<table nowrap> |
frame
|
void
above
below
lhs
rhs
hsides
vsides
box
|
Задание типа рамки таблицы |
<table frame="hsides"> |
| rules |
all
groups
cols
none
rows |
Определяет, где рисовать границы между ячейками. |
<table rules="cols"> |
| width |
n
n% |
Минимальная ширина таблицы, можно задавать в пикселах или процентах. |
<table width="90%"> |
С помощью CSS можно определять стиль и вид текста. Аналогично тому, что используется
тег <FONT>, задающий свойства шрифта, но стили обладают
большими возможностями и позволяют сократить код HTML.
Свойства шрифта
Изменение начертания шрифта и его размера происходит через свойства CSS, которые
описаны в табл. 2.
Табл. 2. Атрибуты CSS для управления шрифтами
| Свойство |
Значение |
Описание |
Пример |
| font-family |
имя шрифта |
Задает список шрифтов |
P {font-family: Arial, serif} |
| font-style |
normal
italic
oblique |
Нормальный шрифт
Курсив
Наклонный шрифт |
P {font-style: italic} |
| font-variant |
normal
small-caps |
Капитель
(особые прописные буквы) |
P {font-variant: small-caps} |
| font-weight |
normal
lighter
bold
bolder
100-900 |
Нормальная жирность
Светлое начертание
Полужирный
Жирный
100-светлый шрифт,
900-самый жирный
|
P {font-weight: bold} |
| font-size |
normal
pt
px
% |
нормальный размер
пункты
пикселы
проценты
|
font-size: normal
font-size: 12pt
font-size: 12px
font-size: 120% |
В примере 1 показано использование параметров при работе со шрифтами.
Пример 1. Задание свойств шрифта с помощью CSS
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Шрифт</title>
<style type="text/css">
H1 {
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: 150%;
font-weight:
lighter;
}
</style>
</head>
<body>
<H1>Заголовок</H1>
<p>Обычный текст</p>
</body>
</html> В табл. 3 приведены некоторые стилевые параметры для работы с текстом и результат
их применения.
Табл. 3. Результат использования различных параметров шрифтов
| Пример |
Пример |
Пример |
Пример |
Пример |
| font-family: Verdana, sans-serif; font-size: 120%; font-weight:
light |
font-size: large; font-weight: bold |
font-family: Arial, sans-serif; font-size: x-small; font-weight:
bold |
font-variant: small-caps |
font-style: italic; font-weight: bold |
Свойства текста
Кроме изменения параметров шрифтов, можно управлять и свойствами всего текста.
Значения свойств приведены в табл. 4.
Табл. 3. Свойства CSS для управления видом текста
| Свойство |
Значение |
Описание |
Пример |
| line-height |
normal
множитель
точно
% |
Интерлиньяж (межстрочный интервал) |
line-height: normal
line-height: 1.5
line-height: 12px
line-height: 120% |
text-decoration
|
none
underline
overline
line-through
blink |
Убрать все оформление
Подчеркивание
Линия над текстом
Перечеркивание
Мигание текста |
text-decoration: none |
text-transform
|
none
capitalize
uppercase
lowercase
|
Убрать все эффекты
Начинать С Прописных
ВСЕ ПРОПИСНЫЕ
все строчные |
text-transform: capitalize |
| text-align |
left
right
center
justify |
Выравнивание текста |
text-align: justify
выравнивание по ширине |
| text-indent |
точно
% |
Отступ первой строки |
text-indent:15px;
text-indent:10% |
Ниже, в табл. 5 приведены некоторые параметры текста и результат их применения.
Табл. 4. Результат использования различных параметров текста
| Пример: и это все о нем |
Пример: текст по центру |
Пример: Это не ссылка,
а просто текст |
Пример: отступ первой строки |
Пример: полуторный межстрочный интервал |
| text-transform: capitalize |
text-align:center |
text-decoration: underline |
text-indent: 20px |
line-height: 1.5 |
|
