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

html-css035

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、查看效果。