CSSの技はたくさん存在する!!
最近、CSSについて再度学習しているのだが、小技はたくさん存在している。
一度に全て紹介するのは大変なので、厳選したものをいくつか紹介していく。
textareaのリサイズを禁止にする方法
実はブラウザによってtextareaのサイズをユーザーが調整できる機能があります。
デザイン的にいまいちの場合はこれを無効にすることができます。
(UXの観点から見ると、リサイズできた方がいいとは思いますが、あしからず)
以下、コードです
textarea {
resize: none;
}
※調査の結果、Chrome,Edge,Safariは対応しているみたいですが、IEは対応していないみたいです。(対応ブラウザ)
CSSでカラーピッカーを表示
inputタグにtype="color"
を指定するだけで簡単にカラーピッカーを表示させることができます。
ユーザーに色を選んで欲しい時に重宝しますね。
以下、コードです。
<input type="color" value="#e66465">
value="#e66465"
のようにデフォルトを設定することもできます。
まとめ
かなり知らないことがたくさんあってびっくりしましたが、まだまだあるので便利だと思ったものを
また紹介していきます。
CSSの可能性は無限大!!!