css3是css的升级版本，在标准化前已经先行推出了许多最新的规范，包含了许多新特性。css3 的出现改变了我们网页设计的方式，更加的灵活。下面我们将详细介绍css3的新特性。
- 强大的选择器
CSS3引入了一系列新的选择器，用来更加细精化的选择我们想要的元素，强化了CSS的选择能力，让页面设计更加灵活和方便。比如：
- 属性选择器（Attribute selectors）
- 伪类选择器（Pseudo-class selectors）
- 伪元素选择器（Pseudo-element selectors）
- 子选择器（Child selectors）
- 相邻兄弟选择器（Adjacent sibling selectors）
- 通用选择器（Universal selectors）
- 文字效果
CSS3新增了一些文字效果，例如：
- 文字阴影（Text shadow）
- 文字渐变（Text gradient）
- 字形，字间距，字间间距（Letter-spacing, Word-spacing）
- 文字装饰（Text decoration）
- 单词断行（Word-break）
- 盒子效果
CSS3的盒子效果更为强大，新增了许多属性，比如：
- 圆角（Border-radius）
- 阴影（box-shadow）
- 颜色和透明度（RGBA, HSLA）
- 多列布局（Multi-columns layout）
- 边框图片（Border image）
- 变形（Transform）
- 过渡（Transition）
- 动画（Animation）
- 媒体查询
媒体查询是CSS3的重要特性之一，利用媒体查询，我们可以对不同 devices（设备）的屏幕进行不同的样式控制，实现响应式布局。比如：
立即学习“前端免费学习笔记（深入）”；
magento(麦进斗)
下载
Magento是一套专业开源的PHP电子商务系统。Magento设计得非常灵活，具有模块化架构体系和丰富的功能。易于与第三方应用系统无缝集成。Magento开源网店系统的特点主要分以下几大类，网站管理促销和工具国际化支持SEO搜索引擎优化结账方式运输快递支付方式客户服务用户帐户目录管理目录浏览产品展示分析和报表Magento 1.6 主要包含以下新特性：•持久性购物 - 为不同的
@media screen and (min-width: 1024px) {
/* styles for screens with a minimum width of 1024px */
}
@media screen and (max-width: 768px) {
/* styles for screens with a maximum width of 768px */
}- 2D/3D转换
CSS3还新增了2D/3D转换的功能，利用这些功能可以实现一些炫酷动画效果。比如：
/* 2D转换 */
div {
transform: translateY(50%);
transform: translateZ(30px);
transform: scale(0.5);
transform: rotate(180deg);
}
/* 3D转换 */
div {
transform: translate3d(30px, 50px, 10px);
transform: rotate3d(1, 0, 0, 45deg);
transform: scale3d(1.5, 1.5, 1.5);
}- Flexbox布局
Flex布局是CSS3的重要组成部分，提供了一种更加直观有效的布局方式。Flex布局找到了用CSS设计复杂布局的新途径，方便开发人员解决一系列的复杂问题。Flexbox通过指定flex属性可以轻易地调整布局。比如：
.container {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.item {
flex-grow: 1;
flex-shrink: 1;
flex-basis: auto;
align-self: auto;
}总之，CSS3是一项伟大的技术，带给了我们更加简便，灵活的页面设计方法，让页面设计更加生动和富有创意。然而，由于不同浏览器对CSS3的支持程度不一，所以在实现时需要特别谨慎，在页面设计的时候结合实际情况作出更好的选择。
