Html 放置问题右箭头和左箭头在下方滑块上使用字体

我想做一些像这样的图片：

我无法将这些箭头（左前角）放在图像上，因为它位于滑块上。我尝试了

位置：绝对

和

相对

这是我的代码，箭头可能不起作用，因为我使用了令人敬畏的字体

顶部标题{
背景图片：url(http://i.imgur.com/wCDfIxa.png);
背景重复：无重复；
背景尺寸：封面；
宽度：100%；
.滑套{
宽度：100%；
背景色：红色；
溢出：隐藏；
img{
宽度：100%；
边界：0；
填充：4em0；
}
a{
.fa角左，.fa角右{
字号：80px；
颜色：黄色；
}
.fa左角{
浮动：左；
}
.fa右角{
浮动：对；
}
}
}
}

*{
框大小：边框框；
}
html，
身体{
字体系列：“开放式Sans”，无衬线；
}
.clearfix:之前，
.clearfix:之后{
内容：“；
显示：表格；
}
.clearfix:之后{
明确：两者皆有；
}
.包装纸{
最大宽度：90%；
保证金：0自动；
}
/**顶部页眉**/
#上割台{
背景图片：url(http://i.imgur.com/wCDfIxa.png);
背景重复：无重复；
背景尺寸：封面；
宽度：100%；
}
.滑套{
最大宽度：100%；
溢出：隐藏；
}
img{
最大宽度：100%；
显示：块；
保证金：0自动；
边界：0；
垫底：2米；
}
.fa角左，.fa角右{
字体大小：40px！重要；/*在处理不同样式表时不要使用！重要*/
颜色：白色；
位置：绝对位置；
利润率最高：22.5%；
}
.fa左角{
左：7%；
}
.fa右角{
右：7%；
}

您需要什么？添加一些描述添加JSFIDLE添加图像：|工作不好是不够的。到底发生了什么？添加绝对位置时发生了什么？预期结果在哪里？当我添加位置：相对.slider\u包装和位置：绝对到.fa angle left和.fa angle right时，箭头在黄色背景中，但仍在img下。我希望图像中的箭头与slider中的箭头一样-imgIf箭头在页面中的正确位置，但在图像后面，您需要为箭头指定一个

z-index

。由于默认情况下，您的图像的z索引为1，我会给您的箭头一个z索引为2。我按照您上面所说的做了，现在我得到了这样的结果：-带h2的span不想居中，span超出了范围。slider_wrapper和img。您没有设置为左：0；我走了；0在本地主机上的h2中，但它不做任何操作。我想像这张图一样：好的，我会很快给你答案，因为现在是凌晨3点20分。所以我需要睡觉。明天你会得到答案。@last.k1ng.k1xu检查html部分和css部分。如果对此有任何问题，请问我。