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

html-css044

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

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

1、新建html文档。

2、书写hmtl代码。 <!-- 横向排列 -->  ，  <div id="nav">，<div id="box1">1</div>，<div id="box2">2</div>，<div id="box3">3</div>，</div>。

3、初始化css代码。<style>*{margin:0padding:0font-size:12pxfont-family:'Microsoft YaHei'}，  </style>。

4、书写总体的css代码。

5、代码整体结构。

6、查看效果。