問題タブ [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.
css - マテリアル デザイン アイコン CSS の回転が中央に配置されていません
https://materialdesignicons.com/のアイコンで読み込みスピナーを作ろうとしていますが、アイコンは回転するだけでなく、中心からわずかに移動します。
私はこれらのスタイルを持っています:
<i class="mdi mdi-something spin">
エレメントです。:before
ということでアイコンの内容を追加しました。display: flex
この要素は、水平方向と垂直方向の中央に配置された、絶対位置のラッパーに配置されます。
問題は、アイコンが回転するときに、その中心を中心に回転しないことです。軸が少し動きます。アイコンは中央の 1 つの位置にとどまらず、わずかに移動します。
私はもう試した:
i
要素に幅と高さを与える:before
要素に幅と高さを与えるspiner
アニメーションを からi
に移動:before
- たとえば、stackoverflow で見つけたさまざまなスタイル
transform-origin: center center;
アイコン自体は同じx
なy dimensions
ので問題ないはずです。回転させると寸法が変わるのですが、それでいいのでしょうか?
google-material-icons - OUTLINEスタイルでマテリアルアイコンのSVGを取得するには?
OUTLINE スタイルのマテリアル アイコンを含むすべての .svg ファイルを取得したい: https://material.io/tools/icons/?style=outline
githubのレポで見つけられませんでした。解決策はありますか?上記のリンクから各アイコンを手動でダウンロードできますが、それはナンセンスです。
ありがとう!
icon-fonts - IE のフォント ダウンロード セキュリティ オプションが無効になっているため、マテリアル アイコン フォントが機能しない
これがシナリオです。
このアプリケーションは、kendo-ui などの既に開発された API と、AgnularJS を使用した UI コンポーネント用に内部で開発されたいくつかの API を使用します。これらのライブラリと私たちのアプリケーションでは、マテリアル アイコンの「npm 依存関係」アプローチに従い、展開されたビルドでそれらをホストしました。
ただし、現時点では、エンド ユーザーにセキュリティ上の懸念があり、システムに適用されているポリシーによって次のような IE の構成の変更が許可されていない状況やシナリオがあることがわかりました。**
IE >> インターネット オプション >> セキュリティ タブ >> インターネット >> カスタム レベル >> フォント ダウンロード オプションを無効にします。
**
ただし、エンド ユーザーにセキュリティ構成の変更を強制することはできません。また、変更することさえできません。
したがって、私は代替アプローチを探しています。すべてのアイコン フォントをアイコン イメージに置き換えるのは、非常に複雑で面倒な作業になるためです。
私がすでに従ったことは次のとおりです。
- 信頼できるドメインへのドメインの追加 - はい、機能しますが、エンド ユーザーは設定を変更できません。したがって、これは役に立ちません。
- 自己ホスト型のアイコン フォント - 動作しない
- Google の API リポジトリを参照する URL - 機能しない
- セキュリティ構成の変更 - 許可されていません
したがって、誰かが過去に同様のシナリオに直面したことがある場合は、代替ソリューションを探してください。
この問題については、ポインタがあれば非常に役立ちます。
ありがとうございました、