kishiken今回はFontAwsome5のアイコンフォントを使い、フォームのラジオボタン・チェックボックス・セレクトメニューのデザインをカスタマイズする方法を解説します。アイコンを使うことで、フォームのデザインを変えることができたり、アクセントになります。今回の方法はコピペで簡単に設置できますので、ぜひ試して下さい。上の「Start」ボタンを押し、URLをコピーします。使いたいアイコンを探し、Unicodeをコピーします。CSSでFontファミリーの指定と、Content部分でUnicodeを指定します。CSSFontAwsome5をCSSで扱う方法まずは、以下サイトにてFontAwsome5のCDN用URLを取得します。FontAwsome5はFreeであればライセンス費用無料で使用できます。https://origin.fontawesome.com/上の「Start」ボタンを押し、URLをコピーします。使いたいアイコンを探し、Unicodeをコピーします。CSSでFontファミリーの指定と、Content部分でUnicodeを指定します。FontAwsome4とfont-familyの指定方法が違うのでご注意ください。"\f14a";}チェックボックスをカスタマイズするhtml5のinput要素のtype=”checkbox”をFontAwsome5で装飾します。デフォルトの■を非表示にして、FontAwsome5の■アイコンに変更します。}ラジオボタンをカスタマイズするhtml5のinput要素のtype=”radio”をFontAwsome5で装飾します。デフォルトの●を非表示にして、FontAwsome5の●アイコンに変更します。}セレクトメニューをカスタマイズするhtml5のselect要素をFontAwsome5で装飾します。デフォルトの三角形を非表示にして、FontAwsome5の下アングルアイコンに変更します。css・FontAwsome・ui・html5・iconこんな記事も読まれています。FameThemes。