Вы здесь: Главная » CSS » Виды курсоров в css

Виды курсоров в css

Сегодня речь пойдет о css-свойстве cursor. Оно отвечает за вид курсора над элементами страницы

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

У этого свойства масса значений. Записывается оно так:

По умолчанию задано значение auto, и над текстовыми элементами возникает курсор, похожий на букву I, а над блоками без текста - в виде стрелки.

Но, возможно, вам нужно  показать, что элемент недоступен. Тогда понадобится значение not-allowed.

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

Можно перечислить несколько путей к изображениям. Если первое из них не может быть загружено, используется второе, третье и т.д. В этом случае синтаксис будет таким:

Не все браузеры поддерживают дополнительные формы курсоров. Например, Internet Explorer  не работает со многими значениями, но 11-ая его версия под именем Edge поддерживает почти все. Только в Firefox работают такие значения, как grab (расжатая рука, которая указывает что объект может быть захвачен,для перемещения) и grabbing (сжатая рука - для указания на то, что объект захвачен, можно перемещать). Не все курсоры поддерживает Opera ранних версий (11, 12). Учтите, что большая часть значений не входит в спецификацию CSS 2.1, они разработаны для CSS3.

Internet Explorer в качестве формата файла курсора поддерживает ICO, CUR и ANI. Поэтому обязательно нужно предусмотреть один из этих форматов при перечислении курсоров. Firefox, Chrome, Safari поддерживают форматы ICO, CUR, PNG, GIF, JPG.

Варианты курсоров

Результат (открыть в новой вкладке):

h.c. F. Porsche GmbH bajo su direccion ya ha conseguido trabajar en este tipo de proyectos, como de 6 cilindros de carreras de Auto Union y Volkswagen http://eco-driving.ru/porsche/new-porsche-911-gt2-rs-road-to-pikes-peak-hill-climb-2011-jeff-zwart-c En el ano 1939, se elaboro el primer automovil de la empresa — Porsche 64, que se convirtio en el progenitor de todos los futuros Porsche. Para la co

3 комментария

  1. Спасибо, очень полезная информация. Использовал на своей страничке.

  2. А где это все применяется?

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *