タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

Flexboxに関するvvakameのブックマーク (4)

  • Solved by Flexbox — クリーンでハックのない CSS

    イントロダクションCSSには長らく適切なレイアウトメカニズムが不足していました。トランジション、アニメーション、フィルタ、これらはすべて素晴らしくて有用な言語への追加機能ですが、しかしWeb開発者が不満だった、永遠に続くようにも思われた主要な問題に対処するものではありませんでした。 Flexboxに感謝します。ついに我々は解決方法を手に入れました。 このサイトはCSSフレームワークではありません。その代わり、CSSだけでは解決するのが難しい、あるいは不可能だった問題が、今やFlexboxでとても簡単になった事例のショーケースとなることが、このサイトの趣旨です。また、Internet Explorer 11の最近のリリースとSafari 6.1により、今やすべてのモダンブラウザがFlexboxの最新仕様に対応しています。 以下のデモをご覧ください。Webインスペクタでスタイルを眺めるか、また

    Solved by Flexbox — クリーンでハックのない CSS
  • フレックスボックスの基本概念 - CSS: カスケーディングスタイルシート | MDN

    CSS チュートリアル CSS の基 CSS の第一歩 CSS の第一歩の概要 CSS とは何か CSS 入門 CSS の全体像 CSS の働き 評価課題: 経歴ページのスタイル設定 CSS の構成要素 CSS の構成要素の概要 CSS セレクター Type, class, and ID selectors Attribute selectors Pseudo-classes and pseudo-elements Combinators カスケードと継承 Cascade layers ボックスモデル 背景と境界 書字方向の操作 内容のはみ出し CSS の値と単位 CSS における大きさの指定 画像、メディア、フォームの要素 表のスタイル付け CSS のデバッグ CSS の整理 評価課題: CSS の基的な理解度 評価課題: 素敵なレターヘッドの便箋の作成 評価課題: かっこいいボック

    フレックスボックスの基本概念 - CSS: カスケーディングスタイルシート | MDN
  • CSS3 Flexbox の各プロパティの使い方をヴィジュアルで詳しく解説 | コリス

    CSS Flexboxとは水平または垂直に要素を配置し、柔軟なレイアウトを実現できるCSSのレイアウトモジュールです。複雑なレイアウトでも今までより少ないコードで、よりシンプルなプロセスで実装することができます。 CSS Flexboxの基礎知識、Flexboxの各プロパティがどのように機能するのか、Flexboxでどのようにレイアウトを実装するかを視覚的に解説します。 【アップデート: 2022年6月16日】 IEがサポート終了したことにあわせて、修正しました。 【アップデート: 2021年8月1日】 Flexboxの解説を2021年の現状にあわせて、修正しました。 【アップデート: 2020年8月23日】 Flexboxの解説を2020年の現状にあわせて、修正しました。 【アップデート: 2019年3月27日】 Flexboxの解説を2019年の現状にあわせて、修正しました。 【アップ

    CSS3 Flexbox の各プロパティの使い方をヴィジュアルで詳しく解説 | コリス
  • 動かして覚えるFlexboxのチュートリアルサイト『Flexbox in 5 minutes』 | 100SHIKI

    マニアックではあるが便利そうだったのでご紹介。 Flexbox in 5 minutesでは、新しいCSS技術であるFlexboxについて勉強することができる。 実際にブラウザをリサイズしながら要素の変化を見ることなどもできるので便利ではなかろうか。 「Flexbox、気になっていたんだよねぇ」という人はチェックしてみてもいいだろう(英語だけど)。

    動かして覚えるFlexboxのチュートリアルサイト『Flexbox in 5 minutes』 | 100SHIKI
  • 1