css 如何将七张照片布置成一个圈？

html-css08

css 如何将七张照片布置成一个圈？,第1张

1. 可以使用css的border-image属性设置边框的背景图片。2. 可以使用background设置多个背景图片，并分别设置每个背景的位置。3. 把所有图片先合成一个圆形图片，然后整个图片作为背景图片。

<div style="width:100pxheight:100pxborder-radius:50%overflow:hidden">

<img src="">

</div>

需要浏览器支持CSS 3 ，注意div的宽高要一样，也可以直接把样式添加在img上，但不建议那样

只要圆的话，用css3，ie8-不支持

<!DOCTYPE HTML>

<html>

<head lang="zh-CN">

<style>

.test {width:50pxheight: 50pxborder-radius: 25pxbackground: #000}

</style>

</head>

<body>

  <div class="test"></div>

</body>

</html>