1. Используйте CSS3 для создания динамического стека карт индекса
В этом руководстве вы узнаете, как создать динамический стек индексных карточек исключительно с использованием HTML и CSS3 и использовать такие функции CSS3, как преобразование и переход (для динамических эффектов) и @ font-face, box-shadow и border-radius ( для укладки).
Источник
2. Динамическое положение тени PNG и непрозрачность
Узнайте, как создать подвижный объект с помощью JavaScript.
Источник
3. Потрясающие наложения с CSS3
Градиентная граница, переходящая от светлого к более темному при движении сверху вниз, — вот фокус с этими наложениями. Для создания этого эффекта мы использовали свойство border-image, которое является небольшим хитрым дополнением к CSS.
Источник
4. Как создавать глубину и красивые 3D ленты только с помощью CSS3
Чтобы создать тень с помощью RGBa (цветовая модель, которая позволяет оптимизировать контраст с любым видом фона), мы будем использовать box-shadow. RGBa является стандартной моделью RGB (0,0,0 — 255,255,255) и добавляет последний параметр (а) для непрозрачности. Мы можем использовать эту модель и для других свойств, и она работает с новым браузером.
Источник
5. Полутоновое меню навигации с jQuery и CSS3
Научитесь создавать меню навигации в полутоновом стиле CSS3 и jQuery, которое позволит вам отображать анимированные фигуры в полутоновом стиле в соответствии с навигационными ссылками, а также предоставит простой редактор для создания дополнительных фигур.
Источник
6. Создание Coverflow с помощью CSS-преобразований
Узнайте, как создать эффект Coverflow, который фактически перемещается и анимируется в режиме реального времени, без использования холста или предварительно визуализированной графики.
Источник
7. Сойти с ума с помощью CSS-переходов
Вы узнаете, как преобразования CSS 3 и переходы WebKit могут дополнить способ представления изображений на вашем сайте.
Источник
8. Скользящий винил с CSS3
Чтобы создать скользящий виниловый эффект для демонстрации любимой музыки, мы берем стандартную обложку альбома, немного HTML и некоторые CSS3-переходы и преобразования.
Источник
9. Весело с CSS3 и Mootools
Эти примеры появились при экспериментировании со свойством extended в MooTools. Расширяя класс стилей, я мог бы добавить свойства CSS3 в инфраструктуру Core MooTools и сделать CSS3-анимацию.
Источник
10. Веселье с 3D CSS и видео
Зак Джонсон получал удовольствие от трехмерных эффектов с помощью CSS, таких как его изокуб выше, который представлен простым HTML (включая видео-тег для воспроизведения видео на поверхности!) И некоторыми CSS.
Источник