Любимые цитаты: Фарнсворт, районный санитарный инспектор, просил у жизни благ столь скупо, что каждая его победа была поражением. Уильям Берроуз, "Города красной ночи"

21 окт. 2008 г.

CSS эффекты на службе блогу

cssВот и ещё одно полезное утречко! Расследовал давно интересовавший меня вопрос - каким образом можно изменить стандартный синий цвет выделения текста - ну, то есть, когда вы выделяете фрагмент текста (например, для копирования) с помощью левой кнопки мыши... Увидел где-то, что такое возможно, очень меня впечатлило и я заразился идеей разузнать, как же добиться такого эффекта.

Решение в итоге нашёл, просмотрев CSS одного из сайтов. Это стало возможным благодаря (ещё одно открытие этого утра!) очень полезному дополнению моего любимого Mozilla Firefox - Web Developer (скачать с официального сайта). Собственно, вот оно решение:

::selection {background: #FFCC33; color:#000000;}
::-moz-selection {background: #FFCC33; color:#000000;}

Первая строка рассчитана на Safari и Opera, вторая - для Mozilla Firefox. Код я уже разместил в CSS своего блога (Макет -> изменить HTML) - результат вы можете увидеть, выделив фрагмент текста с помощью мышки (супер?!) Ага, в Internet Explorer этот эффект, конечно, не работает. Но почти 30% процентов пользователей (Firefox, Safari, Opera и +) всё-таки увидит вашу красоту и по заслугам её оценит! 30% - это достаточно много, чтобы постараться... Я так думаю!

Быстро подобрать цвет, не включая Photoshop, можно, например, здесь (подвигайте ползунки на "машинке" в самом верху страницы!)

Если вам вдруг пригодилась эта информация, поставьте, пожалуйста, ссылку на мой блог utrechko.blogspot.com!

9 коммент.:

М.Врединка комментирует...

Класс! То, что надо для своего сайта. Мелочь, но как приятно :)

Интернет-Утречко! комментирует...

М.Врединка, спасибо за коммент! =)

М.Врединка комментирует...

Безобразие! Я не согласна... у меня не получается :(((
Хм, а в какое место надо вставлять эти две строчки? :)

Интернет-Утречко! комментирует...

М.Врединка, привет! =)
Можно вставить в шаблон перед записью
body {

Используйте для просмотра эффекта браузер, отличный от Эксплорера - в нём не работает.

М.Врединка комментирует...

Действительно, доброе утречко! :)
Спасибо, попытаю счастья.
То, что в IE не работает почти ничего - об этом я догадалась давно. Что заставляет пользоваться им подовляющее большинство пользователей - для меня загадка. Я пользуюсь Opera, а недавно установила Google Chrome. Но вот незадачка - в Опере не работают "звездочки" )).
И, раз уж на то пошло, могу я задать один нескромный вопрос: каким браузером пользуетесь Вы? Извините мне мое любопытство.

Интернет-Утречко! комментирует...

:) Когда-то я пользовался IE и, как помнится, делал это, так как не знал и даже не задумывался об альтернативах - "Интернет он и есть Интернет", так я думал. Но с того времени много воды утекло. Сейчас я пользуюсь FireFox для Интернет-работы, для прогулок по сети Chrome (например, послушать музыку в вконтакте или написать в блог), а если хочется чем-то полюбоваться, то включаю Safari - в нём всё очень красиво имхо =) IE использую только если делаю сайт (иногда бывает) - смотрю, как это будет видеть большинство пользователей.
На счёт звёздочек в Опере - действительно, не работают. Жаль, конечно, но что-то в каком-то браузере почти обязательно не работает) Вот если бы вместо звёздочек в Опере вылезали бы крякозяблики, то это был бы повод для большого расстройства)

Анонимный комментирует...

Спасибо!
Пригодилось. :)

Интернет-Утречко! комментирует...

Пожалуйста! -)

Анонимный комментирует...

очень здорово! огромное спасибо!

Отправить комментарий

Примечание. Отправлять комментарии могут только участники этого блога.