Невозможно отучить людей изучать самые ненужные предметы.
Введение в CSS
Преимущества стилей
Добавления стилей
Типы носителей
Базовый синтаксис
Значения стилевых свойств
Селекторы тегов
Классы
CSS3
Надо знать обо всем понемножку, но все о немногом.
Идентификаторы
Контекстные селекторы
Соседние селекторы
Дочерние селекторы
Селекторы атрибутов
Универсальный селектор
Псевдоклассы
Псевдоэлементы
Кто умеет, тот делает. Кто не умеет, тот учит. Кто не умеет учить - становится деканом. (Т. Мартин)
Группирование
Наследование
Каскадирование
Валидация
Идентификаторы и классы
Написание эффективного кода
Вёрстка
Изображения
Текст
Цвет
Линии и рамки
Углы
Списки
Ссылки
Дизайны сайтов
Формы
Таблицы
CSS3
HTML5
Блог для вебмастеров
Новости мира Интернет
Сайтостроение
Ремонт и советы
Все новости
Справочник от А до Я
HTML, CSS, JavaScript
Афоризмы о учёбе
Статьи об афоризмах
Все Афоризмы
Помогли мы вам |
С помощью CSS разработчики могут создавать на сайтах весьма интересные эффекты и даже анимацию. Возможности нового CSS3 значительно расширили доступный набор их инструментов. В интернете имеется достаточно много разных примеров, библиотек и сервисов, где каждый может посмотреть и скачать те или иные эффекты. Про некоторые генераторы CSS3 и HTML5 мы уже писали, сегодня рассмотрим еще 2 интересных проекта.
Animate.css – набор классных, веселых кроссбраузерных(!) вариантов анимации для веб-сайтов. Вы можете использовать их как для домашних страниц, разного рода слайдеров, так и для серьезных коммерческих проектов.
На странице сможете попробовать все варианты анимации. Просто кликаете по одной из кнопок с названием эффекта. Всего имеется несколько категорий для преобразований: привлекающие внимание, поворачивающиеся, затухающие, вращающиеся, выпрыгивающие и т.п. Внизу есть информацию о том, что набор Animate.css применяется на сайтах EA, Foursquare, Disney.
Узнать о том как использовать набор можете на Github вот здесь. Это, в принципе, не так сложно – вы просто подключаете файл стилей animate.css в head. А затем добавляете класс “animated” с названием эффекта. Можете использовать стили совместно с jQuery и объединять с разными другими эффектами.
Effeckt.css – подборка разных CSS эффектов для веб-приложений, которая постоянно пополняется новыми фишками. Отбираются для нее только правильно работающие, удобные и полезные “приемчики”.
Как и в прошлом случае, здесь есть специальная страница с демонстрацией всех имеющихся эффектов. Они также разделены на группы: модальные окна, кнопки, списки, скроллы, навигация, заголовки, элементы формы, табы и т.п. Каждый эффект можно потестировать онлайн. Вот прикольное видео с демонстрацией некоторых из них.
А вот ссылка на github где найдете описание библиотеки с инструкциями по применению. В целом оба набора (Animate.css и Effeckt.css) весьма хороши. Веб-разработчикам должны пригодиться!
|
|