Мир Фантастики

Fan-Tv
Главная | Регистрация | Вход Приветствую Вас Гость | RSS

Меню сайта
Основное меню сайта
Новости сайта
Возмездие:
1сезон
Март-2015

Звездные врата:
Звездные врата
Февраль-2016

Звездные врата:1-й отряд(SG-1)

SG-1.1сезон(Дети богов)
Июль-2015
Друзья сайта
Рекомендованный Браузер
Mozilla Firefox

Поиск
Поиск

Календарь
Календарь
«  Март 2024  »
ПнВтСрЧтПтСбВс
    123
45678910
11121314151617
18192021222324
25262728293031

Архив записей
Наш опрос
Оцените мой сайт
Всего ответов: 1
Мини Чат
Мини-чат

Статистика
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0

Вход на сайт

Теги CSS и их значение(свойства таблицы CSS)!

страница 1

 



Еще страницы -Теги CSS- стр 1..стр 2..стр 3..стр 4..стр 5..стр 6..стр 7..

                                                                        стр 8..стр 9..стр 10...

 

 

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

 

 

 

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


text-decoration: - задает специальное оформление текста: подчеркнутый, зачеркнутый и т.п.
text-decoration: none; - отменяет любое специальное оформление (значение по умолчанию для большинства тегов);
text-decoration: underline; - подчеркивает текст (значение по умолчанию для тегов <A>, <INS> и <U>);
text-decoration: overline; - черта сверху текста;
text-decoration: line-through; - зачеркивает текст (значение по умолчанию для тегов <DEL>, <S> и <STRIKE>);
text-decoration: blink; - мигание текста (отсутствует в IE);
text-decoration: uppercase; - все буквы становятся заглавными;
text-decoration: lowercase; - все буквы становятся маленькими (прописными);
text-decoration: capitalize; - каждое слово в строке начинается с большой буквы.

Пример:

text-decoration: underline;    <!--подчеркивание-->
 

text-underline-position: - задает местонахождение линии подчеркивания: выше или ниже текста. Имеет смысл, если атрибут text-decoration равен underline или overline.
text-underline-position: below; - помещает линию подчеркивания под текстом (значение по умолчанию);
text-underline-position: above; - над текстом ("надчеркивание").

Пример:

text-underline-position: above;    <!--надчеркивание-->
 

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

Пример:

text-align: center;    <!--выравнивание по центру-->
 

text-align-last: - задает горизонтальное выравнивание последней строки абзаца.
text-align: auto; - выравнивает последнюю строку абзаца так же, как и остальные строки (основываясь на значении атрибута text-align) (значение по умолчанию);
text-align-last: inherit; - так же, как выровнен текст родителя;
text-align-last: left; - выравнивание текста по левому краю;
text-align-last: right; - выравнивание по правому краю;
text-align-last: center; - выравнивание по центру;
text-align-last: justify; - выравнивание по обоим краям (по ширине).

Пример:

text-align-last: left;    <!--выравнивание по левому краю-->
 

text-indent: - устанавливает отступ красной строки.
Отступ может быть задан как абсолютной величиной X, так и процентом от ширины родителя %. Значение по умолчанию 0.

Пример:

text-indent: 25pt;    <!--отступ в 25 пунктов-->
 

text-height: - интервал между строками текста.
Интервал может быть задан как абсолютной величиной X, так и процентом от ширины родителя %.

Пример:

text-height: 5pt;    <!--интервал в 5 пунктов-->
 

text-transform: - задает преобразование регистра символов текста.
text-transform: none; - отключает любые преобразования регистра символов (значение по умолчанию);
text-transform: capitalize; - преобразует первую букву каждого слова текста в верхний регистр;
text-transform: uppercase; - преобразует все символы текста в верхний регистр;
text-transform: lowercase; - в нижний регистр.

Пример:

text-transform: none;    <!--запрещено всякое преобразование-->
 

clear: - задает поведение текста при "обтекании" им некоторых элементов страницы, таких как изображения.
Атрибут задается для текста, а не для элемента страницы, который он будет "обтекать".
clear: none; - разрешает тексту "обтекать" элемент страницы (значение по умолчанию);
clear: left; - запрещает тексту "обтекать" элемент страницы с левой стороны;
clear: right; - с правой стороны;
clear: all; - с обеих сторон.

Пример:

clear: left;    <!--запрещено обтекание текста с левой стороны-->
 

word-spacing: - определяет дополнительное расстояние между словами в тексте.
Значение этого атрибута может быть задано либо абсолютной величиной Х в одной из поддерживаемых CSS единиц измерения, либо предопределенным значением normal, задающим стандартную величину расстояния между символами.
Значение по умолчанию normal.

Пример:

word-spacing: 10pt;    <!--дополнительное расстояние между словами в 10 пунктов-->
 

word-wrap: - устанавливает, будет ли строка, выходящая за границы элемента страницы и не содержащая пробелов, переноситься по словам.
word-wrap: normal; - запрещает переносить строки по словам (значение по умолчанию);
word-wrap: break-word; - разрешает.

Пример:

word-wrap: normal;    <!--запрет на перенос слов-->
 

word-mode: - задает направление строк текста: горизонтальное или вертикальное.
word-mode: lr-tb; - задает обычное горизонтальное расположение строк текста; текст пишется слева направо и сверху вниз (значение по умолчанию);
word-mode: tb-rl; - поворачивает текст на 90° по часовой стрелке; при этом он будет писаться сверху вниз и справа налево.

Пример:

word-mode: lr-tb;    <!--направление слева направо-->
 

leter-spacing: - определяет расстояние между символами в тексте.
Значение этого атрибута может быть задано либо абсолютной величиной Х в одной из поддерживаемых CSS единиц измерения, либо предопределенным значением normal, задающим стандартную величину расстояния между символами.
Значение по умолчанию normal.

Пример:

leter-spacing: normal;    <!--стандартное расстояние между символами-->
 

line-height: - задает вертикальное расстояние между строками текста.
Высота может быть задана как абсолютной величиной Х, так и процентом % от высоты родителя. Предопределенное значение normal задает стандартное расстояние.
Значение по умолчанию normal.

Пример:

line-height: normal;    <!--стандартное расстояние между строками-->
 

direction: - задает порядок чтения текста: слева направо или справа налево.
direction: ltr; - задает порядок чтения слева направо (значение по умолчанию);
direction: rtl; - справа налево;
direction: inherit; - заставляет наследовать порядок чтения у родителя.
Для документов, составленных на европейских языках, порядок чтения всегда слева направо (ltr).

Пример:

direction: ltr;    <!--порядок чтения слева направо-->
 

unicode-bidi: - задает поведение встроенных элементов при изменении направления письма с помощью атрибута direction.
unicode-bidi: normal; - меняет направление письма и у родителя (используется по умолчанию);
unicode-bidi: embed; - меняет направление письма только у встроенного элемента;
unicode-bidi: bidi-override; - аналогично embed за тем исключением, что направление письма меняется согласно значению атрибута direction, независимо от локальных установок Web-обозревателя.

Пример:

unicode-bidi: ltr;    <!--порядок чтения слева направо-->
 

accelerator: - позволяет указать, содержит ли текст элемента страницы клавишу-ускоритель. Клавиша-ускоритель - это особая клавиша на клавиатуре, при нажатии которой вместе с клавишей <Alt> происходит переход к данному элементу страницы.
accelerator: true; - указывает, что текст содержит клавишу-ускоритель;
accelerator: false; - не содержит.
Значения по умолчанию не имеет.

Пример использования:

<LABEL for="txtName"><U style="accelerator: true">И</U>мя</LABEL>
<INPUT type="text" id="txtName" accesskey="B" value="Имя пользователя">
В этом случае символ "И" в слове "Имя" будет подчеркнут. Если в региональных настройках операционной системы Windows была выбрана опция Скрыть индикаторы клавиш-ускорителей до нажатия Alt, этот символ не будет подчеркнут, пока пользователь не нажмет клавишу <Alt> на клавиатуре.

 

 

 

Введение в CSS для новичков

 

 

 

Каскадные таблицы стилей - CSS - что это такое? Каскадные таблицы стилей или Cascading Style Sheets (CSS) это набор параметров форматирования, который применяется к элементам веб-страницы для управления их видом и положением. Стили являются удобным и эффективным инструментом при верстке веб-страниц и оформления текста, ссылок, изображений и других элементов. При использовании стилей уменьшается, а при использовании внешних файлов стилей, уменьшается значительно объем ваших страничек, т.к. этот файл кэшируется и при следующем обращении к нему стили подгружаются из кэша. Таким образом увеличивается скорость загрузки страничек, что немаловажно для ваших пользователей.

 

Сайт это не просто набор связанных между собой документов, но и единое расположение основных блоков, и их оформление. Применение единообразного оформления заголовков, основного текста и других элементов создает преемственность между страницами и облегчает пользователям работу с сайтом и его восприятие в целом. Разработчикам же использование стилей существенно упрощает проектирование дизайна.

 

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

 

В настоящее время при создании сайтов предполагается активное использование стилей для управления видом элементов веб-страниц и их верстки, а это в свою очередь предполагает знание свойств CSS и их правильное применение на сайте. Для этого и создано данное руководство, чтобы на примерах показать действие каскадных таблиц стилей. И если Вы готовы, тогда приступим...

 

 

 

Copyright MyCorp © 2024
Конструктор сайтов - uCoz