注册 登录 提供zblog模板_zblog主题_wordpress模板的下载和定制

教程

分享一些有关于zblog的教程,这里有zblog初级教程、zblog中级教程和zblog进阶版教程,如果对你有所帮助,深感荣幸

当前位置:首页 > 教程 正文

主题配置内全屏幻灯片的设置方法

天兴工作室 2016-09-19 教程 4021 ℃ 1 评论

天兴工作室制作的几款主题内都有全屏幻灯片这个东西,特点是看着大气。但是有很多用户不太会设置,本文就来详细解释下这个全屏幻灯片到底应该怎么设置。

首先是制作幻灯片图,主题配置的幻灯片选项都有说明这个幻灯片需要多大尺寸的图片,请严格按照指定尺寸做图。

然后重点来了,制作图片的时候切记图片的左右两端要保持纯色并且色值保持一致,如下图:

QQ截图20160919223848.png

图片做好了还要记下这张图片两端的颜色色值,现在来到后台右上角主题配置,找到幻灯片设置项,代码如下:

<li style="background:url(http://leitang.wang/zb_users/theme/txdida/style/img/flash1.png) #c4e0d7 center 0 no-repeat;">
<a target="_blank"  href="#"></a>
</li>

这个代码我们需要修改的只有三个地方,详细解释下:

1、<a target="_blank"  href="#"></a>中的#是链接地址:点击图片后要跳转到的地址。

2、http://leitang.wang/zb_users/theme/txdida/style/img/flash1.png为图片地址,记得必须是完整的图片地址(记得加http://)。

3、#c4e0d7就是图片背景的色值也就是刚才做图的时候要记下来的图片两端的色值。

上面这段代码就是一张“幻灯片图”的完整代码,多张图切换直接复制粘贴即可。


PS:如果你不想要要全屏幻灯片只想固定宽度的幻灯片的话,只需要做好幻灯片图片保持图片大小一致,然后去掉代码里面的色值即可。

已有 1 位小伙伴发表了看法

QQ时代乐园

回应ta QQ时代乐园 (游客)

评论于 2016-10-04 16:46:00

学习了,多谢哈!

欢迎 发表评论

这是标题

这是标题

这是标题

天兴工作室 | www.txcstx.cn

天兴工作室介绍天兴工作室承接:网站建设、zblog模板和dedecms模板定制、仿站(像素级仿站)、html单页面定制和修改、网站模板修改等服务;我们的办事准则:要么不答应、答应则一定做到

微信公众号
  • 交流群:ZBLOG交流群
  • 客户群:天兴工作室客户群
在线QQ 评论文章