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

※ この記事にはアフィリエイトリンクが含まれます

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

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

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

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

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

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

効率的にCSSを学びたい方へ

CSSを使ってレイアウトやデザインの表現力を高めたい方には、動画学習サイトUdemyを活用してみましょう。基礎から応用まで体系的に学べる講座が揃っており、初心者でも無理なくステップアップが可能です。

もし「何から始めたらいいか迷っちゃうな…」という方には、
「Web開発入門完全攻略コース – HTML/CSS/JavaScript」 がおすすめです！
この講座は、プログラミングがはじめてでも大丈夫。CSSだけでなく、HTML・JavaScriptの基本をしっかり学びながら、自分でWebページを作れるようになります。楽しみながら“創れる人”を目指しましょう！

ローコード開発でエンジニアは不要に？Power Platform時代に求められる新しい役割とは

「ローコード」「Power Platform」の普及でエンジニアの仕事はどう変わる？不要論に対する現実的な見解と、キャリアに活かすための学び方・転職戦略を具体的に紹介します。