ОБЗОР ИНТЕРНЕТА
ВЕБ-МАСТЕРУ
ГРАФИКА
РЕДАКТОР
ИГРЫ
ПРОГРАММЫ
ТВ/РАДИО
ОНЛАЙН
КУЛИНАРНЫЕ РЕЦЕПТЫ
РОЖДЕСТВО
БИБЛИЯ
ОНЛАЙН
Случайная страница

Справка CSS

http://texster.ru

Онлайн редактор - подбор шрифтов и создание CSS стилей для текста.

Курсоры

cursor:crosshair <td style=CURSOR:crosshair;> Ваш текст </td> CURSOR:crosshair
cursor:move <td style=CURSOR:move;> Ваш текст </td> CURSOR:move
cursor:e-resize <td style=CURSOR:e-resize;> Ваш текст </td> CURSOR:e-resize
cursor:ne-resize <td style=CURSOR:ne-resize;> Ваш текст </td> CURSOR:ne-resize
cursor:nw-resize <td style=CURSOR:nw-resize;> Ваш текст </td> CURSOR:nw-resize
cursor:n-resize <td style=CURSOR:n-resize;> Ваш текст </td> CURSOR:n-resize
cursor:sw-resize <td style=CURSOR:sw-resize;> Ваш текст </td> CURSOR:sw-resize
cursor:se-resize <td style=CURSOR:se-resize;> Ваш текст </td> CURSOR:se-resize
cursor:s-resize <td style=CURSOR:s-resize;> Ваш текст </td> CURSOR:s-resize
cursor:w-resize <td style=CURSOR:w-resize;> Ваш текст </td> CURSOR:w-resize
cursor:text <td style=CURSOR:text;> Ваш текст </td> CURSOR:text
cursor:wait <td style=CURSOR:wait;> Ваш текст </td> CURSOR:wait
cursor:help <td style=CURSOR:help;> Ваш текст </td> CURSOR:help
cursor: pointer; cursor: hand <td style=cursor: pointer; cursor: hand;> Ваш текст </td> cursor: pointer; cursor: hand

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

БУКВИЦА

<style>
P:first-letter {font-size:200%;float:left}
P {font-size:12pt;line-height:12pt}
</style>

Таким образом можно просто выделить другим образом первую букву, напр. сделать другим цветом или выделить жирным.

Задать кодировку в CSS

@charset "utf-8";

ОТСТУПЫ КАРТИНОК В OPERA

К сожалению, в этом случае браузеры понимают стиль по-разному, решает эту проблему -


<style type="opera/css">
.prm { margin-bottom: -2px; }
</style>

ССЫЛКИ

A:link IMG { border: 2px solid blue }
A:visited IMG { border: 2px solid red }
A:active IMG { border: 2px solid lime }

A.blank { color: orange } /* внешняя ссылка */

ПЕЧАТЬ

содаем print.css

Например, у вас есть файл стиля style.css и на него стоит ссылка

<link href=style.css type=text/css rel=stylesheet>

Мы создаем дополнитесьный файл стиля и называем его, напр. print.css, на него ссылка будет выглядеть иначе:

<link rel=stylesheet type=text/css href=print.css media=print>

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

Убираем графику img {display:none}

Убираем top, menu, footer и определяем параметры текста.

#top, #menu, #footer {display: none}
#text {position: absolute; top: 0px; left: 0px; width: 100%; font: 14pt "Times New Roman", Times, serif;}

Можно придать параметры всем заголовкам (H1, H2, H3 ...) сразу, напр.

h* {text-align: left;}

Придумываем тег, напр. <ph4></ph4> и пишем в style.css

ph4 {visibility: hidden;}

и он не отображается в браузере.

А в print.css пишем

ph4 {visibility: visible;}

Это будет вроде водяного знака.

Как использовать стили операционной системы в CSS

Источник http://habrahabr.ru/blogs/css/68699/


В CSS 2.1 появилась одна интересная фича, о которой не все знают - это возможность задавать на веб-странице шрифты и цвета, которые используются в текущей системной теме операционной системы.
Это может быть полезно в ситуациях, когда вы хотите приблизить интерфейс вашей страницы к пользовательскому интерфейсу операционной системы. Например, вы хотите написать Adobe AIR приложение, или сделать справочный интерфейс, наподобие нативной chm-справки (вот как здесь: manual.pohape.ru/).

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

Системные шрифты

Системные шрифты задаются обычным свойством font всего с одним параметром - тип шрифта. Разумеется, тип начертания, размер и прочие атрибуты уже содержатся внутри этого параметра.

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

.menu
{
font: menu;
}

Полная таблица всех доступных значений:

Значение Описание
caption Шрифт на управляющих элементах (кнопки, радио, выпадающие списки)
icon Шрифт для иконок
menu Шрифт, используемый в системных меню
message-box Шрифт в диалоговых окнах
status-bar Шрифт в строке состояния

Системные цвета

Системные цвета могут быть назначены для любого свойства, поддерживающего значение color.

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

.dialog
{
color: WindowText;
background-color: Window;
}

Полная таблица всех доступных значений:

Значение Описание
ActiveBorder Цвет активной рамки окна
ActiveCaption Цвет заголовка активного окна
AppWorkspace Цвет фона в приложениях с MDI-интерфейсом
Background Фон рабочего стола
ButtonFace Цвет лицевой поверхности для 3d-элементов (например кнопки)
ButtonHighlight Цвет тени в 3d-элементах в положении "лицом от света"
ButtonShadow Цвет тени для 3d-элементов
ButtonText Текст у нажатой кнопки
CaptionText Цвет текста в лейблах
GrayText Цвет неактивного (заблокированного) текста
Highlight Цвет выбранного пункта меню
HighlightText Цвет текста внутри элемента, находящегося под выделением
InactiveBorder Неактивная рамка окна
InactiveCaption Цвет неактивного заголовка окна
InactiveCaptionText Текст внутри неактивного заголовка окна
InfoBackground Цвет фона для информационных тултипов (подсказок)
InfoText Текст внутри тултипов
Menu Фоновый цвет элементов меню
MenuText Цвет текста внутри меню
Scrollbar Цвет скроллбара
Window Фоновый цвет окон
WindowFrame хз ;) (может в комментариях подскажут)
WindowText Текст внутри окон

Рекомендовать сайт другу | | Условия размещения статьи

Рассылка

22 мая 2012
Веб-справка
Главная
Веб-словарь
Полезные ссылки
Web soft
Лучшие веб-утилиты
Онлайновые WYSIWYG
WAP софт
Учебники-справочники
htaccess
CHMOD
ERROR - таблица кодов возврата
МЕТА-теги
CSS
MySQL шпаргалки
robots.txt
RSS
Спецсимволы для HTML
Европ.языки в HTML
Греческий в HTML
Иврит в HTML
Защита от авто-заполнения форм
Redirect
Валидность
Leet