<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="sheet.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
<title>Document</title>
</head>
<body>
<i class="material-icons">amp_stories</i>
</body>
</html>
/*CSS CODE EXTERNAL*/
.material-icons{
font-size: 40px;
}
我在我的网站上使用了材料图标。当我在外部CSS中使用字体大小属性时，它们不会更改大小。我尝试了内联CSS，它工作得很好，但在外部CSS中不行。若我检查元素，它会显示图标的字体大小24PX。如果我删除了它，那么我永恒的CSS代码就会一直工作，直到我刷新网页。
您必须在类中预先添加i。
i.material-icons {
font-size: 98px;
}<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="sheet.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<title>Document</title>
</head>
<body>
<i class="material-icons">amp_stories</i>
</body>
</html>不同尺寸：
i.md10px {
font-size: 10px;
}
i.md20px {
font-size: 20px;
}
i.md40px {
font-size: 40px;
}
i.md60px {
font-size: 60px;
}
i.md90px {
font-size: 90px;
}<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="sheet.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<title>Document</title>
</head>
<body>
<i class="material-icons md10px">amp_stories</i>
<i class="material-icons md20px">amp_stories</i>
<i class="material-icons md40px">amp_stories</i>
<i class="material-icons md60px">amp_stories</i>
<i class="material-icons md90px">amp_stories</i>
</body>
</html>