0
にカスタムアイコンが表示されない： http://carousel7.bitballoon.com/は、私がこれに取り組んでいるブートストラップ4カルーセル
私は様々なQ & Aを読んで、私のコードの開発者ビューを使用していました。
ユーザが「次へ」または「戻る」（カスタムアイコン）をクリックすると、カルーセル内の次のスライドを見ることができます。私は、ブートストラップからのブートストラップ4とcarouseを作成しました：
http://v4-alpha.getbootstrap.com/components/carousel/#multiple-carousels
私は「アイコン」フォルダ内の「次」のアイコンにリンクしようとしました。以前はカスタムフォントを作成しようとしていましたが、うまくいきませんでした。
<div id="carousel-example-generic" class="carousel slide" data- ride="carousel">
<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<img src="images/featured_image_grey1.jpg" alt="First slide">
</div>
<div class="carousel-item">
<img src="images/featured_image_grey2.jpg" alt="Second slide">
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="icon-back" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="icon-next" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
とCSS：
.right .carousel-control {
}
.left .carousel-control {
}
.carousel-control {
background-color: transparent !IMPORTANT ;
background-image: none; !IMPORTANT;
\t font-size: 80px !IMPORTANT;
\t text-shadow: none;
color: red;
}
.body {
padding: 100px 0 !IMPORTANT;
font-weight: 40px !IMPORTANT;
background-color: transparent !IMPORTANT;
background-image: 'images/background.png' !IMPORTANT;
}
.container:first-child {margin-top: 90px !IMPORTANT;
}
.nav-link {
font-family: "DIN Condensed", Helvetica, Arial, sans-serif !IMPORTANT;
padding: 3px 0 !IMPORTANT;
font-weight: 40px !IMPORTANT;
}
.navbar-light .navbar-nav .nav-link {
color: #ff9999 !IMPORTANT;
}
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .active>.nav-link:focus, .navbar-light .navbar-nav .active>.nav-link:hover, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.active:focus, .navbar-light .navbar-nav .nav-link.active:hover, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .nav-link.open:focus, .navbar-light .navbar-nav .nav-link.open:hover, .navbar-light .navbar-nav .open>.nav-link, .navbar-light .navbar-nav .open>.nav-link:focus, .navbar-light .navbar-nav .open>.nav-link:hover {
color: #ff3333 !IMPORTANT;
}
/* START new icon */
.icon-back {
background-image: url("icons/back.svg") !IMPORTANT;
font-size: 100% !IMPORTANT;
}
.icon-next {
background-image: url("icons/next.svg") !IMPORTANT;
font-size: 100% !IMPORTANT;
}
/* END new icon */