サイト構築
CSSの最新トレンドにおける現状のまとめ、よく使用する新機能やプロパティや疑似クラス、人気のフレームワークや検証ブラウザなど
Post on:2023年9月7日
CSSの進化は速く、ここ1,2年はさらに速くなりましたね。その要因の一つがIEのサポート終了で、現在はエバーグリーンのブラウザ（自動で最新版にアップデートするブラウザ）となり、モダンCSSの機能がたくさん使用できるように […]
Monotype、フォントワークスの買収を完了！ フォントワークスのユーザーはGothamなど人気フォントが利用可能になるって
Post on:2023年9月6日
2023年9月1日に、Monotype社とフォントワークス社からそれぞれ「フォントワークスの買収を完了」「Monotypeの傘下に」のリリースが発表されました。 これによりフォントワークスの従業員と1,000種類以上のフ […]
これでSafariにも実装できる！ スクロールをトリガーにしたアニメーションのポリフィル -Scroll-timeline Polyfill
Post on:2023年9月5日
先日の記事で、CSSでの実装が大きく変わる！ Scroll-driven Animations スクロールをトリガーにしたアニメーションを実装する方法を紹介しました。Chrome 115から実装された新機能ですが、ネック […]
全部、商用利用も無料！ Google Fontsの中でも可読性・判別性に優れたフォントのまとめ、UIデザインにも最適
Post on:2023年9月4日
Google Fontsには日本語フォントや英語フォントをはじめ、さまざまな言語のフォントをすべて無料で使用できます。いやー、いい時代ですね。 そんなGoogle Fontsの中からリーダビリティ、レジビリティに優れた、 […]
CSSでスムーズなアニメーションを実現する4つの新しい機能
Post on:2023年8月31日
今年もCSSの進化が止まりません！ 先日紹介した表示・非表示をdisplayプロパティでアニメーションできるようになったり、スクロールをトリガーにしたアニメーションなど、新機能が登場しました。 今まではJavaScrip […]
CSSの新機能@scopeが便利すぎる！ セレクタの適用範囲を設定できる、@scopeの基礎知識と使い方
Post on:2023年8月30日
CSSでこの機能を待ち望んでいた人もいると思います。 セレクタの適用範囲を設定できる@scopeがいよいよChromeでサポートされます。@scopeの基礎知識と使い方を紹介します。 たとえば、下記のHTMLにはimgが […]
CSSで角丸を美しく実装するテクニック、ネストされた外側と内側を相対角丸の美しいバランスで実装
Post on:2023年8月28日
カードやパネルの外側と内側に角丸を使用したときに、なんだかバランスが悪いなと思ったことはありませんか？ 角丸を二重にするときに外側の角丸と内側の角丸の値を同じに設定すると、内側の方がすこし大きく見えて、不格好になってしま […]
最近のUIデザインのテクニックを解説！ より使いやすいボタンをデザインするときのポイント
Post on:2023年8月24日
WebサイトやスマホアプリのUIに使用されているボタンをデザインするときに気をつけるポイント、より使いやすくするためのポイントを紹介します。 UIのボタンは色だけに頼らない明確な視覚的階層が必要で、同じスタイルの場合は区 […]
色の名前、日本語と英語での色の名前、世界各国の伝統色の名前が分かるサイトのまとめ
Post on:2023年8月23日
いろいろな色の日本語での名前、英語での名前、日本の伝統色の名前をはじめ世界の伝統色の名前などが分かるサイトを紹介します。
Chrome 116 デベロッパーツールの新機能が便利！ 正常に読み込まれなかったスタイルシートのデバッグが簡単に
Post on:2023年8月22日
先日リリースされたChrome 116 デベロッパーツールの新機能で、正常に読み込まれなかったスタイルシートを簡単にデバッグできるようにするための多くの改良が加えられました。 What's New in DevTools […]
sponsors
