<rmcreative>

RSS

Все заметки с тегом «CSS»

Можно уточнить:

  1. Шрифты, веб и Google

    19 мая 2010

    Сегодня Google обрадовал сразу несколькими проектами:

    Google Font API — API для удобного кроссбраузерного подключения нестандартных шрифтов. Использовать очень просто:

    <html>
      <head>
        <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
        <style>
          body {
            font-family: 'Tangerine', serif;
            font-size: 48px;
          }
        </style>
      </head>
      <body>
        <h1>Making the Web Beautiful!</h1>
      </body>
    </html>

    За кулисами происходит определение браузера и подсовывание ему нужного формата CSS и шрифта.

    Google Font Directory — набор довольно качественных свободных шрифтов, которые можно использовать при помощи Font API как в открытых, так и в коммерческих проектах.

    WebFont Loader — JavaScript библиотека, которая позволяет выйти за рамки стандартного Font API: использовать шрифты typekit и свои шрифты. Также есть некоторое количество полезных callback-ов.

    Использовать все эти чудесные возможности можно прямо сейчас.

    Ссылки по теме:

    4 комментария
  2. IE9 preview 2

    5 мая 2010

    Вышла вторая превью-версия IE9.

    Из свежего:

    4 комментария
  3. Дестктопные Opera Mobile 10 и Opera Widgets Mobile Emulator

    22 апреля 2010

    Отличное пополнение в наборе тестовых инструментов для сайтов. Opera зарелизила дестктопные Opera Mobile 10 и Opera Widgets Mobile Emulator для Windows, Linux и Mac.

    Подробное описание на английском

    Пользуемся

    Замечательно было бы заполучить в дополнение эмулятор Opera Mini, но пока придётся всё также тестить через апплет Java.

    1 комментарий
  4. Алексей Черенкевич, приёмы вёрстки

    30 марта 2010

    Алексей Черенкевич делится своим опытом вёрстки. Подход вполне интересный, но относиться, как и ко всей остальной информации, стоит критически.

    Читаем

    4 комментария
  5. Максимальная ширина элемента в Opera

    24 марта 2010

    Максимальная ширина элемента в Opera — 32766px.

    Достаточно почти для всех, но всё-таки не очень приятно.

    6 комментариев
  6. IE9 preview

    16 марта 2010

    Вот нам и показали IE9. От финала он, конечно, далёк, но посмотреть есть на что.

    • Более быстрый, чем в IE8, JavaScript-движок.

    • Поддержка некоторых фич CSS3: border-radius, RGBA, opacity, селекторы. К релизу обещают доделать ещё.

    • Поддержка HTML5: новые элементы, перехлёст тэгов, изменено поведение script и style (теперь можно получить их текст через DOM), API для выделения текста.

    • DOM L2 и немного DOM L3 (Events).

    • Поддержка SVG.

    • DirectX для рендеринга страниц.

    • Улучшена производительность отладчика, добавлен профайлер HTTP.

    Для того, чтобы зарабоали приятные дополнения, надо перевести IE в новый document mode — IE9, например, при помощи:

    <meta http-equiv="X-UA-Compatible" content="IE=IE9" />

    или

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    Полный список изменений

    Пробуем

    На работу установленного в системе IE никоим образом не влияет. Устанавливать можно не опасаясь повреждения системы.

    11 комментариев
  7. Кроссбраузерный CSS transform

    10 марта 2010

    CSS transform — штука очень интересная, но так как она не поддерживается IE, пользуются ей не очень часто. К счастью, для IE появляется всё больше библиотек, восполняющих его недостатки. На этот раз наш герой — cssSandpaper.

    Несколько демонстраций:

    cssSandpaper реализует поддержку IE через фильтр DXImageTransform.Microsoft.Matrix, использовать который сам по себе довольно сложно. При использовании библиотеки, доступны: -sand-transform, частичная поддержка -sand-box-shadow, -sand-gradient.

    Официальный анонс и библиотека

    4 комментария
  8. IE7.js 2.1 (beta3)

    8 марта 2010

    Обновился проект Дина Эдвардса, обучающий IE понимать стандарты.

    • IE 5.0 больше не поддерживается.

    • В quirks mode не применяются фиксы для layout (кроме IE5.5).

    • IE9.js для улучшения IE8.

    • Поддержка opacity теперь в IE9.js.

    • Новые селекторы (IE9.js):

      • :first-of-type.

      • :last-of-type.

      • :only-of-type.

      • :nth-of-type().

      • :nth-last-of-type().

      • убран :contains() (другие браузеры его не поддерживают).

    • Изменена поддержка PNG.

    • Куча багфиксов, в том числе и некликабельные ссылки.

    • Новый, более быстрый, селекторный движок (тот же, что будет в новом base2).

    Смотрим демо и Пробуем

    2 комментария
  9. ZenCoding 0.6 для Notepad++

    8 марта 2010

    В Notepad++ добавлена поддержка Zen coding 0.6. Долгое время реализовать это было затруднительно, но после того, как sieukrem добавил в Notepad++ поддержку JavaScript, Сергей Чикуёнок реализовал задуманное.

    Забрать можно из файлов проекта на Google Code

    3 комментария
  10. Steve Souders об особенностях клиентской оптимизации

    15 февраля 2010

    Steve Souders поделился сразу несколькими занятными фактами об особенностях современных и не очень браузеров.

    IE и независимые от протокола URI

    Internet Explorer 7 и 8 при использовании URI вида "//rmcreative.ru/css/main.css" будут загружать файл два раза. При явном указании http, https или использовании относительных URI этого не происходит.

    document.write и FireFox

    При загрузке скриптов через document.write в FF (в том числе и в 3.6) блокируются остальные загрузки.

    IE грузит стили с media="print"

    Причём делает это даже когда мы ничего не печатаем. При этом до полной загрузке блокируется рендеринг страницы.

    Подключаем стили через JavaScript

    Можно избежать блокировки, используя JavaScript:

    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = '/main.css';
    document.getElementsByTagName('head')[0].appendChild(link);

    Chrome, Safari и загрузка фоновых изображений

    Перечисленные браузеры начинают загружать фоновые изображения до подгрузки CSS. Таким образом, изображения будут загружены даже если в CSS они переопределены.

    Источники:

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