如何在summernote中使用<pre>在代码块后插入段落

问题描述

我想在使用带有 ext-highlight 的代码块后插入

标签

下面是我的代码

<!DOCTYPE html>
<html>
  <head>
    <Meta charset="utf-8">

    <!-- default css -->
    <link href="{% static 'css/reset.css' %}" rel="stylesheet">
    <link href="{% static 'css/layout.css' %}" rel="stylesheet">
    <!-- use Prism -->
    <link href="{% static 'css/prism.css' %}" rel="stylesheet">

    <!-- bootstrap cdn -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvcwpIPm49" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnjsK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

    <!-- fontawsome -->
    <link href="{% static 'fontawesome/css/all.css' %}" rel="stylesheet" type="text/css">

    <!-- summernote -->
    <link href="{% static 'summernote-0.8.18-dist/summernote-bs4.css' %}" rel="stylesheet">
    <script src="{% static 'summernote-0.8.18-dist/summernote-bs4.min.js' %}"></script>
  </head>
  <body>
    <textarea id="id_content></textarea>
    <script>
    $(document).ready(function() {
      $('#id_content').summernote({
        toolbar: [
          ['style',['style','add-text-tags']],['font',['bold','underline','clear']],['color',['color']],['para',['ul','ol','paragraph']],['table',['table']],['insert',['highlight','link','picture','video']],],width: '100%',height: '380px',lang: 'ko-KR',prettifyHtml: false,placeholder: '질문을 입력하세요.',dialogsInBody: true,tabdisable: true,});
    });
    </script>
    <script src="{% static 'js/summernote-ext-highlight.js' %}"></script>
  </body>

现在插入代码

<p></p> + <pre></pre>

但是我想要

<p></p> + <pre></pre> + <p></p>

现在我的页面是这样的

enter image description here

但我想要这样

enter image description here

如何制作我想要的功能

我不知道我问的问题是否正确,因为我的英语说得不好。

请理解这一点。

解决方法

我不明白这个问题,但我看到一个可能导致各种问题的错误:

<textarea id="id_content></textarea>

这缺少双引号。更正为:

<textarea id="id_content"></textarea>