与背景相关的新增属性
CSS 3中追加的背景相关属性
指定背景的显示范围——background-clip属性
在HTML页面中，一个具有背景的元素通常由元素的内容、内部补白（padding）、边框、外部补白（margin）构成，它们的结构示意如图：
在元素中背景的显示范围在CSS 2与CSS 2.1、CSS 3中并不相同。在CSS 2中，背景的显示范围是指内部补白之内的范围，不包括边框；而在CSS 2.1乃至CSS 3中，背景的显示范围是指包括边框在内的范围。在CSS3中，可以使用background-clip来修改背景的显示范围，如果将background-clip的属性值设定为border-box，则背景范围包括边框区域，如果设定为padding-box，则背景范围仅包括内部补白区域，如果设定为content-box，则背景区域仅包括内容区域。
为了更直观地说明问题，如具有三个div元素，设定三个div元素的背景颜色均为黑色，边框均为绿色点划线。在样式代码中指定一个div元素的background-clip的属性值为border-box，第二个div元素的background-clip的属性值为padding-box，第三个元素的background-clip的属性值为content-box。我们来看一下在示例的运行结果中两个div元素在显示上有什么区别。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Conte