Скруглы — border-radius inset для картинок

Скрипты и советы | 26 июня 2015 4 143

Уроки CSS на Хабрахабре

Скруглы — border-radius inset для картинок

Некоторое время назад появилась задача для дизайнера сделать стилизованный под дикий запад сайт. Мне, как верстальщику, пришла задача от дизайнера сделать картинки и некоторые бэкграунды, стилизованные под дикозападские вывески.

На каждой странице в неизвестном количестве и неизвестных размеров. Задача усугублялась сложным фоном и необходимостью прозрачных дырок в изображениях.

Т.е. нужно было использовать border-radius:inset, которого, как оказалось, не существует…

Нарезать кучу картинок под каждую страницу и случай, само-собой, нереально и бессмысленно.

Заказчик не был одним из «адептов explorer 6», поэтому я решил упростить себе жизнь связкой jQuery и HTML5. 

Источник: Уроки CSS на Хабрахабре
[Перевод] CSS: интересные возможности border-radius

Что можно сделать с помощью CSS-свойства border-radius? Автор материала, перевод которого мы публикуем, говорит, что...

Подробнее
Блог им. RayZ / Задача: Кнопки в Internet Explorer и волшебные пространства

Столкнулся с проблемой укрощения кнопок под Internet Explorer. Для наглядности имеем следующий код: < html > <...

Подробнее
Падающий снег на сайт с помощью jQuery

Еще один способ сделать падающие снежинки на сайт в канун Нового года. В этот раз помог сайт my-dle.ru на котором и был...

Подробнее
Блог им. linuxxspb / HttpHandler для сжатия и компрессии *.js и *.css файлов

Всем известно, что «большая часть времени уходит на загрузку компонентов страницы: картинок, таблиц стилей, скриптов,...

Подробнее
Быстрые сетки для верстальщиков

Любому верстальщику, перед которым встала очередная задача по вёрстке адаптивного макета, нужны сетки. В большинстве...

Подробнее
Выравниваем блок по центру страницы

Очень часто стоит задача выровнять блок по центру страницы / экрана, да ещё и так, чтобы без ява-скрипта, без задания...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms/

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями