Как сделать текст в html курсивом


Как сделать текст в html курсивом

Как сделать текст в html курсивом

Как сделать текст в html курсивом



С помощью CSS можно определять стиль и вид текста. Аналогично тому, что используется тег <font>, задающий свойства шрифта, но стили обладают большими возможностями и позволяют сократить код HTML.

Свойства шрифта

Изменение начертания шрифта и его размера происходит через свойства CSS, которые описаны в табл. 1.

Табл. 1. Атрибуты 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=utf-8"> <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>

Ниже приведен результат данного примера (рис. 1).

Вид текста после применения стилей

Рис. 1. Вид текста после применения стилей

В табл. 2 приведены некоторые стилевые параметры для работы с текстом и результат их применения.

Табл. 2. Результат использования различных параметров шрифтов Пример Пример Пример Пример Пример 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

Свойства текста

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

Табл. 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%

Ниже, в табл. 4 приведены некоторые параметры текста и результат их применения.

Табл. 4. Результат использования различных параметров текста Пример: и это все о нем Пример: текст по центру Пример: Это не ссылка, а просто текст Пример: отступ первой строки Пример: полуторный межстрочный интервал text-transform: capitalize text-align:center text-decoration: underline text-indent: 20px line-height: 1.5
Источник: http://htmlbook.ru/content/svoystva-teksta


Как сделать текст в html курсивом фото


Как сделать текст в html курсивом

Как сделать текст в html курсивом

Как сделать текст в html курсивом

Как сделать текст в html курсивом

Как сделать текст в html курсивом

Как сделать текст в html курсивом

Как сделать текст в html курсивом

Читать еще

Контейнер для косметики своими руками

Чехол на угловой диван своими руками выкройки

Производство в домашних условиях искусственный мрамор