タグ

CSS Custom PropertiesとCSS Variablesに関するrikuoのブックマーク (3)

  • 僕がネイティブなCSS変数にわくわくする理由

    数週間前、CSS変数(より正確にはCSSカスタム・プロパティ)が、Chrome Canaryの「試験運用版のウェブ プラットフォームの機能」フラグ1を有効にすることで利用できるようになりました。 Chromeエンジニアであるアディ・オスマーニがそのリリースについてはじめてツイートしたとき、多くの否定的で、敵対的で、懐疑的な声が寄せられました。その量は驚くべきものでした。少なくともCSS変数にわくわくしいてる僕にとっては。 これらの反応をざっと見渡したところ、苦情の99%は次の2つの点についてのものだとわかりました。 構文が汚くて冗長。 Sassの変数がすでにあるじゃん。興味なし。 もちろん僕もあの構文は好きじゃありません。それは認めます。でも、あれがいい加減に決定されたものではないってことは理解しておくべきです。CSSワーキング・グループのメンバーは、CSSの文法と互換性があり、かつ将来

    僕がネイティブなCSS変数にわくわくする理由
  • CSS Variables in WebKit

    CSS variables, properly known as CSS Custom Properties, were added to WebKit in the fall of 2015. WebKit has always been intrigued by the idea of putting variables in CSS, ever since 2008 when Dave Hyatt added our first experimental implementation. Since then there were two more re-writes of CSS Custom Properties, which helped shape the standard that browser vendors are settling on today. CSS vari

    CSS Variables in WebKit
  • How to work with SVG icons

    There are many ways to use SVG icons in HTML and CSS, and I haven’t tried them all. This is how we do it in our small front-end team at Kaliop. It works well for our needs, which include: Content and communication websites, often based on big CMSes, rather than full-JS web apps. Icons which are often simple, single-color icons (each potentially used in several different colors depending on context

    How to work with SVG icons
    rikuo
    rikuo 2016/03/29
    SVGをアイコンとして使う際の方法について丁寧にまとめられた記事。外部ファイル参照に未対応なブラウザの問題やそれに対するPolyfill、さらにはCSS custom propertiesを使った多色アイコンの手法についても。
  • 1