欢迎来到欣怡建站!我们致力于提供优质的网站建站服务
注册

Dedecms 友情链接纵向改为横向排列的方法

相关案例演示

首先,我用的模板的友情链接原来也是横向排列的,看的很不爽,链接多了还会超过边框,导致背景图片超格显示 ,所以觉得把它改成横向显示的。这个是现在我的友情链接显示,看到效果还是比较不错的。

 

不管是div做的模板,还是table做的模板,都可以把友情链接由横向改到竖向显示。我的做法是这样的。首先,如果你的模板是div的话,就最好了,如果不是,那么我们需要在原来放友情链接的单元格中插入一个div

 

代码如下: 

<div id="flinks"><ul style="list-style-type:none;">{dede:flink type='text' row='26'/}</ul></div> 

 

代码解释:id="flinks"是css中的选择器,我们需要在css控制这个id的样式。 

ul是一个无序列表标签。 

style="list-style-type:none;“这个表示将无序列表前面的列表样式去掉,设置成无。 

{dede:flink type='text' row='26'/}这个用dede的人都知道,是调用友情链接的。 

 

然后在首页使用的css文件中,插入如下的代码: 

#flinks li{ 

float:left; 

padding-left:10px;} 

 

代码解释: 

float:left;设置div快的浮动,主要让友情链接横向排列的代码就是这段。 

padding-left:10px;这个是设置每个友情链接和它前面一个边距,这里设置为10像素,如果没有这个代码,那么你所有的友情链接都会是挤在一起的,大家都不希望这样吧。

作者:欣怡建站 挑错 时间:2020-01-09 14:40
首先声明,只要是我们的vip会员所有源码均可以免费下载,不做任何限制
☉本站的源码不会像其它下载站一样植入大量的广告。为了更好的用户体验以后坚持不打水印
☉本站只提供精品源码,源码在于可用,不在多!!希望在这里找到你合适的。
☉本站提供的整站程序,均带数据及演示地址。可以在任一源码详情页查看演示地址
☉本站所有资源(包括源码、模板、素材、特效等)仅供学习与参考,请勿用于商业用途。
☉如有其他问题,请加网站客服QQ(984818011)进行交流。
相关教程
在线客服