CSS3 | RUSDIGI

CSS3

Каждый веб-дизайнер встает перед выбором шрифтов для своего проекта. Сегодня мы рассмотрим API от гугла Google Fonts. Плюс шрифтов от гугла в том, что нам...

Каждый веб-дизайнер встает перед выбором шрифтов для своего проекта. Сегодня мы рассмотрим API от гугла Google Fonts. Плюс шрифтов от гугла в том, что нам не требуется ничего скачивать. Мы просто подключаем нужный шрифт, прописываем стили CSS и все. В этой статье я приведу готовые куски кода для каждого из шрифтов, которые поддерживают кириллические символы. (далее…)

CSS3 JavaScript

Создаем вращающиеся иконки с помощью CSS3 и Mootols

admin

18.05.201104.03.2016

Сегодня мы займемся тем, что попробуем приукрасить внешний вид иконок на профили (RSS, twitter и т.д.). Добавим немного движения в эти иконки. А делать мы...

Сегодня мы займемся тем, что попробуем приукрасить внешний вид иконок на профили (RSS, twitter и т.д.). Добавим немного движения в эти иконки. А делать мы будем это с помощью CSS3 анимации.Так же с помощью JavaScript библиотеки MooTools мы будем задавать произвольное расположение и поворот иконок. Давайте посмотрим как притворить это в жизнь. (далее…)

CSS3

Меняем фоновый цвет страницы с помощью CSS3

admin

17.05.201126.02.2016

Сегодня рассмотрим замечательную возможность. Называется она CSS анимация с помощью keyframe'ов (ключевые кадры). К сожалению, на данный момент мы имеем очень скудную поддержку браузерами данного вида анимации. Но наш любимый Google Chrome и его брат Safari отлично обрабатывают этот вид анимации. Ниже в статье мы создадим веб страницу, на которой фоновый цвет будет изменяться с течением времени с помощью ключевых кадров. Интересно? Тогда идем дальше. (далее…)

CSS3

CSS3 для начинающих. Часть 6.2. Кнопки в стиле BonBon

admin

16.05.201126.02.2016

После продолжительного перерыва продолжим изучать CSS3. Сегодня речь пойдет о том как создать кнопки в стиле BonBon (конфетки такие вкусные) на CSS3. Кнопки будут разных...

После продолжительного перерыва продолжим изучать CSS3. Сегодня речь пойдет о том как создать кнопки в стиле BonBon (конфетки такие вкусные) на CSS3. Кнопки будут разных размеров, цветов, форм и т.д. Но при всем этом они имеют достаточно минималистичный дизайн, что позволяет использовать их почти на всех сайтах. Напоминаю, что это статья из цикла CSS3 для начинающих. А примеры можно посмотреть на демо сайте http://css3demos.rusdigi.org. (далее…)

CSS3

7 простых эффектов для текста с использованием CSS3

admin

13.05.201126.02.2016

Сейчас после прочтения множества мануалов и уроков по CSS3, вы начинаете все больше использовать CSS3 в своих проектах. Все, что вам не хватает - это...

Сейчас после прочтения множества мануалов и уроков по CSS3, вы начинаете все больше использовать CSS3 в своих проектах. Все, что вам не хватает - это готовые примеры, готовые реализации. Именно этим мы сегодня займемся - изучим несколько простых, но при этом эффектных трюков по работе с текстом в CSS3. Все эти трюки настолько просто, что вы можете с легкостью скопировать приведенный код и использовать в своем проекте. Но не забывайте о том, что старые браузеры не будут поддерживать большинство из них. Так посоветуйте вашим пользователям обновить браузеры и лучше пусть это будут webkit браузеры ;) (далее…)

CSS3

CSS3 для начинающих. Часть 6.1. Кнопки на CSS3

admin

12.05.201126.02.2016

Очередная статья из цикла CSS3 для начинающих. Речь сегодня пойдет о кнопках. Мы привыкли, что кнопка - это набор картинок. Первая картинка создается для кнопки...

Очередная статья из цикла CSS3 для начинающих. Речь сегодня пойдет о кнопках. Мы привыкли, что кнопка - это набор картинок. Первая картинка создается для кнопки в спокойном состоянии, вторая для состояния когда курсор мыши наведен на кнопку и третья - при нажатии на кнопку. Таким образом для каждой кнопки приходиться рисовать 3 картинки. С развитием и внедрением CSS3 мы можем избавиться от всего этого и делать кнопки легко и непринужденно, используя только стили CSS. Сегодня мы займемся созданием простых кнопок разного размера и цвета. (далее…)

CSS3 JavaScript

Панель трендов с помощью CSS и jQuery

admin

12.05.201126.02.2016

Хочу сегодня поделиться с вами интересной задумкой. На многих англоязычных порталах, частенько присутствует так называемая панель трендов. Обычно это однострочная панель прилепленная к низу экрана, на которой создатели портала анонсируют популярные статьи. Панель достаточно хорошо привлекает внимание и соответственно вы можете перенаправить трафик со всего сайта в нужное вам русло. Существует множество плагинов для Wordpress, которые позволяют сделать что-то подобное. Но нам всегда интересен чистый легкий код. Так же мы будем использовать свойство opacity для того, чтобы панель становилась ярче при наведении на нее курсора мыши. (далее…)

CSS3

Зеркалирование изображения с помощью CSS3

admin

10.05.201126.02.2016

Совсем недавно я писал о том, что в самое ближайшее время постараюсь рассказать о замечательно свойстве CSS3 box-reflect. Зеркалирование - это достаточно изящный трюк, который прост в применении и очень эффектно смотрится. Есть несколько вариантов с помощью которых можно получить зеркальное изображение. Первый и самый простой - это редактирование изображения в графическом редакторе. Есть так же возможность сделать зеркалирование с помощью JavaScript или CANVAS. Но ребята из WebKit решили реализовать свою собственную идею - зеркалирование с помощью чистого CSS. (далее…)

CSS3

6 сокращений в CSS, о которых должен знать каждый

admin

10.05.201126.02.2016

Недавно появилось желание привести CSS файлы в порядок - избавиться от ненужного кода, использовать сокращения вместо описания. Таким образом мы можем уменьшить размер файлов css и ускорить загрузку сайта в целом. Сегодня мы начнем с самых распространенных сокращений в CSS: фон (background), отступы (margin & padding), границы (border), шрифты (font), стили списков (list) и затемнение (transition). (далее…)

CSS3

Эффекты при наведении. 5 готовых вариантов на CSS3

admin

06.05.201113.04.2017

Порой возникает надобность сделать эффект при наведении курсора мыши на какой-либо элемент на вашем сайте. Сегодня я бы хотел поделиться готовыми вариантами - 5 довольно...

Порой возникает надобность сделать эффект при наведении курсора мыши на какой-либо элемент на вашем сайте. Сегодня я бы хотел поделиться готовыми вариантами - 5 довольно приятных на глаз эффектов. Эти эффекты позволять оживить ваш сайт, сделать его более динамичным. Самое приятное в представленных ниже эффектов - отсутствие JavaScript - мы сделаем все только с использованием CSS3. Про поддержку браузерами повторяться не хочется - Mozilla и webkit браузеры справятся отлично. А вот IE не совсем корректно будет отображать некоторые эффекты, хотя в последних версиях заметны улучшения. Итак, давайте посмотрим на 5 эффектов при наведении. (далее…)

Уникальные шрифты: Google Fonts

Создаем вращающиеся иконки с помощью CSS3 и Mootols

Меняем фоновый цвет страницы с помощью CSS3

CSS3 для начинающих. Часть 6.2. Кнопки в стиле BonBon

7 простых эффектов для текста с использованием CSS3

CSS3 для начинающих. Часть 6.1. Кнопки на CSS3

Панель трендов с помощью CSS и jQuery

Зеркалирование изображения с помощью CSS3

6 сокращений в CSS, о которых должен знать каждый

Эффекты при наведении. 5 готовых вариантов на CSS3

Лучшая рубрика

Wiki

Новости

Операционные системы и утилиты для ПК

Последняя запись

Лучшая рубрика