CSS3 模块
CSS3 被划分为模块。
其中最重要的 CSS3 模块包括:
选择器
框模型
背景和边框
文本效果
2D/3D 转换
动画
多列布局
用户界面
CSS3 边框
通过 CSS3,您能够创建圆角边框,向矩形添加阴影,使用图片来绘制边框 - 并且不需使用设计软件,比如 PhotoShop。
在本章中,您将学到以下边框属性:
border-radius
box-shadow
border-image
CSS3 圆角边框
在 CSS2 中添加圆角矩形需要技巧。我们必须为每个圆角使用不同的图片。
在 CSS3 中,创建圆角是非常容易的。
在 CSS3 中,border-radius 属性用于创建圆角:
CSS3 边框阴影
在 CSS3 中,box-shadow 用于向方框添加阴影:
CSS3 边框图片
通过 CSS3 的 border-image 属性,您可以使用图片来创建边框:
border-image 属性允许您规定用于边框的图片!
新的边框属性
属性 描述 CSS
border-image 设置所有 border-image-* 属性的简写属性。
border-radius 设置所有四个 border-*-radius 属性的简写属性。
box-shadow 向方框添加一个或多个阴影。
CSS3 背景
CSS3 包含多个新的背景属性,它们提供了对背景更强大的控制。
在本章,您将学到以下背景属性:
background-size
background-origin
CSS3 background-size 属性
background-size 属性规定背景图片的尺寸。
在 CSS3 之前,背景图片的尺寸是由图片的实际尺寸决定的。在 CSS3 中,可以规定背景图片的尺寸,这就允许我们在不同的环境中重复使用背景图片。
您能够以像素或百分比规定尺寸。如果以百分比规定尺寸,那么尺寸相对于父元素的宽度和高度。