Я давно смотрю справку по PHP онлайн на сайте php.net. Потому что там к каждой функции, к каждой страниче есть комментарии пользователей, из которых подчас узнаёшь очень интересные моменты. А также экономишь много часов на поиск багов.

Недавно все эти комментарии стали покрыты каким-то непонятным "серым сглаживанием". Недолгое исследование показало, что это результат применения шрифта Consolas.

первый - Consolas, второй - он же, но с включённым ClearType [ссылка]

Хочу сказать, что я и так недолюбливаю ClearType. А если дело касается таких извращений – то хочется как можно быстрее избавиться от этого.

Первый способ - это просто включить ClearType.

• В Internet Explorer 7 - это Сервис / Свойства обозревателя / Дополнительно / Мультимедия - Всегда использовать ClearType для HTML.
• Opera - хотя пока и не поддерживает сглаживание шрифтов, но можно включить ClearType для всех приложений Windows: На рабочем столе Свойства / Оформление / Эффекты / галочка Применять следующий метод сглаживания экранных сшифтов, выбор: ClearType.

Второй - отключить шрифт Consolas на php.net

• Вместо того, чтобы удалять из Панель управления / Шрифты - мы в
• Opera: в opera:config включим User CSS в Author и User Display Mode, после чего: прав. кнопкой на сайте php.net / Настройки для сайта / Вид / Моя таблица стилей - укажем путь к файлу содержащему строчку:

  code, pre, tt { font-family: "Courier New", Courier, monospace !important; }

На картинке ниже – мой блог в браузере Opera с включёнными картинками и без:

HTML:

<a class="imgoff" style="width:100px; height:50px;" href="#">
    LogoImgText
    <span class="imgon" style="background-image:url(images/logo.gif);"></span>
</a>

CSS:

.imgon {
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    cursor: pointer;
    cursor: hand;
}
.imgoff {
    display: block;
    position: relative;
    overflow: hidden;
}

Соответственно, преимущество такого способа в том, что можно создать неограниченное количество таких картинок. При этом не меняя CSS. Достаточно только указать width/height и url картинки в inline-стилях (смотрите на них, как на обычные аттрибуты тэгов).

P.S: Чтобы текст центрировать по вертикали, укажите (в <a style=) line-height равный height'у.

Прочитав про Сглаженные закругленные углы без использования изображений, я уже было подумал создать сервис, переводящий картинки в html-код.

Например, для защиты e-mail от спама - его обычно переводят в картинку. Задача в том, чтобы, если у пользователя отключены картинки, он всё равно видел бы e-mail.

Я даже придумал название домена для этого сервиса - image2html.com. Классно?

Увы, меня опередили - сервис появился 1 января этого года.

Наслаждайтесь!
(иногда картинка кэшируется - надо подождать, или переименовать)

Далее »