Коллекция теней от CSS свойство box-shadow

рейтинг 1.0 из 5
Привет всем! 
В сети появилась интересная штука. Думаю, некоторым она будет полезна. 

Наверняка, некоторые из вас замечали, что на разных сайтах используются практически однотипные тени в блоках, панели навигации и прочих контейнерах, плюс - минус пара пикселей в сторону прозрачности. Разработчики проанализировали ряд популярных сайтов, как наших, так и зарубежных, и попытались собрать максимально приближенные параметры используемых теней в одну большую библиотеку. Основная цель проекта - облегчить работу начинающим веб-дизайнерам и разработчикам в создании приятного и современного дизайна. Возможно и опытные дизайнеры почерпнут для себя что-нибудь интересное в этой разработке. 

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

Box-shadows.css - это коллекция простых и приятных css теней (box-shadow) для ваших проектов. В роли основы используется простой класс .bShadow. Сейчас коллекция насчитывает более 45 актуальных вариантов теней с номером, а так же три самостоятельных класса .bShadow.bShadow-light и .bShadow-inset. Они отлично подходят для использования в таблицах, для содержимого домашних страниц, контейнеров, навигации и других блоков вашего сайта. 

Коллекция не использует самостоятельные имена, как это сделано в animate.css, так как для данного проекта это не приемлемо и будет много путаницы. Тень блоков увеличивается по нарастающей, с различными отклонениями в ту или иную сторону, а за счет последовательности чисел можно подобрать оптимальный для себя вариант, не заучивая всевозможные имена. Это значительно упрощает работу с коллекцией. Также, на сайте встроена функция предпросмотра, благодаря которой, вы можете настроить цвет вашего фона сайта и блока, к которому хотите применить тень. Это весьма удобно. 

Еще у коллекции есть ряд других возможностей, например, использование эффекта при наведении (hover), с плавным переключением между тенями. Подробнее об этом написано здесь

По умолчанию, сайт написан на английском, но для тех, кто еще не в совершенстве владеет этим языком, имеется переключатель на русский язык. Также, на сайте проекта есть инструкция по подключению и генератор, в котором вы можете создать свой собственный набор стилей только из выбранных вами классов и использовать его на своем сайте. Попробуйте поэкспериментировать. Это действительно интересная работа. 

Если у вас есть пожелания, замечания или предложения по улучшению проекта, пишите в комментриях.
  • Дата: 25.05.2018, 19:40
  • Просмотры: 52
  • Отзывы: 0
Автор материала
...
...
...
...
Поделиться в социальных сетях

Правила публикации комментариев:
1. Запрещено оскорблять, унижать в грубой форме других пользователей.
2. Мат и грубые слова запрещены, даже в скрытой форме, для этого существуют масса слов которые заменяют мат.
3. Запрещено писать ссылки на другие сайты (За исключением официальных сайтов uCoz, например: blog.uсoz.ru)
4. Запрещено флудить и спамить, предлогать услуги (например: рипы, адаптации, помогу с установкой и т.д. )

Комментарии
Добавить комментарий