Css - Страница 18

Записи, помеченные ‘css’

Использование разных способов применения фильтров к изображениям

Перед многими разработчиками встает задача создать портфолио с фотографиями или другими графическими элементами, использующими эффекты при наведении указателя мыши, например, появление цвета у нецветного изображения. В этом уроке мы не будем обсуждать создание галерей изображений, а обсудим эффективность создания измененных версий изображений.
Далее... 1 Комментарий »
Создание эффекта выцветшей фотографии с использованием CSS

Ранее мы уже говорили о применении фильтров к изображениям и о создание черно-белых изображений из цветных с использованием CSS без необходимости в сохранении новых версий изображений. Можно использовать тот же подход для создания эффекта выцветшей фотографии с помощью тонирования ее сепией.
Далее... 1 Комментарий »
Создание текстового эффекта с использованием режимов наложения

Хотя этот эффект, вероятно, не так полезен, как другие эффекты с применением режимов наложения, он достаточно интересен, чтобы мы его подробно рассмотрели. В 1999 году Michael Bierut и Nicole Trice создали оформление для Architectural League’s Beaux Arts Ball того года. Это выдающийся образец графического дизайна, который можно воссоздать с помощью режимов наложения. Для начала, разметка:
Далее... 1 Комментарий »
Создание простых радиальных градиентов с использованием CSS

До недавнего времени каждый браузер реализовывал радиальные градиенты CSS немного разными способами, и, наконец, спецификация была приведена к единому общему стандарту. Очевидно, что спецификация для радиальных градиентов сложнее спецификации линейных градиентов из-за большего количества доступных вариантов.
Далее... 1 Комментарий »
Анимированная мигающая неоновая вывеска с использованием CSS

В прошлый раз в рубрике CSS мы публиковали урок «Создание анимированной неоновой вывески с использованием CSS». Сегодня мы продолжим эту тему и расскажем, как анимировать подобную неоновую вывеску. Используйте этот эффект для вашей типографики и других графических элементов.
Далее... 1 Комментарий »
Создание анимированной неоновой вывески с использованием CSS

Свойство тени текста можно использовать для разных целей дизайна веб-страниц: обведения текста, создания эффекта трехмерного текста и много другого. Еще можно создать с помощью множественных теней свойства тени текста эффекты, подобные неоновому свечению. Во многих уроках по созданию неонового свечения используется жирный шрифт и рассеянное свечение непрозрачных цветов. В этом уроке мы покажем, как создать [...]
Далее... 2 Комментариев »
Создание тени от приподнятого угла с использованием CSS

Первый способ создания отодвинутой тени, придающей элементу HTML видимость приподнятости от плоскости страницы, реализуется с помощью свойства тени блока с использованием не особо широко известного или как минимум часто упускаемого из виду значения распространения.
Далее... 1 Комментарий »
Выпадающее меню с использованием только CSS и недокументированных возможностей элемента флажка

В этом уроке мы рассмотрим создание выпадающего меню на чистом CSS. Этот способ основан на применении элемента HTML флажка и интересном использовании классов и селекторов CSS без единой строки JavaScript. Демонстрацию работы этого способа и весь нужный код можно увидеть ниже. Также можно скачать полный исходный код по ссылке в конце урока.
Далее... 6 Комментариев »
Использование ключевых идей анимации: предварительные и заключительные события

Можно создавать более реалистичные анимации CSS на веб-страницах, используя принципы, сформулированные «девяткой диснеевских стариков» — девятью выдающимися аниматорами, составлявшими ядро студии Уолта Диснея — и даже раньше, еще из древнегреческого театра.
Далее... 2 Комментариев »