Изучив рубрику "CSS", вы узнаете, как с помощью каскадных таблиц стилей (CSS) можно легко управлять дизайном сайта и упростить создание самого сайта. Данная рубрика заменит Вам полноценный «учебник по CSS».

Бесплатные уроки CSS для начинающих

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

  • Реализуем эффект мозаичного слайдшоу

    Руководство по воссозданию эффекта слайдшоу из четырех плиток, подсмотренного на сайте Serge Thoroval. С помощью 3D трансформаций, переходов и анимаций мы реализуем плавный, приятный эффект, вдобавок сделаем еще пару вариантов эффектов.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 2 Июля 2014 Просмотров: 11370 Комментариев: 2   
  • Идея для классных ховер-эффектов

    Вашему вниманию представляем набор прикольных ховер-эффектов, в работе которых используются современные CSS техники и 3D эффекты.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 23 Июня 2014 Просмотров: 27684 Комментариев: 4   
  • Воссоздаем эффект подгрузки сеткой в стиле “Design Samsung”

    Если вы уже успели увидеть сайт Корпоративного Дизайнерского Центра Samsung, то, скорее всего, вы обратили внимание на стильный и симпатичный эффект загрузки сетки элементов. Повторим данный эффект.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 31 Мая 2014 Просмотров: 16589 Комментариев: 4   
  • 38 бесплатных CSS наработок выпадающих меню

    Навигация - неотъемлемая часть любого сайта. В этой статье вы найдёте подборку из множества готовых решений, которые могут вам пригодиться.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 12 Мая 2014 Просмотров: 309235 Комментариев: 5   
  • Делаем кнопку-индикатор прогресса в виде кольца

    Урок, показывающий, как можно претворить в жизнь концепцию кнопки индикатора прогресса в виде кольца, предложенную Колином Гарвеном. Для анимации прогресса в виде заполнения кольца будем использовать технику анимации линии в SVG, описанную Джейком Арчибальдом, а также будем отображать кнопку в успешном и ошибочном состояниях.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 8 Мая 2014 Просмотров: 19503 Комментариев: 4   
  • 3D-эффект для сетки элементов

    Воссоздание эффекта анимации, увиденного в приложении Маркуса Экхерта. Идея - переворачивать элемент сетки в пространстве, раскрывая блок на весь экран, и в итоге отображать некоторое содержимое, ассоциированное с элементом. Мы создали две демки, с вертикальным и горизонтальным поворотом.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 7 Апреля 2014 Просмотров: 17546 Комментариев: 4   
  • Animate.Css – CSS3 Библиотека для создания анимации

    За последние несколько лет в CSS появилось множество интересных фишек, которые делают веб разработку более увлекательной. Одной из таких вещей является CSS3 анимация. До CSS3, анимацию можно было реализовать только с помощью Javascript.

    Автор/переводчик: Станислав Протасевич
    Сложность:
    Создан: 6 Апреля 2014 Просмотров: 43557 Комментариев: 6   
^ Наверх ^