markdown 轉 Html （小技巧）

2021-09-22 10:20:04 字數 1357 閱讀 1629

整篇部落格使用 cdn 的方式引用以下檔案

npm i marked -s


>


>


charset


="utf-8"


/>


>


marked in the browsertitle


>


head


>


>


"content"


>


div>


src=


"">


script


>


>


document.


getelementbyid


('content'


).innerhtml =


marked


('# marked的簡單用法 **marked**.');


script


>


body


>


html


>
其實在 node 中也是可以使用 marked這個包的，但今天我非常惱火，就是下面我要介紹的乙個包highlight，它的官方文件說可以支援 node，結果今天我花了一整天的時間去看它，發現什麼效果，(這裡說的是 node 的使用)，在瀏覽器上直接使用時沒有問題的。

它的官網：

npm i highlight.js -s
charset


="utf-8"


src=""


>


script


>


//新增


>


hljs.


inithighlightingonload()


;script


>


//呼叫
npm


install highlightjs-line-numbers.js
src=


"path/to/highlight.min.js"


>


script


>


src=


"path/to/highlightjs-line-numbers.min.js"


>


script


>


hljs.inithighlightingonload();


hljs.initlinenumbersonload();
我使用的是 typora ：

這個編譯器很方便，只需要將你寫好 md 檔案寫好，並且匯出的檔案，就可以匯出你在編譯器中看見的樣式，這是非常方便的

MarkDown 原始碼轉 HTML 顯示

一般我們是將 markdown 原始碼存入資料庫，這樣取出資料後利於再次編輯 獲取 markdown 原始碼後，轉換成 html 要使用的函式 方法editormd.markdowntohtml id,options id 用於顯示 html 的容器 id 字串 options 配置選項 markd...

HTML利用posotion屬性定位 小技巧

1.居中效果 父級div index top 屬性設定為 text align center 子級div tabindex main 屬性設定為 margin 0 auto 2.左右對齊效果 父級div tabindex main 屬性設定為 position relative 子級div city...

CSDN新手使用Markdown寫部落格技巧

建立乙個自定義列表 如何建立乙個註腳 注釋也是必不可少的 katex數學公式 新的甘特圖功能，豐富你的文章 uml 圖表 flowchart流程圖 匯出與匯入 你好！這是你第一次使用markdown編輯器所展示的歡迎頁。如果你想學習如何使用markdown編輯器,可以仔細閱讀這篇文章，了解一下mar...