English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
CSS3 - это новейшее развитие языка каскадных таблиц стилей, направленное на расширение CSS2.1. Он принес了许多 долгожданные новшества, такие как закругленные углы, тени, градиенты, переходы или анимации, а также новые компоновки, такие как многостраничная компоновка, гибкие блоки или сеточная компоновка. Экспериментальные функции могут содержать префиксы производителей и должны избегаться в производственной среде или использоваться с особой осторожностью, так как их грамматика и семантика могут измениться в будущем.
Многие новые функции CSS3, такие как эффекты закругленных углов, графические границы, тени для блоков и текста, использование RGBA для достижения эффекта прозрачности, градиентные эффекты, использование @Font-Face для создания кастомных шрифтов, многоуровневые фоновые изображения, обработка текста или изображений (вращение, масштабирование, наклон, перемещение), многостраничная компоновка, медиа-запросы и т.д.
CSS используется для управления стилем и разметкой веб-страниц.
CSS3 - это最新 стандарт CSS.
Этот учебник объясняет новые возможности CSS3.
Пример анимации CSS3, демонстрирующий анимацию изменения фона от красного к зеленому.
<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 100px;
height: 100px;
background: red;
-webkit-animation: myfirst 6s; /* Chrome, Safari, Opera */
animation: myfirst 5s;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes myfirst {
from {background: red;}
to {background: green;}
}
@keyframes myfirst {
from {background: red;}
to {background: green;}
}
</style>
</head>
<body>
<p><b>Внимание:</b> IE 9 и более ранние версии не поддерживают свойства анимации CSS3.</p>
<div></div>
</body>
</html>Проверьте, как это работает ‹/›На сайте Основной учебник мы предоставляем полный справочник по CSS3, включая синтаксис всех свойств и элементов selectors, примеры и информацию о поддержке браузерами.
Референсный справочник по свойствам CSS