教程

阅读1540485

更新时间2025-08-27

简介

CSS3是层叠样式表语言的最新发展，旨在扩展CSS2.1。它带来了许多期待已久的新颖性，例如圆角，阴影，渐变，过渡或动画，以及新的布局，例如多列，灵活的框或网格布局。实验的特性带有厂商前缀，应避免在生产环境中使用，或者应格外小心，因为它们的语法和语义将来都可能发生变化。

CSS3的新特征有很多，例如圆角效果、图形化边界、块阴影与文字阴影、使用RGBA实现透明效果、渐变效果、使用@Font-Face实现定制字体、多背景图、文字或图像的变形处理（旋转、缩放、倾斜、移动）、多栏布局、媒体查询等。

CSS3 教程

CSS 用于控制网页的样式和布局。

CSS3 是最新的 CSS 标准。

本教程向您讲解 CSS3 中的新特性。

开始学习 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>

‹/›