正文
CSS3引入了许多强大的新特性，包括Flexbox、Grid、动画、渐变等，让Web界面更加美观和交互性强。 核心特性： 1. Flexbox布局：一维布局系统 2. CSS Grid：二维布局系统 3. 动画和过渡：@keyframes和transition 4. 渐变和阴影：linear-gradient、box-shadow 5. 媒体查询：响应式设计 示例： ```css /* Flexbox布局 */ .container { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; } /* CSS Grid布局 */ .grid-container { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; } /* 动画 */ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .animated { animation: fadeIn 1s ease-in; } /* 渐变背景 */ .gradient-bg { background: linear-gradient(45deg, #ff6b6b, #4ecdc4); } /* 响应式设计 */ @media (max-width: 768px) { .container { flex-direction: column; } } ``` 掌握CSS3的这些特性，可以创建现代化的Web界面。 None None