这篇经验给大家分享关于如何实现一个图片库呈现在网页中,用到的HTML,CSS都有详细的代码在下面。
工具/原料
1
IDE代码编辑工具
2
电脑
方法/步骤
1
准备好图片标签,一个DIV,一个SPAN标签,然后图片说明,结构代码如下:

图片说明
2
给图片添加样式,并且在文本DIV也添加样式,代码如下:.pic{border: 1px solid red;padding: 15px;width: 160px;}.pic div{text-align: center;}
3
整合代码,将pic的宽度设置成跟图片的宽高一样,这样使得图片跟文字的描述都能够在同一水平线上,效果如下