CSS

Категория:
Опубликовано:

Video.js - делаем видео адаптивным

Video.js Fluid Width

Video.js - популярная библиотека для вывода HTML5-видео.

К сожалению, имеет некоторые проблемы с адаптивностью - исправляем.

Категория:
Опубликовано:

Code style для компилируемых SASS-файлов в PHPStorm

PHPStorm and SASS

SASS - значительно ускоряет разработку.

Также, он имеет несколько настроек, с помощью которых можно влиять на вид компилируемого CSS-файла.

Ниже, приведу примеры, как в PHPStorm'е можно эти настройки применять.

Категория:
Опубликовано:

Фильтры CSS

CSS filters

Негатив, Сепия, Контрастность, Цветовой тон, Насыщенность, Размытие...

Что за?.. Фильтры? Как в фотошопе?

Да! Все это можно делать с помощью CSS.

Не знали? Давайте расскажу как.

Категория:
Опубликовано:

Кроссбраузерное вращение (анимация) элемента

Вращение элемента

"GIF уже не торт"

XXI век, CSS3, программная анимация на стороне клиента...

В общем, будем крутить блоки, все на чистом CSS, с поддержкой максимального количества браузеров "староверов".

Категория:
Опубликовано:

Анимация блоков при прокрутке

Все популярнее становятся сайты с анимированными блоками.

Ниже рассмотрим возможность анимации с помощью Animate.css и jQuery Viewport Checker'а.

Категория:
Опубликовано:

Как подключить Font Awesome к теме Drupal

Font Awesome for Drupal

Font Awesome уже используется, практически, как стандарт для добавления иконок на сайт.

Оно и не удивительно, ведь это дает, простоту и практичность в использовании, а главное скорость и полную кроссбраузерность.

Я уже рассказывал о том как использовать Font Awesome с помощью псевдоклассов ::before и ::after в одном из предыдущих постов, и сейчас рассмотрим несколько способов подключения этой замечательной библиотеки шрифтов к нашему сайту.

Категория:
Опубликовано:

Анимация на CSS3 с помощью Animate.css

Animate.css

Анимация на CSS еще недавно было сродни фантастике.

Но, уже сейчас, CSS3 плотно ворвался в наши трудовые будни своими transition, transform и прочими мимимишками.

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

Категория:
Опубликовано:

Убираем стандартный Throbber

Throbber

Очень часто портит верстку. Смещает блоки. Разрывает содержимое... В общем мешает.

Убираем его.

Или заменяем на более приятный.

Категория:
Опубликовано:

Кроссбраузерный градиент на CSS

Градиент на CSS

Фон в виде градиента основанный на CSS ранее был мечтой любого веб-дизайнера. К счастью прогресс не стоит на месте, и уже сейчас, все современные браузеры работают с CSS3, в котором это вполне осуществимо с помощью свойств background - linear-gradient или radial-gradient. Но есть друзья, которые по тем или иным причинам пользуются WEB-динозаврами. Специально для таких решаем эту задачу кроссплатформено.

Категория:
Опубликовано:

Font Awesome - набор иконок для стилизации

Font Awesome

Очень удобный и быстрый способ вывести иконку пункта меню, в заголовке и в любом месте сайта, на чистом CSS.

Часто появляются подобные задачи, да и признаться, вид у сайтов с иконками куда приятнее. И если нет четких ТЗ по иконкам, или просто лень рисовать - этот вариант подойдет идеально.

Наверняка Вы видели шрифты, у которых вместо букв всевозможные рисунки. Вот для чего они нужны.

Одним из таких шрифтов является Font Awesome.

Ниже я расскажу как использовать Font Awesome с помощью псевдоклассов ::before и ::after