7b2主题美化 图片背景添加视差模糊效果

先看效果图:

7b2主题美化 图片背景添加视差模糊效果

在背景图片上增加视差模糊效果,增加朦胧感,避免背景图片太突兀,与网站整体不协调,这个效果ripro,总裁主题都有使用,喜欢的朋友可以使用,记得收藏本站,以防后期再用的时候找不到了。

使用教程:

首页新建一个模块,添加一张模块背景图,调用内容选自定义

<div class="module parallax"><div class="wrapper" style="margin: auto;"><h4 class="entry-title"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-jingxuan-white"></use></svg>&nbsp;&nbsp;精选教程推荐</h4></div></div>

其中的图标可以自行修改成你喜欢的。

宽度选铺满窗口。

然后:

b2常规设置的模块头部html标签选项添加css

这样设置了PC端已经没问题了,但移动端还有一个小问题就是,手机端会隐藏背景图,因此还需要一点小修改。

先去数一下,这个视差组件排第几个,我这里是第5个,从0开始数就是4。因此对应的DOM类就是 home_row_4。你需要做的就是把上面css代码最后的这个 home_row_4 改成你的,home_row_5,home_row_6 等等。然后再把

7b2主题美化 图片背景添加视差模糊效果

本站大部分内容均收集于网络!若内容若侵犯到您的权益,请发送邮件至:400@21cn.com我们将第一时间处理!

资源所需价格并非资源售卖价格,是收集、整理、编辑详情以及本站运营的适当补贴,并且本站不提供任何免费技术支持。

                                                               

所有资源仅限于参考和学习,版权归原作者所有,更多请阅读皆是你网络服务协议

给TA赞赏
共{{data.count}}人
人已赞赏
主题美化

B2主题美化 仿致美化特色模块

2023-7-9 12:34:03

主题美化

7B2主题子比主题美化 网站添加复制透明提示框

2023-7-9 12:47:08

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索