В мобильной версии Google Chrome при "клике" (точнее касании на тачскрине) на изображении на веб-странице, оно подсвечивается (выделяется) голубоватым фоном, что выглядит крайне некрасиво. Как убрать эту подсветку?
Вариант 1)
сделать фон выделенных картинок прозрачным (используя псевдоэлемент ::selection):
img::selection {
background: transparent;
color: #000;
}
для Firefox надо бы еще прописать:
img::-moz-selection {
background: transparent;
color: #000;
}
но увы, как раз для картинок в нем оно не работает почему-то (даже если прописать ::-moz-selection для всех элементов, картинки все равно подсвечиваются голубым. FF 17 десктопная версия) .
Серьезный минус только один - если кто-то захочет выделить картинку, то не поймет, что она выделена.
Вариант 2)
Хуже. Ограничивает юзабилити. (Для вас не годится - не поддерживается мобильными браузерами)
Вообще запретить выделять картинки. http://htmlbook.ru/css/-webkit-user-select
img {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
Дополнительные минусы:
Не поддерживается Opera и мобильными браузерами.
В Firefox не работает в таком виде. Если запретить выделение всех элементов, то работает и для картинок (FF 17)
К ответу выше добавлю, что лучше использовать модернизр - он посадит на хтмл класс тач, на который в цсс можно как раз посадить описанный выше цсс-код.
Вроде бы никак, это в браузере. У меня такое же в Опере Мини.
⇢