ひょーちゃんのWEBデザインを学ぶ

タイル型のレイアウトを作る方法を説明していきます。CSSグリッドflexboxと同じように、親要素のコンテナと子要素のアイテムを作成します。「display：grid」を記述して開始します。CSS.container{desplay:gri...

レイアウトを組むことが出来るFlexboxについて説明していきます。Flexbox（フレックスボックス）Flexboxとは、複雑なレイアウトなどを簡単に組むことが出来ます。基本的な考え方としては、親要素のコンテナの中に子要素のアイテムを入れ...

classとidについて説明していきます。class（クラス）classは、複数の要素に同じスタイルを適用する際に使用します。記述するときは必ず「.（ピリオド）」をつけます。同じclass名は再利用が出来るので何回でも使用可能です。例えば、...

リストを装飾するための方法を説明していきます。list-style-type（リストスタイルタイプ）list-style-typeは、リストの記号や番号のスタイルを指定することが出来ます。none:リストマーカーを非表示disc:黒丸cir...

要素の枠線を設定する方法を説明していきます。border（ボーダー）borderは、要素の枠線（外側の線）に関わる情報を一気に設定することが出来るプロパティです。border：太さ 種類 色 ;という風になっています。border: 1px...

要素の外側・内側に余白をつける方法を説明していきます。margin（マージン）要素の外側（要素から他の情報）までの余白は、marginプロパティで指定出来ます。数値で指定：pxやrem、%などの単位をつけるauto：関連するプロパティの値に...

CSSで幅や高さを調整する方法を説明していきます。サイズ（幅・高さ）の調整方法幅は「width」プロパティ、高さは「height」プロパティを使って指定します。数値で指定：pxやrem、%などの単位指定auto：関連するプロパティの値によっ...

CSSの背景画像の設置方法について説明していきます。背景画像の設置方法以下の様々なプロパティを使用して、背景に画像を設置することが出来ます。background-image一番基本となる背景画像の設置方法です。背景画像が読み込まれないことも...

CSSで色を指定する方法や、配色について説明していきます。文字色の指定方法CSSで文字色を指定することが出来ます。主に以下の方法があります。カラーコード16進数を使用した6桁の英数字を指定する方法です。カラーコードは「＃」からはじまり、数字...

CSSで文字や文章をどのように装飾していくのか説明していきます。フォントサイズフォントサイズを変更する場合は、「font-size」プロパティを使い文字のサイズを指定します。適切な文字サイズは、14px～18px程度が見やすく一般的です。ま...