Записи, помеченные ‘урок css3’
-
Лаконичный и современный основной раздел сайта с использованием CSS3
Продолжая тему лаконичной и современной шапки сайта, в этом уроке мы рассмотрим самые основные элементы страницы, такие как блоки и формы. На наш взгляд, совершенно одинаковые блоки — это не очень интересно, так что мы создали четыре типа блоков с разными заголовками и подписями. А так же для примера дизайна форм мы создали форму обратной связи. Так [...]
Далее... Нет комментариев » -
Создание адаптивного веб-дизайна для меню, изображений и рекламы
Этот урок — продолжение темы урока Адаптивный веб-дизайн с использованием CSS3. Мы уже объяснили, как создать простую адаптивную веб-страницу с помощью CSS3 и библиотеки JavaScript Modernizr для ранних версий браузеров. В этом уроке мы хотим показать, как создать адаптивное сворачивающееся меню, изображения и рекламу для разных устройств.
Далее... 1 Комментарий » -
Создание анимированной галереи изображений с использованием CSS3
В этом уроке мы покажем интересные возможности CSS3. Мы создадим трехмерную галерею изображений с помощью свойств трансформаций CSS3 для движка WebKit. В демонстрации Вы увидите свободно летающий трехмерный объект с фотографиями. Наш пример работает только в браузерах, использующих движок WebKit, таких как Chrome, Safari и Opera.
Далее... 13 Комментариев » -
Выпадающее многоуровневое меню с использованием CSS3
Все так же популярны меню на чистом CSS3. В основном это меню на структуре ul – li. В этом уроке мы продолжим создавать интересные меню. Это меню будет выпадающим многоуровневым, а его вложенные уровни будут появляться не при наведении указателя мыши, а при нажатии на пункт меню. Вот каким будет конечный результат нашей работы:
Далее... 1 Комментарий » -
Создание эффекта набора текста с использованием CSS
Недавно мы обнаружили плагин jQuery, который позволяет легко создать эффект набора текста на веб-сайте. Этот плагин называется typed.js, у него открытый исходный код, и его можно скачать с Github. В этом уроке мы расскажем подробней об этом плагине, а также покажем, как создать эффект набора текста с помощью только анимаций CSS.
Далее... 1 Комментарий » -
Создание эффекта загибающейся бумаги без изображений с использованием CSS3
Вы уже могли читать, как создать текстовые выноски или ленты без дополнительных элементов HTML или изображений. Этого можно добиться с помощью эффектов CSS3, применяемым к псевдоэлементам :before и :after. В этом уроке мы воспользуемся таким способом для создания эффекта загибающейся бумаги.
Далее... Нет комментариев » -
Создание копий элементов с использованием свойства CSS3 тени блока
Посмотрите демонстрацию работы в браузерах Firefox, Chrome, Safari, Opera и Internet Explorer, начиная с версии 9. Эти круги созданы с помощью элементов HTML, а не canvas, SVG, Flash или другими способами. Попробуйте угадать, не заглядывая в исходник, сколько элементов понадобилось.
Далее... Нет комментариев » -
Создание эффекта стопки бумаги с использованием CSS3
В этом уроке мы расскажем, как создать интересный эффект, который превращает обычный прямоугольный элемент в стопку бумаги. Раньше подобный эффект создавали с помощью изображений, но мы сделаем это только с помощью CSS3.
Далее... 1 Комментарий » -
Создание горизонтального разворачивающегося меню с помощью псевдокласса :target
С помощью псевдокласса :target можно создать очень многое, например, интересные интерактивные элементы, которые раньше требовали сложных скриптов JavaScript. Мы уже создавали переключение между вкладками и вертикальное разворачивающееся меню. В этом уроке мы расскажем о создании горизонтального разворачивающегося меню с помощью той же разметки HTML5.
Далее... Нет комментариев »
Самые комментируемые
- Текст из крови в Adobe Photoshop 549
- Насколько важно сегодня использовать Web Safe цвета? 538
- 20 наборов кистей для Фотошопа, которые вам пригодятся 530
- Текст из воды в Adobe Photoshop 518
- 45 новых удивительных наборов кистей для творчества 423
- Более 40 фотореалистичных рисунков 205
- Ретро и винтажная типографика в веб-дизайне 194
- 30 примеров фрактального искусства 191