新年最初のコーナーということで、 知ってるよ:
✺◟(^∇^)◞✺
これはCSSをやるべきだと思います。これは間違いなく私のお気に入りのテクノロジーであり、基本的に CodePen の精神と親友です。
まったく新しいニュース (ヌー ニューエス?) では、全体が 「石積み」の物語 終わりに近づき始めています。の 私たちは は(ドラムロールをお願いします):
.container {
display: grid-lanes;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 16px;
}
Code language: CSS (css)
私はそれが好きです。レーン。ドライブビデオゲームか何かをプレイしているようなものです。 WebKit ギャングの物語、デモも用意されています。
Safari テクノロジー プレビュー 234 でグリッド レーンを試してください。すべてのデモは次のとおりです。 webkit.org/demos/grid3 グリッド レーンの他の使用例を含む、新しい構文で更新されました。
私は「石工」という名前を付けたのはデイビッド・デサンドロの功績だと思いますが、この名前のほうが人々の頭にずっと残っているのは確かです。 彼ががっかりしているのは当然だ 新しい名前で。レンガの壁 (「石積み」接続) はこのようには見えない (90 度間違っています) という考えを捨てられません。したがって、私は新しいネーミングのファンになりました。
「こんなことになるとは思わなかった」カテゴリーには、 text-grow そして text-shrink。私はおそらく Dave Rupert の (古い) を使用したことがあります。 探しました 私のキャリアの中で数えきれないほどです。まず、ビューポート単位が時代遅れになりましたが、適切にするにはマジックナンバーが必要でした。これで…うまくいくでしょうか?だと思いますが、 ただのプロトタイプ これまでのところ。 (経由 アダム)
h1 {
text-grow: per-line scale;
}
Code language: CSS (css)

そして 別の 「こんなことになるとは思わなかった」のエントリーは スクロールトリガーのアニメーション。私はスクロールについてよく知っています –駆動される アニメーションを見て、その API 全体が非常にクールだと感じましたが、これは別のものです。通常、適用するときは、 animation ページが読み込まれるとすぐに実行されますが、場合によっては手動で遅延させます。と 駆動される アニメーションを使用すると、要素のスクロールの進行状況やビューポートに関連する位置に基づいてタイムラインにアタッチできます。これなら、あなたも持つことができます トリガーされた その代わり。トリガーは次のようなカスタム ID です。
animation: my-animation 0.5s;
animation-trigger: --thing-in-view play-forwards;Code language: HTTP (http)
次に、そのトリガーを作成します。
timeline-trigger-name: --thing-in-view;
timeline-trigger-source: view();Code language: HTTP (http)
どれが考えられますか 同じ または 違う 要素。いいね。私は明らかにそれが大好きです コレクション内のデモの束。
(新たに)気づきました カスタマイズ可能な選択 そして私は それを使って私自身の遊びがありました、しかしブレヒト・デ・ライテが巨匠です。 パート4を繋ぎます この問題に関するこれまでの 5 部構成のシリーズの中で。これが起こっていることです:
いいね:うわー。しかし、推測できたと思います。かつて CSS は、 :checked セレクターと HTML には入力に接続されたラベルがあり、人々はそれらを使用して構築しました 絶対に素晴らしいもの。より多くのインタラクティブ性が提供されています
Views: 0

