CSS変数がもっと便利になる新しい記述方法、CSSの次世代変数@propertyがすべてのブラウザにサポートされました

2024/08/08 55 users property CSS変数 CSS ブラウザ 変数

CSSの@propertyがFirefoxにサポートされ、デスクトップ・スマホのすべてのブラウザでサポートされました。 @propertyは次世代変数と呼ばれるもので、これまでの変数（カスタムプロパティ）の使い勝手が大幅に向上します。@propertyによるカスタムプロパティの記述方法、@propertyを使ったCSSのテクニックを紹介します。 ... 続きを読む

CSSをより深く理解する、プロパティの値に無効な値を設定する（IACVT）とどのように処理されているのかを解説

2024/04/18 12 users プロパティ CSS キーワー 解説 color

CSSで無効な値、たとえばcolor: 20px;のようにcolorプロパティにカラー値以外を設定したり、background-colorにカラー値以外をカスタムプロパティで設定したりすると当然その値は反映されません。 CSSにおいて値の処理がどのように実行されているのかを紹介します。無効な値だけでなく、値の上書き、値の継承、キーワー... 続きを読む

CSSは確実に進化している！ 新機能、単位を変数として利用できる「Variable Units（変数単位）」

2022/08/02 130 users 変数 CSS 単位 新機能 プロパティ

今年になってもCSSの進化が止まりません、むしろ加速しています！ IEのサポートが終了し、CSSのさまざまな機能が使用できるようなりました。中でもCSSの変数（カスタムプロパティ）を使えるようになったのはありがたいですね。 参考: IEをサポート外にした時に使用できるCSSのプロパティや機能のまとめ そしてCSSの新機... 続きを読む

これまでとは異なるCSSフレームワークが登場！ 一貫性のあるUIコンポーネントを簡単に実装できる -Open Props

2022/04/05 189 users CSSフレームワーク UIコンポーネント 一貫性 登場 くら

これまでとは異なるCSSフレームワークが登場しました！ Tailwind CSSのようにユーティリティファーストで、すべての値がCSS変数（カスタムプロパティ）で記述されています。レスポンシブ対応で一貫性のあるUIコンポーネントを簡単に、素早く実装できます。 単独でも他のフレームワークとの併用も可能で、カラーのみグラ... 続きを読む

CSSの変数（カスタムプロパティ）が期待通りに動作しないときの解決方法 | コリス

2021/09/02 25 users コリス 変数 CSS ブラウザ プロジェクト

CSSの変数（カスタムプロパティ）は、IEを除くすべてのブラウザでサポートされており、実際のプロジェクトで使用している人も増えてきたと思います。 CSSの変数は非常に便利で使いやすいのですが、期待通りに動作しないときの解決方法を紹介します。 The Big Gotcha With Custom Properties by Chris Coyier CSSの変数（... 続きを読む

知っておくと、すごく便利！CSS変数の優れた使い方 | コリス

2021/06/02 23 users コリス コンポーネント 変数 CSS変数 使い方

CSS変数（カスタムプロパティ）は、文字通りCSSで変数が使用できるので非常に便利です。CSS変数の使い方でよく聞くのはカラーですが、それ以外にもさまざまな優れた使い方があります。 WebサイトやスマホアプリのUIで、特にコンポーネントのバリエーションを実装するのに役立つCSS変数の使い方を紹介します。 Practical ... 続きを読む

CSSの変数（カスタムプロパティ）便利な使い方を詳しく解説 | コリス

2020/10/28 12 users コリス コンポーネント 変数 CSS レイアウト

CSSの変数（カスタムプロパティ）の基礎知識、便利な使い方を詳しく解説します。Webページやスマホアプリのレイアウト、コンポーネントなど、実際の使用例がたくさんあるので、実用的なテクニックが満載です。 CSS Variables 101 by Ahmad Shadeed 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サ... 続きを読む

CSSで変数（カスタムプロパティ）を使ってみよう | Webクリエイターボックス

2018/02/07 137 users less Sass CSSプリプロセッサー CSS変数 変数

2018年2月7日 CSS プログラミングではおなじみの変数。SassやLESSといったCSSプリプロセッサーをお使いの方もよく使うものですね。この一度定義しておけば繰り返し利用できる便利な変数が、CSSでも使えるようになりました！今回はCSS変数の使い方と注意点をまとめていきます！ CSS変数とは？ 公式では「カスケード変数のためのCSSカスタムプロパティ（CSS custom properti... 続きを読む

[Android] Android 1.6 でも使用できるプロパティアニメーション！ - adakoda

2012/08/02 16 users adakoda Android View ライブラリ 環境

Android 3.0 以降で追加されたプロパティアニメーション機能の一部（ここ重要）をバックポートしたライブラリを作成しました。 このライブラリを使用すると、なんと！ Android 1.6 環境でも、 独自に作成したオブジェクトのカスタムプロパティ（※）に限られますが、プロパティアニメーションをさせることができます。 （※Android 3.0 以降にしか存在しない View の組み込みプロパ... 続きを読む