无法使用字体大小调整 flaticon 的大小

Question

我正在为我正在开发的网站使用 Flaticon，但似乎出了点问题，我无法找出是什么。

我使用选项 "icon font" 从 flaticon 下载了 zip 文件。所以我将它上传到我的字体文件夹中但是出于某种原因当我 link css 并在我的 html 中放置一个 <i class="flaticon-crowd"><i> 我得到默认大小的图标但是当我将 font-size:70px; 放入 css 中时，它并没有变大。

我可以 color: #f00; 并且文本变为红色，因此它不是选择器。同样在 chrome 中的 def 工具中显示使用了 70px 字体大小并且没有被否决。

有人知道是什么导致了这个问题吗？

感谢您抽出时间。

这是我使用的 html 的示例

<!DOCTYPE html>
<html>
    <head>
        <!-- flaticon -->
        <link rel="stylesheet" type="text/css" href="assets/css/flaticon/flaticon.css">

        <title></title>
    </head>
    <body>
        <i style="font-size: 70px" class="flaticon flaticon-crowd"></i>
    </body>
</html>

Answer 1

当然可以将 !important 添加到 css 声明中

例如：

font-size:100px !important;

Answer 2

在 css 中使用这个 class 来更改字体大小。

[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after {

font-size: 150px;

}

希望它能解决您的问题。

Answer 3

使用伪 class :before 来根据需要修改图标。您可以应用 css 的所有文本属性来修改图标。

.flaticon-crowd:before {
    font-size: 17px;
}

Answer 4

只需删除 flaticon.css 文件中的 'font-size: 20px;'，然后您就可以在 css 文件中设置您想要的大小。

Answer 5

这对我有用：

.flaticon-fast46::before{
font-size: 40px;}

Answer 6

更好的解决方案是：

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {

font-size: 1em;

}

然后图标的大小可以被其他类使用font-size

修改

Answer 7

在 flaticons.css 中将默认值 class 更改为：

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {   
    font-family: "Flaticon" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

Answer 8

它对我有用。在要用于图标的元素 class 之后添加 :before。

span:before{
font-size: 50px;
}

Answer 9

flaticon.css 文件包含指定字体大小：20px；这适用于所有平面图标。您可以删除该条目以自由编辑单个图标，或者您可以在同一行中重新指定首选图标大小，这将反映在所有图标中。

无法使用字体大小调整 flaticon 的大小

Cannot resize flaticon with font-size

html

css

fonts

icons