前几天我发现了一个非常实用、美观的翻转显示区块的代码，可以很好地用在网站的侧边栏上。由于它非常适合我的网站风格，并且我认为会对网站的访问者产生吸引力，我决定将它（扒）取下来。
这个翻转显示区块的代码实现起来并不难，只需要使用一些CSS代码就可以实现。
翻转显示区块实现步骤
第一步，在想要展示的位置添加HTML，一般侧栏最好，里面的url为点击后跳转到的网页。
<div class="textwidget custom-html-widget"><div class="qqg-card-widget" id="qqg-card-wechat" onclick="window.open('https://www.zxki.cn');">
<div id="qqg-flip-wrapper">
<div id="qqg-flip-content">
<div class="qqg-face"></div>
<div class="qqg-back qqg-face"></div>
</div></div></div></div>第二步，添加CSS到全局css文件中，添加之后需要修改图片url地址，素材图片在附件下载。
此处内容已隐藏，评论后刷新即可查看！
第三步，下载附件图片素材上传到服务器，并修改css里面的url就行了，F5刷新就可以看到效果了。
文件下载
