【CSS】textareaの枠線、右下の//、フォーカスした時の青い枠線を消す

2024.09.162024.10.10

textareaタグにデフォルトで設定されている、枠線、右下の//、そしてフォーカスした時に出てくる青い枠線をまとめて消去した方法をまとめてみました。

textarea {
    /* 枠線を消す */
    border: none;

    /* 右下の//(サイズ変更機能)を消す */
    resize: none;

    /* フォーカスした際の青い枠線を消す */
    outline: none;

    /* widthを100%にしておくことで、レスポンシブ対応ができます。 */
    width: 100%;
}

これで完全にまっさらな状態のテキストボックスの出来上がりです。