CSS Bootstrap5 モーダルを作成するサンプル
目次 ・Bootstrap5のモーダルのサンプル ・Bootstrap5のモーダルのコード ・モーダルの大きさを指定 ・モーダルの色/大きさを指定 Bootstrap5のモーダルのサンプル ボタンをクリックするとモダール […]
カテゴリー：HTML / CSS
CSS Bootstrap 使い方のサンプル
目次 ・Bootstrapを取得する ・背景色と文字の色をつける ・ボタンやドロップダウンリストを使用する ・Bootstrapのアイコンを使用する Bootstrapを取得する Bootstrapのページに行き、ダウン […]
iframeで画面を分割するサンプル
目次 ・iframeとは ・iframeのサンプル ・iframeで制限をコントロールする(sandbox) ・子画面から親の画面を操作する iframeとは 画面内に窓を作りその中に別ファイルを表示できます(上記図イメ […]
CSS background position 画像の配置場所を決める
目次 ・background position ・right bottom(右下)を指定 ・数値+% 数値+%を指定 ・数値+単位(px) 数値+単位(px)を指定 background position 背景画像の場所 […]
CSSのnotで特定の要素にCSSを適用しない(否定)
cssのnotで特定の要素にCSSを適用しない否定のサンプルです。 特定の要素にCSSを適用しない (not) セレクタ:not(適用しないセレクタ){ } セレクタ:not(適用しないセレクタ):not(適用しないセレ […]
HTML 画像ファイルを表示するサンプル(img)
目次 01. サンプル ・画像ファイルを表示する ・ファイルがない時に文字を表示(alt) ・相対パスまたは絶対パスで開く ・画像のサイズを指定 ・ツールチップをつける(title) 02. 中央寄せ ・画像を中央寄せに […]
SassでCSSを作成するサンプル
SassでCSSを作成するサンプルです。 目次 サンプル Sass サース 変数を使用する if文を使用する for文を使用する @mixin(ミックスイン)を使用 […]
CSS @media メディアクエリで幅に応じてCSS適用
目次 ・@media ・min-widthを小さい順に指定(モバイルファースト) ・max-widthを大きい順に指定(PCの表示を主とする) ・画面幅の条件合致時のみ別CSSファイルを読み込むサンプル ・chromeの […]