npm で Fontawesomeを使う 作成日時: 2024年12月23日 17時08分 最終更新日時: 2024年12月23日 17時08分 Categories: フロントサイド Tags: npm tips fontawesome npm install @fortawesome/fontawesome-free これでfont-awesomeの最新版がインストールされる。後は、App.jsに下記を追加する。 import '@fortawesome/fontawesome-free/css/all.min.css'; importした後、JSXに、 <i className="fa-regular fa-square-check"></i> を追加する。 ちなみに、下記では旧版がインストールされてしまう。 npm install font-awesome ...
HTML5とCSS3だけでAmazon風の星レビューのフォームを再現する【ホバーした時、ラジオボタンのチェックされた時に星を表示】【flex-direction:row-reverseで逆順対応可】 作成日時: 2022年2月11日 14時51分 最終更新日時: 2022年2月11日 14時51分 Categories: フロントサイド Tags: html5 css3 fontawesome ウェブデザイン 以前、サーバーサイドで1から5のいずれかの数値を受付、DBに保存する方法を実践したが、フロント系ではそれをもう少しおしゃれに実装させたい。 そういう時は、なるべくJavaScriptを使用せず、HTMLとCSSだけで表現するのがベターなやり方だと個人的には思う。 だからこそ、今回も同様にHTMLとCSSだけでレビューの星を入力するフォームを再現した。 マウスをホバーした時、星が塗りつぶされ、外れると星が ... 続きを読む