разработка сайтов
разработка и создание сайтов
Если у вас возникнут вопросы по языку html или просто по созданию сайтов, смело обращайтесь к нам на
форум в раздел "создание сайтов". Вам
обязательно ответят (мы гарантируем!).
Также рекомендуем посетить недавно открытый раздел
html. Здесь вы найдете краткий курс по основным
возможностям html, а также тематические авторские статьи.
Думаю веб мастерам будет интересен такой вид заработка, как игра на валютной бирже,
в последнее очень популярный в интернете. Читайте статьи раздела
forex.
как создать сайт /
Статьи
/
html
/
стильные курсоры
Вернуться в раздел "
html"
"стильные курсоры"
С помощью стилей можно переопределить вид курсора мыши и выбрать
один из пятнадцати доступных вариантов. Такая возможность, однако,
поддерживается только браузером Internet Explorer, а Netscape просто
игнорирует код HTML и мы увидим обычный курсор, словно ничего лишнего и
не писалось.
Прежде чем воспользоваться возможностью переделать вид курсора,
решите, а будет ли он использоваться к месту. Многих пользователей
подобные изменения могут ввести в заблуждение, когда, например, вместо
традиционной руки, появляющейся при наведении на ссылку, возникает
нечто другое. В большинстве случаев, лучше оставить все по умолчанию.
Значение |
Тест |
Пример |
| default |
|
cursor:default |
| crosshair |
|
cursor:crosshair |
| hand |
|
cursor:hand |
| move |
|
cursor:move |
| text |
|
cursor:text |
| wait |
|
cursor:wait |
| help |
|
cursor:help |
| n-resize |
|
cursor:n-resize |
| ne-resize |
|
cursor:ne-resize |
| e-resize |
|
cursor:e-resize |
| se-resize |
|
cursor:se-resize |
| s-resize |
|
cursor:s-resize |
| sw-resize |
|
cursor:sw-resize |
| w-resize |
|
cursor:w-resize |
| nw-resize |
|
cursor:nw-resize |
Синтаксис создания курсора очень прост. Следует определить класс и в
нем использовать один из типов курсора, описанных в таблице. Ниже в
примере показано, как можно переопределить вид курсора при наведении
его на разные ссылки.
Пример 1. Изменение курсора мыши при наведении его на ссылку
<html>
<head>
<style type="text/css">
.movelink { cursor: move }
.helplink { cursor: help }
</style>
</head>
<body>
<strong>
<a href="#" class="movelink" >Переместите этот текст</a>
<br>
<a href="#" class="helplink" >Справка</a>
</strong>
</body>
</html> |
Если вы желаете переопределить курсор мыши для всей веб-страницы
целиком, а не только для ссылок, воспользуйтесь селектором body.
Пример 2. Изменение вида курсора мыши для всей веб-страницы
<html>
<head>
<style type="text/css">
body { cursor: ne-resize }
</style>
</head>
<body>
<strong>
<a href="#">Переместите этот текст</a>
<br>
<a href="#">Справка</a>
</strong>
</body>
</html>
|
Также можно задать разный вид курсора для отдельных областей
веб-страницы используя теги DIV или SPAN. В этом случае вначале
определяется класс и его стиль, а затем он применяется к тегу,
например, SPAN. Такой подход позволяет описать стиль один единственный
раз, а затем применять его в любом нужном месте.
Пример 3. Изменение вида курсора мыши для разных областей веб-страницы
<html>
<head>
<style type="text/css">
.cross { cursor: crosshair }
.help { cursor: help }
</style>
</head>
<body>
<strong>
<p class="cross">На этом тексте курсор мыши примет вид перекрестья.</p>
<br>
<span class="help">
<a href="#">СПРАВКА 1 </a><br>
<a href="#">СПРАВКА 2</a><br>
<a href="#">СПРАВКА 3</a>
</span>
</strong>
</body>
</html>
|
Влад Мержевич
http://www.html.krsk.ru
Вернуться в раздел "
html"
Также рекомендуем посетить недавно открытый раздел
html. Здесь вы найдете краткий курс по основным
возможностям html, а также тематические авторские статьи.
