问题标签 [google-material-icons]

问问题

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

195 问题
Newest
Active
Bountied
318
Unanswered
0 投票
2 回答
1899 浏览

css - 无论您对它做什么，Angular Material Icon 显然都不会对齐？尽管 Flex 布局指令和 CSS 会影响它，但它从未对齐

示例：https ://i.imgur.com/Xd0XkmE.png

我已经在父级上尝试了 fxFlexAlign - fxLayoutAlign ，给它一个 ID 并使用 display:flex + justify-content:center 和 !important 。

问题是——上面所有的东西都对它做了一些事情，它对 CSS 和 FlexLayout 指令做出反应，但无论如何它看起来仍然明显错位。

经过检查，很明显它是从“容器”的右下角生长出来的，根本不关心以任何方式对齐。

我在处理这些方面有什么遗漏吗？我查看了文档 + stackoverflow + google 了它，但找不到任何东西。

0 投票
3 回答
526 浏览

css - 无法将素材图标垂直居中

我试图放置material icon在圆心我尝试了以下方法尝试添加vertical-align:middle和添加text-align:center

但没有任何工作。

0 投票
2 回答
14117 浏览

css - 如何在 vuetify 中使用动画材质图标

通过 Vuetify 的v-icon组件，使用主流材料设计图标非常简单，例如：

现在，我想知道是否支持动画材质图标并且可以以类似的方式在 Vuetify 中使用 - 我的意思是如果可能的话，不必添加额外的 css 代码行等。

在示例中，我注意到了fa-spinfor Font Awesome 的用法；但它超出了范围。我绑定到谷歌的素材图标库。

编辑：我需要的特定行为类型在此处的过渡部分的视频示例中：https ://material.io/design/iconography/animated-icons.html# [查看单击时play按钮如何变成pause平滑动画] .

0 投票
1 回答
228 浏览

jquery - 使用材质图标更改 SVG d="" 路径

想使用这个有吸引力的插件：SVG 径向菜单，但我不知道如何更改 svgs d="" 路径。我想插入例如社交图标而不是默认图标。当我把这些codepen社交的路径放在那里时（它们不同=更大 - 它显示得很糟糕）。我在哪里/如何找到他们使用他们的 SVG 类型的方式......？我是 SVG 的新手。

谢谢

0 投票
1 回答
391 浏览

material-design - 如何将材质图标插入材质主题编辑器

首先，我想使用我的主题编辑器库中的图标。但他们要求下载我需要的图标，如下图所示。 要求下载

我下载了他们给我.sketch的文件。我的问题是如何将该图标草图文件插入到我的主题编辑器对话框中。

0 投票
1 回答
234 浏览

javascript - 用 Google Closure 编写的事件侦听器中的单击事件不起作用？

我是 Java Script新手，我的问题是当我在 chrome 浏览器控制台中尝试这个 JS 时它可以工作，但是在我的 JS 文件中它不工作

我附上了代码，对于 HTML 设计，我使用了 google MDL，对于 JS，我使用了Google Closure

HTML：

JS：

这段代码有什么问题

  1. 当我尝试不使用它goog.provide并向goog.require所有人显示错误时
  2. 当我使用它时，对点击事件没有反应
  3. 有没有其他最好的资源可以在线查看

请帮助我

0 投票
0 回答
79 浏览

html - 对齐材质图标垂直 IE/Edge

我正在尝试在 IE / Edge 上的按钮中垂直对齐我的图标。它适用于 Chrome、FF ...

我已经尝试了一切，但没有成功。

这是一个 HTML 代码：

我创建了一个 Plunker（JSFiddle 不能在 IE 上运行）来演示这个问题：https ://plnkr.co/edit/awk2usjeNjhi83DxLOr5?p=preview

先感谢您

0 投票
1 回答
4591 浏览

angular - angular material icon on hover

I have made a star rating component using angular material icon:

And the ts:

Now, I would like to change the star.value on hover: If the star.value is star, I want on hover the value change with star_border. (If the star value is star_border I just already change the color)

I have no idea how doing this. If someone can help me, thanks.

Edit for more clearance:

I have my component rendered like this:

If user mouseover the mat-icon and the value of the mat-icon is star, I want to change with star_hover (only the time the user hover the mat-icon)

(Sorry I'm not high friendly with english)

0 投票
1 回答
872 浏览

css - 材质图标不会在 Angular 生产版本中呈现

::before在/::after内容中时，材质图标在生产中未正确呈现。该font属性在生产构建时消失。

我已经导入了材料图标https://fonts.googleapis.com/icon?family=Material+Icons

app.component.html

app.component.css

运行时ng build或ng serve它呈现正确的图标箭头图标，但与生产构建它简单地呈现文本arrow_drop_down

我试过了

  1. 导入材质图标并添加angular.json它
  2. 运行生产构建extractCss: false

到目前为止没有任何效果。有任何想法吗？

0 投票
3 回答
11227 浏览

angular-material - 如何使用轮廓材料图标

设想 ：

  • 我正在使用材质图标，我遇到了一个问题，
    我通常使用填充的，一切都很好，
    现在我想使用一个轮廓的，它们有相同的名称，“screen_share”

尝试案例：
我的尝试包含在index.html中：

并在myComponent.html

但它仍然显示填充的。

我该怎么做？

这与建议的副本不同，因为提供的解决方案是我尝试过的选项，但没有奏效


12345678910