Как перейти с Bootstrap 3 на Bootstrap 4

Сегодня мы пробежимся по всем отличиям и новым возможностям между двумя версиями Bootstrap. Как правило, вам необходимо будет просто переименовать некоторые классы или поменять несколько простых параметров.

Продолжить

Анимированные животные на CSS и SVG

Сегодня я покажу вам, как использовать чистый HTML, упорядоченную CSS анимацию, а также SVG фильтры для реализации невероятной (и восхитительной) идеи - анимированные животные на веб-странице. Мы воспользуемся двумя методами для рисования животных: первый метод - простой HTML и CSS, второй метод - инлайновые фоновые SVG изображения.

Продолжить

Forecast Font – Иконочный шрифт погоды

Forecast Font - иконочный шрифт, который предназначен для создания многослойных иконок погоды. При помощи данного шрифта, вы сможете полностью контролировать внешний вид иконок, а не использовать только один цвет или стиль. Вы сможете изменить цвет, стиль или даже анимировать различные части иконок. Еще они полностью масштабируемые, это позволяет с легкостью использовать их на любых устройствах, нет необходимости создавать громоздкие спрайты изображений или использовать разные изображения для создания иконок погоды.

Продолжить

Панели с эффектом скольжения на CSS и jQuery

Мы давно не экспериментировали с шаблонами портфолио. Поэтому давайте создадим простой макет из блоков контента, к которым добавим переход от главной страницы (галерея), к странице проекта. Все панели будут перемещаться по оси Y (по оси X на мобильных устройствах), после чего появится содержимое данной панели (проекта).

Продолжить

Адаптивное меню для сайта на CSS3

В этом уроке мы создадим с вами адаптивное меню для сайта, используя только CSS3. Как вы знаете, многие люди заходят в интернет с мобильных устройств (таких как iPad, iPhone или Android) и важно чтобы эти пользователи, могли с комфортом посещать ваш сайт. Многие разработчики, создают адаптивного меню для сайта с использованием jQuery или JavaScript, но мы будем использовать только CSS.

Продолжить

Примеры анимации CSS псевдо-элементов before и after

Сегодня мы поэкспериментируем с анимацией и переходами CSS псевдо-элементов before и after, постараемся полностью раскрыть их потенциал. Немного поговорим об анимации псевдо-элементов before и after и рассмотрим четыре примера, которые используют специальные методы для достижения различных эффектов.

Продолжить

Плавное появление текста с помощью CSS анимации / CSS эффект текста

Сегодня я хочу показать вам, как создать интересные CSS эффекты текста с помощью CSS анимации и свойства text-shadow. Вы должно быть видели, эти жуткие текстовые эффекты в трейлерах фильмах, где текст исчезает на темном фоне. Увидев Introducting Briefs (который не является фильмом ужасов, а обзор интересного приложения), я решил воссоздать данный эффект текста с помощью CSS.

Продолжить

Создание меню в стиле YouTube

Сегодня мы создадим меню в стиле YouTube. Меню состоит из небольшой иконки меню, ссылки и списка элементов меню, которые появляются при нажатии на ссылку или иконку. Для того чтобы раскрыть меню, нужно нажать на иконку с правой стороны, возле первого пункта раскрывающегося списка, иконка меню с меткой поднимется на уровень выше, в то время как элементы списка постепенно появятся под ней. Мы добавим еще некоторые эффекты, чтобы сделать меню ещё более интересным.

Продолжить

Вход

Уважаемый пользователь! Мы обнаружили, что вы используете AdBlock и вынуждены скрыть часть материалов на нашем сайте. Siteacademy существует и развивается за счет доходов от рекламы. Просим внести наш сайт в список исключений или отключить Блокировщик рекламы на нашем сайте.