回答編集履歴

1 見た目の実現についてしか記載していなかったのでDB等バックエンドが別に必要である旨の記載を追加しました

PgMidori

PgMidori score 176

2020/07/16 11:00  投稿

ずっとテキストエリアなんだけど
カーソルでホバーした時:テキストエリアの見た目
ホバーしてないとき:通常のテキストのような見た目
というようにホバーの有無でテキストエリアの見た目を変えたいだけならCSSのみでも`:hover`疑似クラス等を活用することで出来るのではないでしょうか。
「通常のテキストっぽい見た目にするのではなく実際に通常のテキストにしたい」
「テキストエリア以外の項目の色や表示も変えたい」
というのであれば`JavaScript`の知識も必要になるかと思います。
というのであれば`JavaScript`の知識も必要になるかと思います。
** ----- 補足 ----- **
上で記載した内容は、質問者様が画像で説明しているような
「カーソルでホバーした時にコメント追加のUIや吹き出しを表示する」
という見た目の実現に限った回答です。
「コメントとして追加した内容を他の利用者にも見えるようにしたい」
「複数の利用者で会話できるようにしたい」
といった機能を実現するためには、
ほかの方が回答してくださっているように
「入力されたコメントをどこかに保存する仕組み」
「保存してあるコメントを読み込んで表示する仕組み」
を別に作る必要があります。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る