Flexslider箭头错误，如何解决？

Question

我在flexslider上遇到一些问题，导航箭头显示不正确。 我尝试编辑“ flexslider.css”，但没有成功，有任何解决此问题的线索吗？ （看图片，我的浏览器[Chrome]在IE上显示的是该字体而不是图像，它只是一个看不见的块中的链接）。 [注：我正在使用Bootstrap。]

（Ps²：我正在尝试将图像放在箭头位置，以便使它看起来像这样： (http://cleancanvas.herokuapp.com/)

（[ 编辑 ]Ps³：只是要清楚...我的箭头没有显示出来，我该如何解决？我试图将这段代码放在第52行附近，该人在下面的评论中发布了该教程表示background: url(http://www.your_domain.com/flex/images/bg_direction_nav.png) no-repeat 0 0;但是它不起作用。“字体”“ fl”和“ fi”（参见图片）仍然在那个地方:(

的HTML

<section class="flexslider">
    <ul class="slides">
        <li>
            <img src="http://placehold.it/1600x500">
        </li>
        <li>
            <img src="http://placehold.it/1600x500">
        </li>
        <li>
            <img src="http://placehold.it/1600x500">
        </li>
    </ul>
</section>

的CSS

.flexslider {
    margin-top:90px;
    max-height:450px;
    border:0;
    border-radius:0px;
    overflow:hidden;
}

.flex-control-nav {
    top:400px;
    opacity:0.5;
    filter:alpha(opacity=0.5);
}

JS

$(window).load(function() {
    $('.flexslider').flexslider({
        animation: "slide",
        easing: "linear",
        useCSS: false,
        pauseOnHover: true,
        slideshowSpeed: 7500,
        animationSpeed: 750,
    });
});

图片 ： 这里

Answer 1

这是因为您缺少/fonts/文件夹...在flexslider.css的顶部，有以下代码：

@font-face {
    font-family: 'flexslider-icon';
    src:url('fonts/flexslider-icon.eot');
    src:url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
        url('fonts/flexslider-icon.woff') format('woff'),
        url('fonts/flexslider-icon.ttf') format('truetype'),
        url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
    font-weight: normal;
    font-style: normal;
}

基本上，您需要确保/ fonts /文件夹位于flexsider.css文件旁边-或至少编辑上面的CSS以指向您的字体路径。