Текст в css

Основные свойства CSS отвечающие за форматирование текста.

Свойство TEXT-ALIGN. Свойство выравнивания текста, аналогичное атрибуту ALIGN используемому в html. Может принимать четыре значения:

left - выравнивание по левому краю(значение по умолчанию); right - выравнивание по правому краю; center - выравнивание по центру; justify - выравнивание по ширине(по правому и левому краям одновременно).

Свойство TEXT- DECORATION. Позволяет оформлять текст определенным образом. Рассмотрим четыре основных значения данного свойства:

none - значение по умолчанию. Дополнительного оформления не происходит; underline - текст подчеркивается снизу; overline - текст надчеркивается сверху; line-through - текст перечеркивается;

Свойство TEXT-INDENT. Это свойство используется для создания отступов первой строки - абзацев. Значение лучше задавать в пикселах, это универсальный способ. Можно задать и в процентах от общей длины базовой строки (строки без отступа)

Списки в css

Рассмотрим основные свойства CSS , отвечающие за внешний вид списков.

Запомните: Все эти свойства универсальны, т.е. могут применяться как к упорядоченным спискам, так и к неупорядоченным.

Свойство LIST-STYLE-TYPE. Позволяет определять вид маркера элементов списка. Это могут быть цифры, буквы, квадратики, кружочки и др. Ниже приведены основные значения этого свойства:

• disk - маркер в виде закрашенного круга;

• circle - маркер в виде незакрашенного круга;

• square - маркер в виде закрашенного квадрата;

• decimal - обычные десятичные числа , например 1,2,3,4,5 и т. д. ;

• upper-roman - большие римские цифры, типа I, II, III, IV, V и т.д. ;

• lower-roman - маленькие римские цифры типа i, ii, iii, iv, v и т.д.

• upper-alpha - большие буквы A, B, C, D, E и так далее;

• lower-alpha - малые буквы типа a,b,c,d,e и т.д.;

• none - маркер списка отсутсвует;

Свойство LIST-STYLE-IMAGE. Это свойство позволяет поставить вместо маркера любое изображение. В качестве значения указывается ключевое слово url и затем в круглых скобках путь к изображению. В некоторых устаревших версиях браузеров, работает неккоректно.

ЗАДАНИЕ:

1. Разработать сайт на тему «Моя домашняя страница» используя возможности CSS для отображения текста.

2. Страница сайта должна содержать заголовок сайта и отражать информацию о вас (ваши фамилия и имя, школа, класс, ваши увлечения и хобби), а также (по возможности) вашу фотографию, о ваших родителях, сёстрах, братьях, дедушках и бабушках, о ваших друзьях и их увлечениях.

3. Необходимо использовать заголовки (использовать центрирование) и выравнивание абзацев текста по ширине. Для заголовков и основного текста необходимо использовать разные названия шрифтов сайта. В основном тексте необходимо использовать нумерованные и маркированные списки.

4. Общий фон сайта светлый, допускается использование светлого фонового рисунка

5. Проверить работоспособность сайта с помощью браузера

Практическое занятие № 12 Блоковая модель страницы, размеры, рамки, поля и отступы.

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

Коды формируемых профессиональных компетенций: ПК 1.1–1.5, ПК 3.3

Теоретические сведения