Now Loading...
menu
  • すべて
  • web制作
  • 写真を楽しむ
  • カメラで遊ぶ
  • モノ
  • 旅
  • おすすめツール

フォームパーツの装飾。デフォルトのcssをリセットしよう。

フォームパーツの装飾。デフォルトのcssをリセットしよう。

細やかな装飾を施したデザインのコーディングをするとき。

フォームのパーツでこんな風に、画像を使う場合です。

 各ブラウザのデフォルトの設定が当たってしまうため、リセットして隠す必要があります。

 

 

buttonタグやselectタグのデフォルトを隠そう!

このリセットの設定を当ててから、装飾が当たるようにします。

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

 

IEにはこの指定が必要。

select::-ms-expand {
    display: none;
}

 

 

「お問い合わせ」や「注文」「お見積り」「予約」などのページは、サイトの最終目的地。

入力項目が多くページが分かれる場合などには、ユーザーが今どこにいて、これからどこに行くのだろうか?がわかるような道しるべを表示するなど、離脱されないような流れを作ることも大事です。

 

気にしなくてはいけないポイントがたくさんある、フォームの実装でした。

 

share on

TIPS&NOTE TOPへ