位置 结构伪类选择器(CSS3)( 二 )


Demo
.test{border: 1px solid blue;width: 500px;height: 600px;background-image: url(../img/ax.jpg);background-size: cover;}
多背景(CSS3)
以逗号分隔可以设置多背景 , 可用于自适应布局 做法就是用逗号隔开就好了 。
background:url(test1.jpg) no-repeat scroll 10px 20px/50px 60px,url(test1.jpg) no-repeat scroll 10px 20px/70px 90px ,url(test1.jpg) no-repeat scroll 10px 20px/110px 130px c #aaa;
Demo
.test{border: 1px solid blue;width: 500px;height: 600px;background: url(../img/ax.jpg) no-repeat scroll 10px 20px/50px 60px,url(../img/ax.jpg) no-repeat scroll 60px 80px/70px 90px,url(../img/ax.jpg) no-repeat scroll 130px 170px/110px 130px;}
凹凸文字
Demo
【位置结构伪类选择器(CSS3)】body {background-color: #ccc;}div {color: #ccc;font: 700 80px "微软雅黑";}div:first-child {/* text-shadow: 水平位置垂直位置模糊距离 阴影颜色; */text-shadow: 1px 1px 1px #000, -1px -1px 1px #fff;}div:last-child {/* text-shadow: 水平位置垂直位置模糊距离 阴影颜色; */text-shadow: -1px -1px 1px #000, 1px 1px 1px #fff;} 我是凸起的文字我是凹下的文字