[CSS] HTMLとCSSによるシンプルなプルダウンメニュー
HTMLとCSSによってできる、マウスオーバーによって展開するプルダウンメニューです。深い階層はありません。 サンプルはこちら。 プルダウンメニューのサンプルコード 動作に必要最低限のコードのみを記述したシンプルなソース… 続きを読む »
HTMLとCSSによってできる、マウスオーバーによって展開するプルダウンメニューです。深い階層はありません。 サンプルはこちら。 プルダウンメニューのサンプルコード 動作に必要最低限のコードのみを記述したシンプルなソース… 続きを読む »
Androidのスマートフォンやタブレットのブラウザアプリである「Google Chrome」で、Webページで読み込まれる画像などのキャッシュを削除する方法です。 WebページのCSSを更新してそのページをAndroi… 続きを読む »
Webページである要素を画面の中央に表示するCSSです。 ブラウザの表示領域のサイズが変わっても、要素は画面中央に固定されます。 サンプルソース id属性に title という名前をつけたdivタグを画面中央に表示するサ… 続きを読む »
今までCSSは、HTMLを書いたファイル(〜.html)の中に書いていました。 しかし、CSSの記述が増えてくると、HTMLファイルが長くなって編集しづらくなったり、似たデザインの別のHTMLに同じCSSを何度も書かなけ… 続きを読む »
CSSを適用する対象のタグやclassのことをセレクタと呼ぶことを以前説明しました。 今回は、これ以外にCSSで使える特殊なセレクタについて説明します。 idセレクタ HTMLタグには、class属性と同じように id属… 続きを読む »
以前、擬似要素について少し触れました。 今回は、似ているけれど別物である擬似クラスについて紹介します。 擬似クラスは特定の状態になった要素にCSSを適用させることができます。例えば、ユーザーのアクションに応じて設定するC… 続きを読む »
positionプロパティについて HTML要素の表示位置を変更したい時に役立つCSSのプロパティです。このプロパティを利用してHTMLの構造にとらわれない自由なレイアウトを行うことができます。 このプロパティに設定でき… 続きを読む »
Windowsでは、div要素などにCSSのプロパティ overflow: scroll を設定すると、スクロールできないほど小さい要素の幅であった場合にもスクロールバーが表示されてしまうことがあります。 ::-webk… 続きを読む »
前回はdivタグを使ってページレイアウトを作る例を紹介しました。 今回は「spanタグ」を使ったページ装飾例を紹介します。 spanタグ も divタグ と同じく用途が決められていないタグです。違いは divタグ がブロ… 続きを読む »
前回はブロックレベル要素とインラインレベル要素の違いについて説明しました。 今回は、ページレイアウトを作る上で重要なタグを紹介します。それは、ブロックレベル要素の「divタグ」とインライン要素の「spanタグ」です。 こ… 続きを読む »