JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/6/tinymce.min.js"></script>
<h1 style="text-align: center;">JavaScript 系列四:第7課 ── TinyMCE 套件</h1>
<p style="text-align: center;">據官方文件表示,2024年開始需要申請帳號才能拿到有效的api key啟動這個套件,因此作業就不特別申請帳號來啟動功能。因為只有14天免費試用QQ</p>

<form action="" method="post">
  <textarea name="" id="content" cols="30" rows="10"></textarea>

  <input type="submit" value="發佈文章">
</form>

CSS

form {
  text-align: right;
}

form input[type="submit"] {
  display: inline-block;
  margin-top: 10px;
  padding: 5px 10px;
  box-sizing: border-box;
  border: none;
  background-color: rgba(39, 90, 54, 1);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  transition: 0.5s;
}

form input[type="submit"]:hover {
  background-color: rgb(82, 184, 113);
}

JavaScript

tinymce.init({
  selector: "#content"
});