css проблем с пользовательским курсором - PullRequest
Новая
       0

css проблем с пользовательским курсором

0 голосов
/ 09 мая 2020

Я только начал кодить, не осуждайте меня, если я говорю глупости. Пытаюсь сделать курсор в виде костюма для своего сайта, но это никак не работает. Я даже установил размер изображения - 32x32 пикселя. Это изображение, которое я пытался использовать

У меня не работает, и не только с этим изображением: я даже пробовал с другими, png и svg. Я использовал и «указатель», и «авто», но ничего. Не работает в Safari и не работает в Chrome. Может кто-то мне помочь, пожалуйста? Спасибо вам большое! Мой код

body{background-color: #F3F1EB; cursor: url("plane.png"), pointer;}

Ответы [ 3 ]

0 голосов
/ 09 мая 2020

Пожалуйста, проверьте, находится ли изображение в нужной папке. Я использую полный путь к картинке, которую вы указали, она работает. 

body{
  background-color: #F3F1EB; 
  cursor: url("https://i.stack.imgur.com/KDrS2.png"), pointer;
}
<h1>test</h1>
0 голосов
/ 09 мая 2020

Решение здесь !!! Сделайте это на уровне CSS: 

* {
   cursor: url("https://i.stack.imgur.com/KDrS2.png"), pointer;
}
0 голосов
/ 09 мая 2020

Ваш CSS в порядке, поэтому я могу только представить, что это одна из следующих проблем:

  1. Изображение plane.png не находится в той же папке, что и ваш. html файл
  2. Размер изображения plane.png больше 32x32 пикселей
  3. Вы не заключили свои CSS в <style></style> теги
  4. У вас нет содержимого в вашем <body>, поэтому CSS не срабатывает

Это проверено и работает: 

<html>
    <style>
        html {
        background-color: #F3F1EB; 
        cursor: url('plane.png'), pointer;
        }
    </style>
    <body>
       //Your page contents here
    </body>
</html>

Примечание: я использовал селектор HTML в целях тестирования.

Заключительный момент - изменение курсора на пользовательское изображение является плохой практикой по ряду причин. В основном это негативно влияет на UX сайта.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...