Язык
Контакты
GitHub
Поддержка
Регистрация
Войти
Логин: Пароль: Запомнить:
Пользователи
Голосование

    Какую CMS Вы предпочитаете

    AtomX
    Fapos CMS
    Drunya CMS
Последние комментарии
Топ пользователей
Drunya
Репутация: 110
Сообщений: 3527
Сашка_из_Шебекино
Репутация: 87
Сообщений: 1803
boriska
Репутация: 65
Сообщений: 846
ARMI
Репутация: 46
Сообщений: 1858
BAH0
Репутация: 26
Сообщений: 544
Немного о CSS3
Сейчас многие начали наблюдать много экспериментов над CSS3 анимацией,
но ещё относительно недавно поддержка этой анимации была ограничена
браузерами на вебките.И в середине 2011 года браузер Mozila
Firefox 5 тоже получил эту поддержку.Поэтому сейчас идеальное время,
чтобы разобраться с синтаксисом @keyframes (покадровой анимации).Далее
я расскажу вам про CSS3 анимацию и покажу различные примеры.

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

Вот допустим Opacity-прозрачность.В браузерах,поддерживающих это свойство, указать прозрачность можно так:
background-color: rgb(0,0,255);
opacity: 0.5;

Данное обьявление прозрачности затронет всех потомков элемента.В том числе и текст,картинки,бэкграунд и т.д.Это крайне неудобно,поэтому в CSS3 вводится новое обьявление - RGBA,которое решает данную проблему:
background-color: rgba(0,0,255,0.5);

В данном случае только фон получит значение прозрачности 0.5.

Multiple Backgrounds-указание нескольких фоновых картинок.Новая версия CSS позволяет добавлять элементам несколько фоновых картинок!Можно разместить изображения вверху,в центре,в углу и других местах.Верстать сложные макеты станет намного легче.Вот пример установки нескольких картинок для фона:
background:
url(body-top.gif) top left no-repeat,
url(banner_fresco.jpg) top 11px no-repeat,
url(body-bottom.gif) bottom left no-repeat,
url(body-middle.gif) left repeat-y;

Resize-пользовательское изменение.Теперь можно будет добавить немного
интерактивности на ваш сайт - свойство Resize позволит посетителю изменять размер элементов:
div.resize {
width: 100px;
height: 100px;
resize: both;
overflow: auto;
}

Ну на этом моя статья заканчивается.Знайте я рассказал вам только про
несколько возможностей CSS3 и если вам интересно, то узнать большое вы можете воспользоваться другим сайтом.
Немного о CSS3

Теги: CSS3;
Автор: advert_rip
Категория: HTML & CSS
Просмотров: 4206
Комментариев: 1

Сейчас online: 57. Зарегистрированных: 0. Гостей: 57.
-->