それは1月で、私たちは少しのラウンドを見ています CSSウィッシュリスト ラウンドを作ります。
transform 未知のサイズの要素を特定のサイズに強制するために、彼も 適切に書いた。 attr() 関数。 うーん！それは多くの人々がCSSについて時間をかけて、彼らが望むものを明らかにするために時間を取っています。 CSSが最近行く方法は、2024年に再び大きな進歩を見て驚かないでしょう。
Stephanie Ecklesは、CSSで12のワンライナーを指摘しています それは 全て 非常に便利で強力です。
1つのライナー。
のようなもの p { text-wrap: pretty; } これにより、Webタイプがすべて良くなります。 5年前、彼らが何が来るのか知っていれば、私たちのギャップの口は床にあったでしょう。
ブレヒト・ド・ルイテ 2つの真新しいCSSとHTMLのものを取り、それらを一緒に破壊しました：
これはクールな相互作用です。
しかし、これは実際には終日半ばに公開されました デモ すでに壊れています。 Chrome Canaryでは、実験的なWebプラットフォーム機能フラグがオンになっているためだけに機能したため、この実験的なものがどれだけ速く動くかを示すだけです。
そうではありません
ベン・フレーンはとても賢いアイデアを持っています CSSで角度のある線を描くため（ラインチャートなど）。奇妙なことに、CSSでは特に簡単なことではありません。さまざまな方法を作成して、それらを回転させることができますが、次のようにするのは難しいです。ここからここまで行を描画します。 SVGは通常、そのためのパスです。
ベンのテクニックでは、あなたはそれを利用します polygon() 関数と clip-path。特定の座標のクリップパスでポイントを「描画」し、1pxの差でまったく同じ座標に戻り、新しい色が「輝く」ことができる小さなギャップを残します。
のように：
clip-path: polygon(
0% 60%,
20% 90%,
40% 43.33%,
60% 61.67%,
80% 23.33%,
100% 18.33%,
100% calc(18.33% - 1px),
80% calc(23.33% - 1px),
60% calc(61.67% - 1px),
40% calc(43.33% - 1px),
20% calc(90% - 1px),
0% calc(60% - 1px)
);
ロビンレンドル 一度さまざまなチャートタイプを作成しました CSSのみですが、今までこのようなCSS「スパークライン」を見たことはないと思います。
Be the first to comment
