HTMLのフォームコントロール要素 (input要素, button要素, select要素, textarea要素, etc…) には、ブラウザ毎に異なったデザインが適用されていて、全てのブラウザで共通のデザインを適用するのは、割とハードルが高めです。
特に、ファイル入力 (input[type=”file”]) は柔軟にデザインするのが困難です。今回はJSを使用してファイル入力を柔軟にデザインする方法をご紹介します。
HTMLのフォームコントロール要素 (input要素, button要素, select要素, textarea要素, etc…) には、ブラウザ毎に異なったデザインが適用されていて、全てのブラウザで共通のデザインを適用するのは、割とハードルが高めです。
特に、ファイル入力 (input[type=”file”]) は柔軟にデザインするのが困難です。今回はJSを使用してファイル入力を柔軟にデザインする方法をご紹介します。
CSSは簡単なようで難しいです。設定した覚えのないスタイルが適用されているっていうのはウェブサイト制作者なら誰でも経験があるはず。CSS設計をきちんとしていれば起こりづらくはなるのですが、それでも、ごくまれに「あれっ、おかしい」ってなります。
そんなときに役立つ、CSSセレクタの優先順位を自由自在に上げる方法をご紹介します。
Microdataの構造を参考にしたCSS設計・命名規則、名付けて「S2CSS」を紹介します。