Markdown編輯器說明

夢幻之心星發表於2020-06-04
標題: Markdown編輯器說明
作者: 夢幻之心星    347369787@QQ.com 
標籤: [Markdown, 編輯器]
目錄: [軟體]
日期: 2020-6-4

前提說明

  • 在使用Markdown進行文字編輯後釋出在部落格或者公眾號時，有時需要對樣式進行自定義。
  • 目前的編輯器主要提供了三種方式：線上編輯後複製，離線編輯後複製，一鍵樣式轉換。
  • 嘗試了幾個編輯器，各有優勢。

編輯器說明

Md2All

  • 線上編輯後複製
  • 提供主題選擇；樣式自定義；程式碼主題選擇；程式碼行數顯示
  • 自定義的CSS樣式所用的標籤與網頁一致，會影響編輯介面樣式

Markdown Nice

  • 線上編輯後複製；一鍵樣式轉換
  • 提供主題選擇；樣式自定義；程式碼主題選擇；部分程式碼主題提供程式碼行數顯示
  • 自定義的CSS樣式所用的標籤通過#nice字首修飾，不會影響編輯介面樣式
  • 所使用的.prefix和.suffix標籤在其他編輯器的自定義樣式中無法使用

Markdown Here

  • 一鍵樣式轉換
  • 提供CSS樣式自定義；程式碼主題選擇；程式碼語法高亮CSS樣式自定義，不支援行數顯示
  • 自定義的CSS樣式所用的標籤與網頁一致
  • 不支援before和after修飾
  • 不支援畫圖

Typora

  • 離線編輯後複製
  • 提供主題選擇；樣式自定義；程式碼行數顯示
  • 自定義的CSS樣式所用的標籤與網頁一致，會影響編輯介面樣式
  • 支援畫圖：流程圖；時序圖；甘特圖

Yu Writer

  • 離線編輯後複製
  • 付費後提供主題選擇；不支援樣式自定義；不提供程式碼行數顯示

MarkEditor

  • 離線編輯後複製
  • 提供CSS樣式自定義；不支援行數顯示
  • 自定義的CSS樣式所用的標籤與網頁一致
  • 不支援before和after修飾
  • 支援畫圖：柱狀圖；線圖；餅圖；標準流程圖

Joplin

  • 離線編輯後複製
  • 提供CSS樣式自定義，但實際不可用；不支援行數顯示
  • 支援畫圖：流程圖；時序圖；甘特圖
  • 提供WebDAV同步

MarkdownPad 2

  • 離線編輯後複製
  • 提供CSS樣式自定義；提供格式標記顯示；不支援行數顯示
  • 自定義的CSS樣式所用的標籤與網頁一致
  • 不支援畫圖

VS Code

  • 離線編輯後複製
  • 提供CSS樣式自定義；提供語法檢查；可通過外掛擴充套件功能
  • 自定義的CSS樣式所用的標籤與網頁一致，但是樣式內容是放在一個less檔案中，並經過處理，因此不會影響介面樣式

注意事項

  • 需要注意的是，通過before和after標籤所產生的修飾效果是無法複製的，這部分修飾會在複製時丟失。只能通過一鍵樣式轉換或者把這部分修飾的實現程式碼移植到所修飾的本體中來實現修飾效果。

  • before和after在CSS樣式表中是通過偽類和偽元素來實現的，不支援這兩種標籤的編輯器也可能不支援偽類和偽元素。

  • 通過複製編輯器渲染後所產生的富文字再進行貼上的方式，在貼上時存在樣式丟失，在釋出平臺進行儲存時也存在樣式丟失。

​

相關文章