迷雾论坛

    • 注册
    • 登录
    • 搜索
    • 版块
    • 最新
    • 标签
    • 热门

    论坛编写教程

    公告
    论坛公告 语法教程
    1
    1
    260
    正在加载更多帖子
    • 从旧到新
    • 从新到旧
    • 最多赞同
    回复
    • 在新帖中回复
    登录后回复
    此主题已被删除。只有拥有主题管理权限的用户可以查看。
    • musicraft
      musicraft 最后由 musicraft 编辑

      前言

      虽然论坛现在主要是使用markdown语法来进行编写,但是一个是没有一个站内的语法教程,二个是因为自己对论坛的一个更新和维护,现在可以做到很多原本的markdown语法(之后简称md语法)做不到的功能。需要有一个具体的说明,所以我自己开设此贴来进行一个简要的教学。

      编写页面详解

      请注意,以下的内容全都是基于电脑端的操作,移动端的操作请自行探索。不过应该是大差不差的。
      论坛的编写页面如下图
      pVwODRe.png
      这个是论坛的编辑页面,集成了可视化,鼠标操作等。

      按钮功能详解

      pV0CFPI.png

      这个按钮可拖拽,用来调整编写框和页面的占用比例

      pV0CkGt.png

      这个按钮按下以后会出现一个下拉菜单,用来调整发表到那个板块

      接下来就进入具体的功能按钮了,不过这里要注意,因为md语法本身是一种标记语言,所以接下来的很多语法之间都是可以进行叠加的,就比如本文的大标题居中和图片居中就是两种语法叠加之后产生的效果。

      以及多用空格,回车和空行,如果发现实际的效果和想象的不一样,可以看看是不是没有进行回车和空行

      pV0CARP.png

      用来对字体进行加粗,转换成md语法就是

      **这里是要进行加粗的文字**
      

      具体效果如下:
      这里是没有加粗的文字,这里是加粗过的文字

      pV0CJMT.png

      用于对字体进行倾斜,转换成md语法就是

      *这里是要进行倾斜的文字*
      

      具体效果如下
      这里是没有倾斜的文字,这里是倾斜过的文字

      pV0Cdo9.png

      用于创建无序列表,转换成md语法就是

      * 这里是列表1
      * 这里是列表2
      * 这里是列表3
      

      具体效果如下:

      • 列表1
      • 列表2
      • 列表3

      pV0CyQK.png

      用于给文字中间添加一行删除线,转换成md语法就是

      ~~这里是要添加删除线的文字~~
      

      具体效果如下:
      这里是没有添加删除线的文字,这里是添加了删除线的文字

      pV0C4JI.png

      用于添加代码块,添加代码块的作用一个是增加可读性和对文章的正文部分进行区分,第二个是用于避开因为md语法而对代码呈现的影响,转换成md语法就是(前面的反斜杠是转义符号,无实际意义)

      \```
      \这里就是要添加代码的区域
      \```
      

      具体效果如下:

      这里就是要添加代码的区域
      

      QQ20250815-125610.png

      用于添加外部链接,转换成md语法就是

      [链接展现出的文字](链接的具体地址)
      

      具体效果如下

      论坛编写教程
      这里要注意两点:

      1. 如果想要分享论坛本身的文档链接,可以使用论坛本身的分享功能,点击每个帖子末尾的三竖点图标,之后点击“copy permalink”即可
      2. 如果是进行手打链接语法,需要注意全半角符号的区别。

      QQ20250815-130244.png

      用于添加外部图片地址,转换成md语法就是

      ![替代文字](图片地址)
      

      具体效果因为本文到处都在使用,所以不再额外展示了。

      QQ20250815-130443.png

      用于添加mermaid图表工具语法,属于高级功能,具体呈现效果可以去查看站内的这个帖子,具体教程可以点击这里查看。

      QQ20250815-130957.png

      用于开启无干扰模式,不做过多解释,感兴趣的可以自己点击体验效果。

      QQ20250815-131052.png

      用于给文字添加上颜色,点击以后会出现一个颜色选择框,用于进行颜色选择。
      QQ20250815-131128.png

      转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持添加颜色的操作)

      %(这里填写颜色的代码)[这里是要添加颜色的文字]
      

      具体效果如下:
      这里是没有添加上颜色的文字,这里是添加上了颜色的文字

      不过因为这里并没有颜色保存的功能,所以为了方便,这里提供一个颜色查询网站,方便进行浏览和查找。

      b3ec1a60-62f1-4f2b-a7d6-871f94c0ade7-image.png

      这里是对文字进行对齐操作,转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持)

      |-需要进行左对齐的文字
      |-需要进行中心对其的文字-|
      需要进行右对齐的文字-|
      |=需要进行两端对齐的文字=|
      

      具体效果如下:

      需要进行左对齐的文字

      需要进行中心对其的文字

      需要进行右对齐的文字

      需要进行两端对齐的文字

      b0584170-f6e5-4f2a-b726-6bc4c4788263-image.png

      用于添加文字大标题,转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持)

      #(这里是大标题的具体文字)
      

      具体效果如下:

      这里是大标题的具体文字

      9a04df1d-1cab-4d88-956d-6f89bc1838e5-image.png

      用于添加成组的代码文字,转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持,以及前面的反斜杠是转义符号,无实际意义)

      \===group
      \```这里是第一种语言
      \这里是具体的代码
      \```
      \```这里是第二种语言
      \这里是具体的代码
      \```
      \```这里是第三种语言
      \这里是具体的代码
      \```
      \===
      

      具体效果如下:

      • Language-这里是第一种语言
      • Language-这里是第二种语言
      • Language-这里是第三种语言
      这里是具体的代码
      
      这里是具体的代码
      
      这里是具体的代码
      <

      d6925617-de3e-44bb-a8e8-7bbfb1d7dad0-image.png

      用于添加注意泡,转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持)

      °fa-info°(这里添加鼠标悬停文字)
      

      具体效果如下:

      f4be7e38-fa85-4a7b-97c3-03953b42f0f5-image.png

      用于添加防剧透按钮,用来隐藏一些剧透相关文字或者不想要直接让读者看到的文字,转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持)

      ||这里添加不想直接让读者看到的文字||
      

      具体效果如下:

      这里添加不想直接让读者看到的文字

      ba0d87d2-b65c-409d-9968-afcc6f4be944-image.png

      用于添加emoji,转换成md语法就是 (这里属于论坛本身独有的功能,md语法本身不支持)

      :nerd_face: 
      

      具体效果如下:

      🤓

      b68424a2-e78a-4716-9da3-ef9b1be049b8-image.png

      和之前的添加图片链接按钮功能相似,只不过添加了一步从本机直接上传的步骤(当然,如果电脑剪切板里有图片,可以直接复制过来),不做过多说明了。

      26bdb917-19c8-4654-be06-bea6435b3f6c-image.png

      用于上传文件到论坛中,不做过多介绍。

      markdown语法教学

      以下内容参考官方的markdown语法教程

      标题语法

      Markdown 支持两种标题语法:Setext 和 Atx 形式。

      Atx 形式(推荐)

      使用 # 号来表示标题,# 的数量对应标题的级别:

      # 一级标题 (H1)
      ## 二级标题 (H2)
      ### 三级标题 (H3)
      #### 四级标题 (H4)
      ##### 五级标题 (H5)
      ###### 六级标题 (H6)
      

      效果展示:

      一级标题

      二级标题

      三级标题

      四级标题

      五级标题
      六级标题

      Setext 形式

      只支持一级和二级标题:

      一级标题
      ========
      
      二级标题
      --------
      

      注意事项:

      • # 号和标题文字之间需要有空格
      • 建议在标题前后都加上空行,增加可读性

      文本格式

      基础文本样式

      **粗体文本** 或 __粗体文本__
      *斜体文本* 或 _斜体文本_
      ***粗斜体文本*** 或 ___粗斜体文本___
      ~~删除线文本~~
      

      效果展示:

      • 粗体文本
      • 斜体文本
      • 粗斜体文本
      • 删除线文本

      段落和换行

      • 段落:使用空行分隔段落
      • 换行:在行末添加两个空格,然后回车
      这是第一段文字。
      
      这是第二段文字。
      
      这是同一段的第一行。  
      这是同一段的第二行。
      

      转义字符

      使用反斜杠 \ 来转义特殊字符:

      \*这不是斜体\*
      \# 这不是标题
      [这不是链接]
      

      列表

      无序列表

      使用 -、* 或 + 作为列表标记:

      - 项目一
      - 项目二
      - 项目三
        - 子项目一
        - 子项目二
      

      效果展示:

      • 项目一
      • 项目二
      • 项目三
        • 子项目一
        • 子项目二

      有序列表

      使用数字加点号:

      1. 第一项
      2. 第二项
      3. 第三项
         1. 子项目一
         2. 子项目二
      

      效果展示:

      1. 第一项
      2. 第二项
      3. 第三项
        1. 子项目一
        2. 子项目二

      任务列表

      - [x] 已完成任务
      - [ ] 未完成任务
      - [ ] 另一个未完成任务
      

      效果展示:

      • 已完成任务
      • 未完成任务
      • 另一个未完成任务

      链接和图片

      链接语法

      内联链接

      [链接文字](URL "可选标题")
      

      效果展示:
      迷雾论坛

      引用链接

      [链接文字][标识]
      
      [标识]: URL "可选标题"
      
      [Google][1]
      [百度][2]
      
      [1]: https://www.google.com "谷歌"
      [2]: https://www.baidu.com "百度"
      

      自动链接

      <https: www.example.com="">
      <email@example.com>
      

      图片语法

      ![替代文字](图片URL "可选标题")
      ![示例图片](https://via.placeholder.com/300x200 "这是一张示例图片")
      

      引用式图片

      ![替代文字][图片标识]
      
      [图片标识]: 图片URL "可选标题"
      

      代码

      行内代码

      使用反引号包裹:

      这是 `行内代码` 的示例。
      

      效果展示:
      这是 行内代码 的示例。

      代码块

      缩进式代码块

      使用4个空格或1个制表符缩进:

          function hello() {
              console.log("Hello, World!");
          }
      

      围栏式代码块

      使用三个反引号:

      ```javascript
      function hello() {
          console.log("Hello, World!");
      }
      ```
      

      支持语法高亮:

      function calculateSum(a, b) {
          return a + b;
      }
      
      const result = calculateSum(5, 3);
      console.log(result); // 输出: 8
      
      def calculate_sum(a, b):
          return a + b
      
      result = calculate_sum(5, 3)
      print(result)  # 输出: 8
      

      表格

      基础表格

      | 标题1 | 标题2 | 标题3 |
      |-------|-------|-------|
      | 内容1 | 内容2 | 内容3 |
      | 内容4 | 内容5 | 内容6 |
      

      效果展示:

      标题1 标题2 标题3
      内容1 内容2 内容3
      内容4 内容5 内容6

      对齐方式

      | 左对齐 | 居中对齐 | 右对齐 |
      |:-------|:--------:|-------:|
      | 左     |    中    |     右 |
      | 内容   |   内容   |   内容 |
      

      效果展示:

      左对齐 居中对齐 右对齐
      左 中 右
      内容 内容 内容

      引用

      基础引用

      > 这是一个引用。
      >
      > 这是引用的第二段。
      

      效果展示:

      这是一个引用。

      这是引用的第二段。

      嵌套引用

      >这是第一级引用。
      >
      > >这是第二级引用。
      > >
      >>>这是第三级引用。
      

      效果展示:

      这是第一级引用。

      这是第二级引用。

      这是第三级引用。


      分割线

      使用三个或更多的连字符、星号或下划线:

      ---
      ***
      ___
      

      效果展示:


      其他

      本文并没有概括全部的内容,比如说论坛本身的转为问题,脚标、任务列表,一些md高级语法,比如说html语法等等,感兴趣的可以自己去搜索相关内容进行了解。

      1 条回复 最后回复 回复 引用 0
      • 锁定自  musicraft musicraft 
      • First post
        Last post