为什么不能在移动设备上显示Google材质图标 [英] Why Google Material Icons Can't be Shown on Mobile

问题描述

我使用的是Materializecss，它使用的是Google设计图标.在某些手机上，无法显示

解决方案

由于 text-rendering 属性而出现问题.文本渲染不是CSS的标准做法，但可以用来选择文本质量.

在Google材质CSS中，此属性带有其默认值.如果添加此样式，则将解决问题:

  .material-icons {文本渲染:optimizeLegibility；} 

根据这个定义，我们向浏览器说:强调易读性，而不是渲染速度和几何精度."

https://css-tricks.com/almanac/properties/t/text-rendering/

I am using Materializecss and it uses Google design icons. On some mobiles, Google Material-Icons can'be shown. What is caused it?

解决方案

The problems is occurred because of text-rendering property. Text-rendering is not a CSS standart but it allows use to choose text quality.

In google material css this property comes with it's default value . If you add this style you will solve the problem :

.material-icons {
    text-rendering: optimizeLegibility;
}

By this definition, we say to the browser that, "emphasize legibility over rendering speed and geometric precision."

https://css-tricks.com/almanac/properties/t/text-rendering/

这篇关于为什么不能在移动设备上显示Google材质图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！