/* 可以设置多个阴影 */
box-shadow: 10px 10px 5px #888888,
-10px -10px 5px red;
兼容性 -webkit-boxshaow: -moz- -o- 用谷歌浏览器就不写了
/* 平铺显示 */ /* 值越大显示的越密 */
border-image:url(border.png) 30 30 round;
/* 拉伸显示 */
border-image:url(border.png) 30 30 stretch;
/* 多个背景图片 */
#example1 {
background-image: url(img_flwr.gif), url(paper.gif);
background-position: right bottom, left top;
background-repeat: no-repeat, repeat;
padding: 15px;
}
背景裁剪
div {
background-clip: content-box; /* 从内容区域显示 不包括padding border */
background-clip: padding-box; /* 从内边距padding开始显示 不包括border边框 */
}
div {
/* 背景图片大小设置 */
background-size: 10px 20px;
}
div {
border:1px solid black;
padding:35px;
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-position:left;
/* 如果你设置了padding 在设置这个属性就会让背景图片在内容区域显示 */
background-origin: content-box;
background-origin: padding-box; /* 在padding区域显示 */
}1 - box-shadow
2 - border-imag
3 - 多个背景 多重设置
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号