最近忙着修改网站,在这次的修改中发现必须通过一些以前应用很少的技术才能完成最初的设计。这几天感觉最深的当属层技术+CSS的应用了,为了很少的实现下面的效果只能这样了。
这是最终完成的效果,在图中圆圈的位置就是层的所在。以前为了实现这样类似的效果通常会将表格进行嵌套,但是这次设计的图片中文字底色的宽度和上下的间距很小,单纯使用单元格底色的应用不能达到设计效果。在无计可施的时候,想到是否可以在单元格中嵌入层,使用CSS控制层的大小和颜色。结果效果还是不错,最终也算达到了这样的效果。其中遇到麻烦的是就是当使用层后,文字总是靠上显示,在层的CSS中使用“line-height”属性间接控制文件显示的位置。
 
如果大家有什么更好的方法也希望可以留言。