SVG アイコンを CSS 変数とか併せて良さげに使う | Basicinc Enjoy Hacking!

テクノロジーカテゴリーの変更を依頼記事元:

tech.basicinc.jp

14 usersがブックマークコメント

コメント

0

記事へのコメント0件

注目コメント
新着コメント

新着コメントはまだありません。
このエントリーにコメントしてみましょう。

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

規約違反を報告

アプリのスクリーンショット

いまの話題をアプリでチェック！

バナー広告なし
ミュート機能あり
ダークモード搭載

アプリをダウンロード

関連記事

SVG アイコンを CSS 変数とか併せて良さげに使う | Basicinc Enjoy Hacking!

こんにちは。@rigani_c です。みなさん、SVG 吸ってますか？ SVG 吐いてますか？ Web ページ上で自前の... こんにちは。@rigani_c です。みなさん、SVG 吸ってますか？ SVG 吐いてますか？ Web ページ上で自前の SVG アイコンを使用するときの良さげな手法を持ってきました。結論からいうと SVG スプライトを use タグ使ってid指定で呼んで CSS 変数でスタイルを変更する。更に currentColor 使うと WebFont っぽくなって最高です。環境は macOS Mojave の Chrome70です。それではご査収ください。本記事で SVG アイコンに求めたいこと以下の通りです。 Web サイト内共通の CSS でパーツごとに色を変えられるページの表示を阻害しない修正や管理が楽にできる︵@rigani_c 的に︶これだけ満たしていれば御の字ですね！そもそも SVG ってそんなにええのん？めっちゃいいです。 PNG で 50KB とか

ブックマークしたユーザー

mrpopup2019/12/20
cucumisin2019/11/26
hasunuma06132019/04/14
seapig_dolphin2019/01/07
mmusasabi2018/11/12
rikuo2018/11/11
dhrname2018/11/11
mskz31102018/11/10
actywave2018/11/10
hiro_y2018/11/09

同じサイトの新着

同じサイトの新着をもっと読む

いま人気の記事

いま人気の記事をもっと読む

いま人気の記事 - テクノロジー

いま人気の記事 - テクノロジーをもっと読む

新着記事 - テクノロジー

新着記事 - テクノロジーをもっと読む

設定を変更しましたx