seiko

レスポンシブデザインとは レスポンシブデザインは、PC・タブレット・スマートフォンなど閲覧ユーザーの画面サイズに合わせてページレイアウトを最適化するデザインのことを指します。 レスポンシブデザインの初 ...

flex-boxを使用したレイアウト Flexboxとは Flexbox（フレックスボックス）とは「Flexible Box Layout Module」の略のことで複雑なレイアウトも簡単に組める書き ...

リンクの擬似クラス リンクにカーソルが乗ったり、クリックされた場合のスタイルを変化させるには、以下の擬似クラスを使用します。 これらの擬似クラスに文字色・背景色・下線などを指定することで、 リンクテキ ...

擬似クラスとは 擬似クラスとは、指定要素が特定の状態の時、スタイル適用するセレクタです。 文章構造外の情報でスタイルを変化させます。 擬似クラスのサンプル :link 未訪問のリンク要素の指定 :vi ...

複数指定 同じデザインを適用させたいタグやclassやidが複数あるときは、まとめて変更することができます。 タグやclass名、id名を「,」で区切って並べていきます。 並べる数がはいくつでもOKで ...

子孫セレクタ 子孫セレクタは、親とその子孫という形で指定するセレクタです。 下記のように、親要素と子要素の間にスペースをあけることで親要素の中の特定の子要素のみを指定してCSSを適用させることができま ...

タグに名前をつける classとid タグに名前をつけることで特定の要素のみにCSSを適用させることができます。 名前をつける時に使用する属性には「class」と「id」の2種類があります。 clas ...

背景を彩る background プロパティ background プロパティ backgroundプロパティにより、背景に関するCSSプロパティが一度に設定できます。 一括指定できるプロパティ ・b ...

要素の周りに線をつける borderプロパティ borderプロパティ borderはHTMLの部品に枠線を引くためのプロパティです。 borderは上下左右のボーダーラインの太さ、色などを一括でまと ...

余白を調整する marginプロパティと padding プロパティ 余白の概念 余白のプロパティにはmargin（マージン）とpadding（パディング）があります。 要素を四角い入れ物（ボックス） ...