如何使用 summernote 和 bootstrap (HTML) 重新定位文本编辑器

问题描述

我正在尝试将一个 summernote 编辑器放入我的 html 页面。我正在使用此代码示例:

<html lang="en">
  <head>
    <Meta charset="UTF-8">
    <title>Summernote with Bootstrap 4</title>
    <link href="css/main.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5paxtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>

    <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script>
  </head>
  <body>
    <div id="summernote"></div>
  <script>
      $('#summernote').summernote({
        placeholder: 'Write your announcement here...',tabsize: 2,height: 100,width: 200

    });
  </script>
  </body>
</html>

现在,我只想移动它的位置。我曾尝试在脚本中执行此操作,并使用 .summernote 在 css 中调用它,但这不起作用。

这是我尝试这样做的方法

<script>
      $('#summernote').summernote({
        position:absolute,left:300,placeholder: 'Write your announcement here...',width: 200

    });
  </script>

这不起作用,只会使编辑器消失。我不知道我可能做错了什么。任何人都可以指出我正确的方向吗?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)