光滑的幻灯片点显示为奇怪的字符

Question

我正在使用 slick.js 创建幻灯片。除了点之外，一切都很好。它们出现了，但它们显示为这个奇怪的字符串 (http://newsinteractive.post-gazette.com/40for10/img/slideshow/weird_chars.png)。

我的代码似乎是正确的。怎么了？

jquery:

$('#slideshow2').slick({
    arrows: true,
    prevArrow: "<i class='fa fa-2x fa-arrow-circle-o-left'></i>",
    nextArrow: "<i class='fa fa-2x fa-arrow-circle-o-right'></i>",
    accessibility: true,
            adaptiveHeight: true,
            dots: true
});

css:

.slick-dots
{
    position: absolute;
    bottom: 0px;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
    background-color: white;

}

Answer 1

您需要 download 并导入 Slick 的 CSS 文件如下：

<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>

Answer 2

元字符集="utf-8" << 就是这样

Answer 3

正如 Mindaugas 所建议的，这是一个编码问题。

Matheus 的解决方案具有误导性，您 而不是 必须下载 css 文件，尽管这有效，因为在实际中.css文件规定了编码。

例如，我没有下载 css 并通过向我的 <link> 标签添加 charset="UTF-8" 属性成功地从 CDN 中提取。

完整的解决方案如下所示：

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css" charset="UTF-8" />

Answer 4

在我的例子中，我需要进入 slick-theme.css 文件并删除 IE 修复（仅在 safari 和 chrome 上使用），然后更改它使用的字体以使用 .ttf 不是 .otf 文件。

这对我来说已经解决了。

Answer 5

要解决此问题，请执行以下操作：

-in, slick-theme.css, 转到 .slick-dots li button:before, 转到至，内容：'PUT YOUR VALUE'

只要放一个点（或任何你喜欢的）。

（我在论坛中找到的所有其他解决方案都不适合我，然后我找到了这个简单的解决方案。

光滑的幻灯片点显示为奇怪的字符

Slick slideshow dots showing up as weird characters

css

slick.js