type属性がbutton, submit, resetのinput要素について

f:id:damdom:20171203201442p:plain

サンプルを作りながら気づいたのでメモ。 type属性がbutton, submit, resetのinput要素について、以下のことに気づいた。

  • ボタンのテキストはvalue属性が表示されているためか、テキスト選択できない
  • ::before疑似要素、::after疑似要素が使えない

codepen.io

input要素よりbutton要素を使ったほうが良い。value属性がボタンの表示テキストと関係なく使えるようになるし。見た目のバリエーションも広がるし。