魏艾斯笔记Elementor flip box 翻转盒元素能创建图片翻转动画效果，当鼠标悬停在上方时就会自动翻转到另一面。 适合企业网站、外贸网站的页面展示效果使用。
Elementor页面编辑器 点我直达 Elementor pro插件官网，快速建站，容易上手。入门点击购买Elementor Pro插件和下载安装激活_WordPress页面编辑器。 更多Elementor插件内容请看Elementor专题学习、小网站选择 1核2g配置的服务器起步，国外主题建站选择 2核4g配置，适当搭配运行流畅。
国内服务器：阿里云、腾讯云（都有代金券，付款时抵用省钱） 不知道如何选择地域、配置请在页面右侧+老魏的联系研究。
外贸、B2C/C2C等网站在国外注册域名。打开namesilo官网，在搜索框里输入并选择好后注册，记得使用优惠码省钱。优惠码点击国外域名商Namesilo域名注册教程获取。
外贸网站建议选择Hostinger虚拟主机，价格便宜，性价比极高！Hostinger专题
SiteGround虚拟主机价格适中服务好！SiteGround专题
1、必备条件
Elementor插件和 Elementor Pro插件，flip box元素是 pro插件中的元素。
Elementor Pro插件是付费插件，需要额外购买。
2、设置 flip box元素参数
在文章页/页面的左侧编辑区域看到专业版，找到并拖拽 flip box元素到右侧。
也可以直接在搜索栏搜索，会快一点找到。
此时在左侧参数区域可以看到【内容】，包括 front、back、settings这三个选项卡。
- graphic element 图形元素：有“无”、“图像”或“图标”供选择。
- 一般来说选择图像作为图形元素比较多。选择图像就要上传图片，并设置图片大小。
- 如果选择图标作为图形元素，就从 FontAwesome 库选择图标
- view视图：选择默认图标视图，或选择堆叠或框架
- shape形状：如果选择堆叠或框架，请选择圆形或方形
- title&descrtption标题和说明：出现在翻转盒上面的标题和说明
- background 控制翻转盒正面的背景，包括颜色、图片、渐变色等。
Back：翻转后的图片设置，与front 基本上是一样的。多了一个 button 按钮。
Settings：
- height：盒子高度
- border Radius：盒子边角变圆
- flip effect：包括翻转、滑动、推动、放大、缩小或淡入淡出等多种效果
- flip direction：翻转方向
- 3D Depth：启用后看到翻转3D效果
样式：给翻转盒子设置边距、对齐方式、边框类型、宽度、颜色、图标的样式、图片样式、标题和描述的颜色、排版等。
3、flip box元素效果
按照默认的 Flip Effect动画效果，出现的是第一个页面和第二个页面的翻转动画，之后可以点击按钮跳转到目的页面中。