CSS3では、フレックスを使ってたった2行でコンポーネントの並びを変えられます。
もう『inline-block』『float』を使いません。フレックスでは配置以外にもいろいろな設定ができます。
今回は、フレックスの基本になる『並びとその方向を変える方法』を説明します。
続きを読むCSS3で困っている人のために情報を発信します。
CSSは、HTMLで定義されたウェブコンテンツに装飾を付ける技術です。
スマホやタブレットなどいろいろなデバイスに対応する(レスポンシブデザイン)ことが必須になって、ますます専門性・重要性が高まっています。
CSSはプログラミングでないことに注意。(あくまで定義ファイルのフォーマット)
CSS3では、フレックスを使ってたった2行でコンポーネントの並びを変えられます。
もう『inline-block』『float』を使いません。フレックスでは配置以外にもいろいろな設定ができます。
今回は、フレックスの基本になる『並びとその方向を変える方法』を説明します。
続きを読むHTMLとCSSだけで作ったレスポンシブに対応したWebページの基本フォーマットを全面的にアップデートしました。
の4パターンを用意。ここでは新旧サンプルの比較を行います。
続きを読むHTMLとCSSだけで作る、レスポンシブに対応したWebページの基本フォーマットを用意しました。
の4パターンがあります。
cssクラスを1か所変えるだけでパターン変更ができて、スマホになるとサイドメニューを下の方に表示します。
続きを読むHTMLの水平線を表示するのはかんたんで、hrタグを書くだけです。CSSでデザインの変更もできます。
太さや色、グラデーション、画像などサンプルを作りながら、かんたんに誰にも分かるように解説します。
デフォルトのhrタグのしくみもくわしく解説します。
続きを読むCSS3のchecked疑似クラスを使えば、JavaScriptを使わない、軽量なコンポーネントを作ることができます。
閉じるボタンやタブ機能などのサンプルを用意しました。
続きを読むHTMLとCSSだけで『開く・閉じる』の切り替えボタンをかんたんに作る方法をご紹介します。
画面を遷移しないでコンテンツを開閉します。JavaScriptは使いません。
これは、コンテンツをコントロールするときWebサーバーにリクエストを送信しないので、Webページのパフォーマンスを上げることができます。
続きを読む