Создаем симпатичный аккордион при помощи CSS3

Сегодня мы узнаем, как создать симпатичный аккордеон на  чистом CSS3. Данный пример основан на Futurico UI Pro от Владимира Кудинова. Он будет работать во всех браузерах и устройствах, которые поддерживают селектор :target.

Создаем стилизованный HTML-список средствами CSS3

Стилизация HTML-списков всегда была непростой задачей, и я не единственный, кто так думает. Чтобы создать кроссбраузерный стилизованный список, нужно сначала удалить стили браузера по умолчанию и только после этого можно создавать собственные стили. Именно об этом и пойдет речь в данной статье, мы попробуем создать красивый стилизованной список используя огромные возможности CSS3.

Как создать слайдшоу с помощью CSS3

Сегодня мы создадим классное слайдшоу при помощи одного только CSS3 (без какого-либо JavaScript). Слайдшоу будет содержать левую и правую кнопки навигации, изображения и трекер бар. Для навигации по изображениям мы должны использовать кнопки влево/вправо или трекер бар.

Вот наш результат:

Как создать анимированный tooltip при помощи CSS3

Сегодня мы покажем вам, как создавать простые, анимированные подсказки с использованием CSS переходов и псевдо-классов :before и :after.

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

Создаем переходы для страниц при помощи CSS3

Я уверен, что вы часто видели на различных веб-сайтах необычные эффекты при переходе между страницами, большинство из них создавалось с помощью JavaScript. В этом уроке я покажу, как вы можете создать свой собственный эфект перехода, но вместо JavaScript я буду использовать CSS Transition и свойство :target.

Изображения, используемые в демо, от Matt Kaufenberg.

Эксперименты с background-clip: text

С помощью свойства CSS "background-clip: text" (которое в настоящее время поддерживается только в браузерах Webkit), мы можем добавить фоновое изображение для текстового элемента. Сегодня мы будем экспериментировать с ним и создадим несколько симпатичных примеров, добавив CSS3 переходы.

Изображения из примеров от Andreas Preis и Joanna Kustra.