Webサイトを作ってみよう|連載

サンプルサイトをコーディングしてみよう④【Webサイトコーディングの流れ】

前回の続きです。 引き続き「Menu」エリアとフッターのCSSを設定していくよ。 「Menu」エリアのCSSを設定する ...
Webサイトを作ってみよう|連載

サンプルサイトをコーディングしてみよう③【Webサイトコーディングの流れ】

前回の続きです。 引き続きサンプルサイトのCSSを設定していきます。構造を詳しくするためのHTMLの追加や、class名...
Webサイトを作ってみよう|連載

サンプルサイトをコーディングしてみよう②【Webサイトコーディングの流れ】

前回の続きです。 HTMLの基本マークアップが出来たところで、CSSの設定に取りかかります。今回はPC用 > スマホ用の...
Webサイトを作ってみよう|連載

サンプルサイトをコーディングしてみよう①【Webサイトコーディングの流れ】

今までWebデザインを学んで、なんとなく理解できましたが、自分で1からコーディング出来る気がしません。 最初は誰でもそう...
Webサイトを作ってみよう|連載

レスポンシブデザイン。PC・スマートフォンの表示切り替え【CSS基礎】

レスポンシブデザインとは 昔のWebサイトではパソコン用のサイトと携帯用(スマホ用)のサイトを別に作っていました。それで...
Webサイトを作ってみよう|連載

要素を横並びにする、フレックスボックスの使い方③【CSS基礎】

前回からの続きです。 今回でフレックスボックス関連プロパティの解説は完結です。まずはフレックスアイテムの折り返しからです...
Webサイトを作ってみよう|連載

要素を横並びにする、フレックスボックスの使い方②【CSS基礎】

前回の続きです。 display: flex;に関連するプロパティを引き続き学びます。 flex-basis|フレックス...
Webサイトを作ってみよう|連載

要素を横並びにする、フレックスボックスの使い方①【CSS基礎】

CSSの基本的な使い方も大詰め、レイアウトの要でもある要素の横並びについて学びます。 ブロックボックスは縦に並ぶ 要素を...
Webサイトを作ってみよう|連載

要素をセンターに寄せる【CSS基礎】

要素を真ん中に寄せるには、前回の「ボックスモデル」を理解した上で、CSSを設定しないとうまく制御できません。 テキストや...
Webサイトを作ってみよう|連載

要素サイズの調整と余白の設定【CSS基礎】

CSSを使ってレイアウトするには、要素サイズの制御方法を知っておく必要があります。この記事では要素のサイズと余白の設定に...