CSSだけでスタイルクエリのサポートを確認する方法、Safari 18のバグを回避する方法も
Post on:2024年11月6日
スタイルクエリとは、親要素のスタイルに応じて子要素のスタイルを適用するCSSの機能です。たとえば、カードのコンテナがあり、カードによってラベルやボタンのスタイルを変更したい場合などに便利です。
このスタイルクエリがブラウザにサポートされているかをCSSだけで確認するテクニックを紹介します。
Feature detect Style Queries Support in CSS
by Bramus!
2024年最新版、Adobe PhotoshopやIllustratorの新機能をまとめたPDFを無料でダウンロードできます
Post on:2024年11月5日
Adobe公式から、2024年最新版となるPhotoshopやIllustratorの機能一覧がアップデートされたので、紹介します。
新機能が追えてない、まとめて一覧で見たい、過去のアップデート内容も知りたい、そんな人は要チェックです。また、Adobe Fontsで使用できる日本語フォントをまとめたPDFも無料でダウンロードできます。
スキルを磨きたい人にお勧め! Adobe Illustratorをすでに使用している中級者に最適な解説書 -10倍ラクするIllustrator仕事術【改訂第3版】
Post on:2024年11月1日
※本ページは、アフィリエイト広告を利用しています。
PhotoshopやIllustratorなど、ソフトウェアの基本操作は書籍やネットで学ぶこともできますが、実践的なテクニックや効率的なテクニックをまとめたものとなるとなかなか見つかりません。
本書はIllustrator使い必携書の10年ぶりのリニューアル版。基本操作の解説はなし、実務ですぐに役立つ効率化の新常識がまとめられた解説書です。
ついにCSSだけでwidth: auto;やheight: auto;へのアニメーションができるようになります
Post on:2024年10月31日
CSSだけでwidth: auto;
やheight: auto;
にアニメーションできたらいいな、と思ったことはありませんか?
たとえば、下記のようにテキストの量によってサイズが異なるボタンです。
これまではCSSでアニメーションするときは、固定値(width: 100px;
しかアニメーションが機能しませんでしたが、Chrome 129でサポートされたinterpolate-size
プロパティやcalc-size()
関数を使用すると、簡単にwidth: auto;
へのアニメーションが実装できます。
Animate to height: auto; in CSS
by Bramus!
グラデーションがくすんでしまうのには原因がある、それを自動的に解決して美しいグラデーションを生成できる無料ツール -Gradient Generator
Post on:2024年10月29日
美しいグラデーションを作成するには、補間するカラーにグレーが含まれないようにすることが重要です。グレーが含まれてしまうと、それがデッドゾーンになり、汚いグラデーションになってしまいます。
このグレーのデッドゾーンを回避し、簡単に美しいグラデーションを生成できる無料ツールを紹介します。
Kindle本の特大セールが開催! Figmaの解説書、UIデザイン、フロントエンド開発が最安値でお買い得です
Post on:2024年10月28日
※本ページは、アフィリエイト広告を利用しています。
Kindle本の特大セールが開催されています。
Figmaの解説書、UIデザイン、プロダクトマネジメント本、HTML/CSSのWeb制作、フロントエンド開発など、良書がたくさんセール対象です!
セール期間は、11/7まで。
対象のKindle本は最安値(当方調べ)、久しぶりのセール対象もあり、貴重なこの機会をお見逃しないように。
Illustratorに苦手意識がある人に! デザインするために必要な知識とテクニックが確実に身につく解説書 -はじめてイラレ
Post on:2024年10月25日
※本ページは、アフィリエイト広告を利用しています。
デザイン系のソフトで、その操作が難しいと思われているのがAdobe Illustratorかもしれません。他のソフトは使えるけど、Illustratorはいまいちという人もいると思います。
そんな苦手意識を持っている人に、Illustratorでデザインするために必要な最低限の知識とテクニックを確実に身につけることができる解説書を紹介します。
これは便利なVS Codeの機能拡張! CSSのclamp()関数を使ったレスポンシブ対応のフォントサイズが簡単にできる -Clamp It!
Post on:2024年10月24日
CSSの実装に便利なVS Code用の機能拡張がリリースされました!
レスポンシブ対応のフォントサイズをCSSで定義するときに、面倒なclamp()
関数の定義を簡単にできるClamp It!を紹介します。