Какой рейтинг вас больше интересует?
|
Главная / Главные темы / Тэг «css3»
Intermediate CSS3 Hover Effects. Пошаговый туториал. Часть 2 2015-12-25 09:42:00
... , посвященной основам CSS3 transitions и, ... браузерах, поддерживающих возможности CSS3.
...
+ развернуть текст сохранённая копия
Эта статья является логическим продолжением моей предыдущей статьи, посвященной основам CSS3 transitions и, если в ней я показывала принципы работы этих основ на простых примерах, сейчас я хотела бы перейти к более сложным, красивым и интересным эффектам.
Из-за большого размера статья разбита на три части. Первая часть. Третья часть.
Демо материалы лежат здесь. Все префиксы проставлены в демо, здесь же я не буду на них акцентировать.
Предупреждение: эффекты работают только в современных браузерах, поддерживающих возможности CSS3.
Читать дальше →
Тэги: animation, css, css3, effects, hover, hover-эффект, html, html-верстка, transform, transition, веб-дизайн, веб-разработка, туториал, эффект
Intermediate CSS3 Hover Effects. Пошаговый туториал. Часть 1 2015-12-25 09:41:24
... , посвященной основам CSS3 transitions и, ... браузерах, поддерживающих возможности CSS3.
...
+ развернуть текст сохранённая копия
Эта статья является логическим продолжением моей предыдущей статьи, посвященной основам CSS3 transitions и, если в ней я показывала принципы работы этих основ на простых примерах, сейчас я хотела бы перейти к более сложным, красивым и интересным эффектам.
Из-за большого размера статья разбита на три части. Вторая часть. Третья часть.
Демо материалы лежат здесь. Все префиксы проставлены в демо, здесь же я не буду на них акцентировать.
Предупреждение: эффекты работают только в современных браузерах, поддерживающих возможности CSS3.
Подготовка к работе.
Для создания эффектов понадобится такая дефолтная html-структура. Вместо .eff в коде каждого конкретного эффекта будет использоваться класс .eff-n, где n — номер эффекта:
<div class="eff">
<img src="img/ef1.jpg" alt="Effect #1" />
<div class="caption">
<h4>Title is Here</h4>
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut.
</p>
<a class="btn" href="#" title="View More">View More</a>
</div>
</div>
Читать дальше →
Тэги: animation, css, css3, effects, hover, hover-эффект, html, html-верстка, transform, transition, веб-дизайн, веб-разработка, туториал, эффект
Изображение с текстом на всю ширину экрана с помощью HTML и CSS3 2015-08-26 07:35:23
Многие наверное видели на некоторых сайтах изображение с текстом на …
+ развернуть текст сохранённая копия
Многие наверное видели на некоторых сайтах изображение с текстом на …
Тэги: css3, html, веб-дизайн
Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №172 (9 — 16 августа 2015) 2015-08-16 22:46:41
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT- ...
+ развернуть текст сохранённая копия
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости
Читать дальше →
Тэги: css, css3, group, html, html5, javascript, jquery, zfort, блог, браузеры, веб-дизайн, веб-разработка, дайджест, компании, новости, ссылки
Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №171 (3 — 10 августа 2015) 2015-08-10 10:39:30
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT- ...
+ развернуть текст сохранённая копия
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости
Читать дальше →
Тэги: css, css3, group, html, html5, javascript, jquery, zfort, блог, браузеры, веб-дизайн, веб-разработка, дайджест, компании, новости, ссылки
Главная / Главные темы / Тэг «css3»
|
Взлеты Топ 5
Падения Топ 5
|
