Css - Страница 44

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

Создаем адаптивный css-таймлайн c 3d эффектом

В этом уроке будем экспериментировать с перспективой и, используя input - «radio», создавать таймлайн структуру, используя чистый CSS. Идея будет заключаться в том, что при нажатии на соответствующем пункте «radio», контент будет немного расширятся и преобразовываться в 3D-подобную структуру. Мы будем использовать 3D-трансформации и переходы, а также сестринские селекторы.
Далее... 4 Комментариев »
Адаптивное Retina-меню

Сегодня мы будем создавать яркое меню для Retina-дисплеев. В зависимости от размера окна браузера меню будет автоматически изменять раскладку. Это десктопная версия — обычное расположение меню, двухколоночное меню для планшетов и мобильная версия со скрытой навигацией. Чтобы адаптировать меню под retina-дисплеи и избежать пикселизации при изменении размеров, мы будем использовать шрифты-иконки. Также обратите внимание, что некоторые эффекты работают [...]
Далее... 1 Комментарий »
Создание css-сетки миниатюр с динамическим всплывающим меню

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

В этом уроке мы будем делать шестигранник, который будет иметь фоновое изображение. Для этого будем использовать средства CSS3. С помощью трансформаций css3 мы можем поворачивать и делать различные манипуляции элементов DOM. Для этого будем использовать otate и masking. В области стилей урок может показаться немного сложным, но он объяснен иллюстрациями. Давайте приступим.
Далее... 6 Комментариев »
Создание выпадающих списков

Целью сегодняшнего урока будет показать, как создавать раскрывающиеся списки с помощью CSS и jQuery. Это будет пять списков, которые вы можете использовать для различных идей. В фрагментах кода вы не найдете никаких вендерных префиксов, но их сможете найти в исходных файлах.
Далее... 3 Комментариев »
Текстовые эффекты средствами CSS3

Типографика играет очень важную роль при создании сайта, и благодаря нововведениям в CSS уже сейчас можно создавать потрясающие текстовые эффекты. Они становятся всё более популярными с каждым днём. В этой статье мы будем рассматривать, как можно создать интересную типографику, используя только средства CSS. В уроке будет рассмотрена добавление градиента к тени, добавление эффекта рельефной тени к [...]
Далее... 4 Комментариев »
Создаем «аккордеон»-меню на css3

В этом уроке мы будем создавать «аккордеон»-меню. По сколько мы будем создавать меню на чистом css, оно будет работать в браузерах, которые поддерживают селектор псевдо-класса :target.
Далее... 10 Комментариев »
Простой слайдер с набором категорий

В этом уроке мы будем создавать простой слайдер минималистичного дизайна, используя СSS-анимации и jQuery. Идея будет заключаться в том, чтобы последовательно менять изображения в зависимости от выбранной категории. Данный слайдер отлично подойдет для дизайна онлайн-магазина, в котором будет немного категорий с небольшим количеством товаров.
Далее... 2 Комментариев »
Слайдер с эффектом перелистывания страниц с помощью CSS3 и jQuery

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