Обзор интернета Легкая версия Веб-мастеру Графика Игры, Спорт Программы Рецепты Время Рождество Библия
Свой сайт Хостинг Облака Домены Ресурсы Формы на сайт Раскрутка
404 ASCII HTML robots.txt SEO WYSIWYG Валидаторы Веб-мастеру Веб-редакторы Генератор иконок Интернет Справка Ссылки



Справка 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. Таким образом, то что мы видим и что печатаем не обязательно должно быть одно и тоже.


body {font-size: 12px}

Стили для печати:
@media print {
body {font-size: 20px}
}


Убираем графику 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

Источник 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 Текст внутри окон

Print Friendly and PDF




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





Подать статью
Рассылка
О нас

Почта

Графика

Шрифты
Логотипы
Брендбуки
Пиктограммы
Геральдика

Популярное

Уровень сайта
Регистрация сайта
Как сделать сайт
1 место на Google
Переводчики Онлайн
Пароль

Топ интернета

Ph4 в социальный сетях, рассылки и контакт

©2005-2018, Веб-студия Ph4 - Каталог интернета пользователю, веб-мастеру и дизайнеру v. 4.3