最近有不少网站管理员反映,使用织梦系统生成 tags.php 文件后,发现页面排版错乱,标签之间间隔不一致,甚至会导致变形。这个问题其实与织梦系统自带的 tags.php 代码有关,而我们则需要对其进行优化。
第一步:修改样式表
在织梦系统自带的 tags.php 文件中,样式表的布局方式是采用表格的形式,这种布局方式容易导致标签之间的间隔错乱,造成页面排版不美观,甚至会出现内容重叠的问题。我们可以采用 DIV+CSS 的布局方式,将样式表的代码修改如下:
.tagcloud { margin: 0; padding: 0; font-size: 14px; line-height: 24px; text-align: justify; } .tagcloud a { display: inline-block; margin: 0 5px 5px 0; padding: 4px 10px; background-color: #f2f2f2; border-radius: 3px; color: #666; text-decoration: none; -webkit-transition: color .2s linear, background-color .2s linear; transition: color .2s linear, background-color .2s linear; } .tagcloud a:hover { background-color: #3498db; color: #fff; }