「労働者が自分の仕事をうまくやりたいなら、まず自分の道具を研ぎ澄まさなければなりません。」 - 孔子、「論語。陸霊公」
表紙 > プログラミング > CSS の A から Z まで

CSS の A から Z まで

2024 年 8 月 5 日に公開
ブラウズ:821

An A to Z of CSS

これは、私が部屋に入ると、両親と甥が車の隅から隅まで調べようとしているのを見つけたことからインスピレーションを得ました。

アクセシビリティ

多くの人が忘れていることですが、私はこれが応答性と同じくらい重要だと考えています。

Bブロック

書き込み方向に対して垂直。

C計算

CSS で計算を行います。とても便利な。

Dディスプレイ

ブロック、インライン、インライン ブロック、フレックス、インライン フレックス、グリッド、インライン グリッド、なしなど

E:空

子のない要素をスタイリングするための便利な疑似クラス。中に空白が含まれていない限り。

F フレックスボックス

初めて CSS を始めたとき、インスペクターを見ていろいろ遊んで勉強しました。そして、フロートを使用してレイアウトを作成した人の真似をしました。そして、物事の位置を決めるのがとても難しかったです。フレックスボックスについて学ぶことで、大きな違いが生まれました。

Gグリッド

私にとっては、フレックスボックスのより複雑で強力な兄弟のように今でも感じています。

H高さ

何かが水平方向に占めるスペースの量。

インライン化します

書き込み方向。 margin-inline: auto.

を使用できるセンタリングに非常に便利です。

J 正当化する

Flexbox Zombies では、ジャスティファイ レーザーを使用して、発射している方向のゾンビをターゲットにします。

K @キーフレーム

アニメーションのステップ。

L 行の高さ

テキストが大きすぎたり小さすぎたりすると、まったく読めなくなる可能性があります。

Mマージン

要素を大きくしない要素の周囲のスペース。

N なし

何かの表示を停止したり、境界線を削除したりするのに便利です。

O オブジェクトフィット

これは永遠に存在しているように思えますが、少し前に比較的あるものに出会いました。これには、オブジェクトフィットが新しく、まだすべてのブラウザで動作しないことに対処するために誰かが書いた JavaScript が含まれていました。

P パディング

要素を大きくする要素の周囲の間隔。負のパディングは負のマージンのようなものではありません。

Qクエリ

メディア クエリとコンテナ クエリ。レスポンシブ デザインとアクセシビリティに使用されます。

Rの応答性

サイトがすべての画面に収まるようにすることが重要です。かなり基本的なことのように思えますが、サイズによっては適切に適合しないサイトがたくさんあります。

S特異性

これは、サードパーティのスタイルをオーバーライドしようとするときに面倒になります。最近、いくつかの CMS プラグインが :where を使用しているのを目にしましたが、これはとても役に立ちます。

T テキスト

フォントのスタイル設定に使用されることもあります。フォントを使用する場合もあります。ただし、テキストの色を変更したい場合は除きます。その場合はどちらでもありません。

U単位

これらの中で最もよく使用されるのは、%、px、em、rem です。また、グリッドでは fr、トランジションとアニメーションでは s と ms も使用できます。

V の可視性

興味深いことに、可視の反対は隠されています。それは論理的に考えられることではありません。

W幅

何かが水平方向に占めるスペースの量。

X オーバーフロー-x

x にはちょっとしたチートですが、x から始まるものは何もありません。これは水平方向のオーバーフローを制御します。 x は Tailwind でも使用されます。たとえば、mx は水平方向のマージンです。

Y オーバーフロー -y

x と同様に、垂直方向のオーバーフローを制御します。そして、y は通常、Tailwind の垂直方向を表します。

Z z-インデックス

使用できる最高/最低の Z インデックスは (-)2,147,483,647 です。あるいは、無限大でも同じことが得られます。しかし、9 秒をたくさん入力して、なぜ機能しないのかを考える方が、はるかに簡単な方法です。

リリースステートメント この記事は次の場所に転載されています: https://dev.to/nicm42/an-a-to-z-of-css-5178?1 侵害がある場合は、[email protected] に連絡して削除してください。
最新のチュートリアル もっと>

免責事項: 提供されるすべてのリソースの一部はインターネットからのものです。お客様の著作権またはその他の権利および利益の侵害がある場合は、詳細な理由を説明し、著作権または権利および利益の証拠を提出して、電子メール [email protected] に送信してください。 できるだけ早く対応させていただきます。

Copyright© 2022 湘ICP备2022001581号-3