モダンCSSによる絶対配置（position: absolute;）の削減
テキストを画像の上に配置、タグを重ねたい、ヒーローセクションで画像の上にコンテンツを配置、画像のアスペクト比を維持させたい時など、CSSの絶対配置（position: absolute;）を使用することがあります。もちろん、それでうまくいく時はありますが、なんらかの制約があったり、テキストが長いと崩れたりします。 position: absolute;が必要だと思われていた実装で、使用しなくても実装できるモダンCSSのテクニックを紹介します。 Less Absolute Positioning With Modern CSS by Ahmad Shadeed はじめに ケース1: カードのオーバーレイ ケース2: カードのタグ ケース3: ヒーローセクション ケース4: display: contents; ケース5: カードアイテムの並べ替え ケース6: 中央寄せ ケース7: 画像のアス
遊んでCSS Flexboxを覚える / Flexbox Froggy をやってみた - よしたく blog
tl;dr 内容 特徴 実際の画面 まとめ 参考情報 tl;dr Flexbox Froggy でFlexbox を楽しく学ぼう 内容 CSS触ってますか？？CSSって思っているとおりに動かなくて難しくないでしょうか？自分は全く使いこなせません。そして、何から学んだらいいかわからず途方に暮れていました。画面の 見た目 に関することですし、ゲーム感覚で動いて楽しく学べるものがないかなぁと思ったらありました。Flexbox Froggyです。 flexboxfroggy.com 特徴 Flexbox Froggyは3つの特徴があります。 面倒な登録が必要なし 24問でサクッと終わる ヒントと答えがある 答えはこちら Flexbox Froggyは、画面を開いてすぐに問題を解くことが出来ます。そして自分は1時間ほどで終わりました。最終問題は自信がなく時間もかかってしまったのですが、ヒントを見たり
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
