<rmcreative>

RSS

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

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

  1. Zen Coding для Akelpad и cheat sheet-ы

    25 января 2010

    К проекту Zen Coding, позволяющему быстро набирать HTML и CSS, добавилась частичная поддержка Akelpad и шпаргалки.

    Всё это можно забрать из файлов проекта

    Комментировать
  2. Равномерный фон под текстом

    20 января 2010

    http://chikuyonok.ru/u/2010/01/example.png

    Несколько интересных способов сделать padding фона у многострочной неквадратной надписи.

    Изучаем и предлагаем свои решения

    Комментировать
  3. Кроссбраузерный border-radius

    7 января 2010

    Одной из самых больных тем верстальщиков являются скругление уголков. В последнее время ситуация улучшается и браузеры потихоньку начинают поддерживать столь востребованные CSS-свойства. FF, Safari, Chrome делают это через свойства с своими особыми префиксами, Opera — скоро будет делать без префиксов. В стороне у нас стоит, как всегда, IE.

    К счастью, IE можно довольно красиво победить его же средствами. Одно из понравившихся мне решений, использующее VML и behaviour — curved-corner. Для использования сливаем border-radius.htc, складываем рядом с CSS и используем следующий код:

    .my-block {
      /* Для хороших браузеров */
      -moz-border-radius: 10px; /* Firefox */
      -webkit-border-radius: 10px; /* Safari, Chrome */
      -khtml-border-radius: 10px; /* KHTML */
      border-radius: 10px; /* CSS3 */
      /* Для плохих IE */
      behavior: url(border-radius.htc); /* учим IE border-radius */
    }

    Да, кстати, по соседству можно найти менее востребованный, но всё же полезный behaviour для box-shadow.

    Демо

    69 комментариев
  4. Вёрстка растягивающихся сайтов

    6 января 2010

    Сергей Чикуёнок в очередной раз радует качественной подробной статьёй. В этот раз был описан способ построения сложных растягивающихся макетов, похожий на тот, что я использовал в «фиксированная середина, плавающие колонки». Самое вкусное — решена проблема с округлением и вызываемым им подёргиванием в один пиксель при изменении размера окна.

    Читаем

    Комментировать
  5. Рендеринг: отрисовка, перерасчет дерева / макета, стилизация

    31 декабря 2009

    Перевод довольно подробной статьи о процессе отрисовки HTML и CSS.

    Читаем

    Комментировать
  6. CSS hack для Firefox 3.5

    25 декабря 2009

    И ещё один страшный и ужасный хак. На этот раз для FF3.5.

    Рассматриваем

    1 комментарий
  7. CSS hack для Opera 10.50, 10.xx, не 10.50

    25 декабря 2009

    Евгений Степанищев по случаю выхода пре-альфы Opera 10.50 придумал несколько полезных хаков, позволяющих отличить разные версии браузера.

    Читаем

    2 комментария
  8. Работа с цветовой моделью RGBA

    16 декабря 2009

    Неплохой перевод статьи про RGBA и его использование в Firefox, Safari, Opera и Chrome.

    Читаем

    Кстати, для IE можно обойтись относительно малой кровью:

    div {
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#99FFFFFF);
      zoom: 1;
    }

    Формат параметров: AARRGGBB, где AA — альфа-канал, RR — красный, GG — зелёный, BB — синий.

    3 комментария
  9. Фиксированная середина, плавающие колонки

    5 декабря 2009

    Вчера понадобилось получить довольно нестандартную трёхколоночную разметку: с фиксированной средней колонкой (например, шириной в 500px) и двумя боковыми, занимающими всё остальное пространство.

    http://rmcreative.ru/playground/fluid-fixed-fluid/target.png

    Оказалось, что решение довольно интересное.

    Читаем

    16 комментариев
  10. Универсальный способ декорирования блоков и нарезка спрайта

    11 ноября 2009

    http://chikuyonok.ru/u/2009/10/1.png

    Сергей Чикуёнок показывает универсальный способ декорирования растягивающегося блока произвольных размеров. Как обычно, подробно и в картинках.

    Читаем

    Подробнее про нарезку спрайтов можно прочитать у Александра Бойченко.

    Комментировать