サンプルコード:HTML/CSS一般

ページ内の指定した場所へジャンプする

縦に長いページなどで同じページの指定した場所にジャンプする時や、他ページの指定した場所にジャンするコードです。ジャンプする場所にa要素を設け、name属性でラベルをつけます。そしてリンク先としてそのラベルを指定します。

iPhoneの自動文字サイズ調整機能を無効化する

iPhoneでは画面を横向きにした時、デフォルトでは自動文字サイズ調整機能が働いて文字が大きくなってしまいます。
これによりレイアウト崩れなどが発生する恐れがある場合はCSSで無効にしておきます。

画像の配置を横方向中央揃えにする

画像を横方向に中央揃えにするには、img要素に対してCSS設定します。
img要素をpタグで囲んでいる場合はp要素に対してCSS設定します。

floatを解除するmicro clearfix

floatを使用している親要素にclearfixクラスを適用することで、floatを解除します。
古いブラウザには対応しないシンプルなコードのmicro clearfixです。

リスト内のイメージ要素を上下左右中央揃えにする

画像の左右中央揃えは簡単ですが、上下左右となると少し工夫が必要です。
リスト内のimg要素をCSSの設定で上下左右中央揃えにするコードです。

ページの先頭へ