Yootheme pro的slideshow如何设置每张slide的内容显示位置？

Yootheme pro中自带有slideshow功能，slideshow中slide的内容，一般是指它的标题、元、描述这几样。我们可以在后台直接设置这些内容统一显示的位置，例如中下左右、左中、右中、左上，右上之类。一般位置不太讲究的话其实也可以满足了我们平常的需求。

但如果你的slideshow（幻灯片）的背景图，构图并不固定，要求每张图片配置的文字内容显示位置不一样，就不好实现，后台也没有相关的设置项，这时候我们就需要在高级的CSS区域，使用CSS代码来控制内容的显示位置，例如：

/* Slide 1: "Center Left" */
.el-item:nth-child(1) > .uk-flex {
align-items: center;
justify-content: flex-start;
}

/* Slide 2: "Top Left" */
.el-item:nth-child(2) > .uk-flex {
align-items: flex-start;
justify-content: flex-start;
}

/* Slide 3: "Bottom Right" */
.el-item:nth-child(3) > .uk-flex {
align-items: flex-end;
justify-content: flex-end;
}

/* Slide 4: "Left" */
.el-item:nth-child(4) > .uk-flex {
align-items: flex-start;
justify-content: flex-start;
}

其实这里可以这样简单地理解为

• align-items控制内容的垂直位置，例如上、中、下；分别对应：flex-start、center、flex-end
• justify-content控制内容的水平位置，例如左、中、右；分别对应：flex-start、center、flex-end
• el-item:nth-child(1)这个就是指定是哪一张幻灯片，数字就是幻灯片的序号。