Markdown发布静态网页

news2024/11/16 13:42:50

解析markdown_利用 markdown 生成页面实践_灰色派的博客-CSDN博客

业务需求

1.为什么要用 markdown 来生成页面?
对于展示型网站,例如官网这种场景,会有很多小的页面,运营会根据市场时刻有增删修改类似页面的需求,如果每次都响应运营的需求,不断地迭代增删页面,这个工作是很难终结的,运营不能及时看到页面,而开发会深陷在重复繁杂的工作中。

对于某些项目的详情页面,排版固定,可以提前制定样式,运营人员只需关注内容,而 markdown 的出现的目的就是让用户只关注内容而非排版。

市面上供用户使用,能生成 html 的编辑器多为富文本编辑器,富文本编辑器优点是样式可以自由定制,但在我们的官网场景中,样式的不可控反而成了其缺点,我们不可能让官网的展示凭用户喜好随意改动。

把页面的控制权交给运营,解放其他人员,是这个方案最大的出发点。

2.实现思路

运营人员后台通过 markdown 编辑器输出内容,通过预览或者保存后,在前台编译成 html,而 html 相关样式则是提前定制好的。

3.工具

markdown 编辑器的实现市面上有很多,经与产品确认,我们选择了一个比较小而精美的库 promarkdown

开发人员也可以使用pycharm

————————————————
基础知识

标题(需空格)

# 一级标题
## 二级标题
### 三级标题
依次类推


2.目录(单独一行)

[TOC]


3.字体(不要空格)

** **:加粗
* *:斜体
*** ***:斜体加粗
~~ ~~:删除线


4.引用

>


5.分割线(需空格)

--- 和 ***


6.图片

![图片名字](图片路径)


7.超链接

[链接名称](链接路径)
//例如:[百度链接](www.baidu.com)


8.列表(需空格)

有序列表:1. 
无序列表:*或-


9.代码

```
代码
```

10.表格

 

项目     | Value
-------- | -----
电脑  | $1600
手机  | $12
导管  | $1

11.KaTeX数学公式

 

Gamma公式展示 $\Gamma(n) = (n-1)!\quad\forall
n\in\mathbb N$ 是通过欧拉积分

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

12.新的甘特图功能,丰富你的文章

13.FLowchart流程图

我们依旧会支持flowchart的流程图:

 

 

```mermaid
flowchat
st=>start: 开始
e=>end: 结束
op=>operation: 我的操作
cond=>condition: 确认?

st->op->cond
cond(yes)->e
cond(no)->op
```

还有其他可以考虑,比如

UML 图表

可以使用UML图表进行渲染。

参考;如何搭建自己的系统化知识平台—Markdown_markdown网站搭建_Officetouch数据科学的博客-CSDN博客

主流 Markdown 编辑器推荐 - 知乎 (zhihu.com)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/420061.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

MapReduce笔记

总计:切片就是对一个文件按逻辑进行切片,默认每128m为一个切片,不是物理切片,每个切片对应着一个mapTask进行处理。而且切片是针对每一个文件进行切片的,即一个文件一个文件切片,不是把所以待处理的文件总量…

游戏运营是什么?运营专员需要具备什么能力?

游戏运营主要是负责公司游戏的运营计划制定,包含通过用户对游戏的反馈和数据分析找出产品所存在的问题,并进行优化。通过各种促销活动、节假日实行游戏付费内容来刺激消费,实现游戏和品牌双赢的打造过程。 游戏运营分很多种:用户…

python获取数据类型

之前将字面量时就将到过 数据是有类型的 python的数据类型还挺多的 而现阶段 我们主要接触了 字符串 浮点数 正整数 对应的类型 都有自己的名称 字符串 string 浮点数 float 正整数 int python提供了一个type语句 用于验证数据类型 我们打开编辑工具 编写代码如下 print(typ…

每日一问-ChapGPT-20230416-中医基础-经络

文章目录每日一问-ChapGPT系列起因每日一问-ChapGPT-20230416-中医基础-经络人体的经络有哪些,有什么规律,怎么记忆问诊的具体细节当日总结每日一问-ChapGPT系列起因 近来看了新闻,看了各种媒体,抖音,官媒&#xff0c…

FPGA与ASIC的区别

先来看张图,本图体现出了集成电路产业链:设计业、制造业、封测业。 关于制造、封装测试我们看两张图稍作了解即可: 数字IC ASIC设计流程及EDA工具: (1)了解数字IC设计:在VLSI时代&#xff…

MySQL数据库之表的增删改查(基础)

目录1 新增(Create)1.1 单行数据 全列插入1.2 多行数据 全列插入2 查询(Retrieve)2.1 全列查询2.2 指定列查询2.3 查询字段为表达式2.4 别名2.5 去重: DISTINCT2.6 排序: ORDER BY2.7 条件查询: WHERE2.8 分页查询: LIMIT3 修改…

基于html+css的图片展示10

准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…

10个有趣python模块

一、说明 Python 是一种高级、解释型和通用动态编程语言,侧重于代码的可读性。它在许多组织中使用,因为它支持多种编程范例。它还执行自动内存管理。它是世界上最受欢迎的编程语言之一。这是有很多原因的: 这很容易学习。 它超级多才多艺。 …

腾讯云轻量应用服务器性能如何?测评来了

腾讯云轻量应用服务器性能如何?CPU型号主频、内存、公网带宽和系统盘存储多维对比,轻量应用服务器会不会比云服务器CVM性能差?相对于CVM云服务器轻量服务器更适合轻量级的应用,轻量服务适合中小企或个人开发者用于搭建We网站b应用…

svn 安装 和配置idea

SVN客户端安装 一、SVN客户端安装 1、下载安装包地址:svn下载地址 此安装包是英文版的,还可以下载一个语言包,在同界面的下方 这里可以下载 一个汉化的 语言包(在下载界面向下翻即可) 下载完成之后,就会…

JavaSE异常

文章目录JavaSE异常一、异常的概念二、异常的体系结构三、异常的分类四、异常的处理五、自定义异常类JavaSE异常 一、异常的概念 在Java中,将程序执行过程中发生的不正常行为称为异常 常见逻辑异常: 算数异常 System.out.println(10 / 0); // 执行结…

关于分布式唯一ID的思考-雪花算法及美团Leaf方案详解

引言 首先&#xff0c;我们看一下日常开发中常见的雪花算法工具类&#xff1a; 引入hutool <dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId><version>5.7.20</version> </dependency>工具类…

推荐10个AI学习、工作用的有趣网站

来源&#xff1a;towardsai 作者&#xff1a;学姐 编辑&#xff1a;学姐 1.VERSE BY VERSE 帮你写诗 https://sites.research.google/versebyverse/ 2.Let’s Enhance 照片放大增强 https://letsenhance.io/ 让扭曲和模糊的照片变得漂亮&#xff0c;用这个网站实现增强&am…

A01-固件库开发模板

&#x1f9d1;‍&#x1f393; 个人主页&#xff1a;Silence Lamb &#x1f4d6; 本章内容&#xff1a;【固件库开发模板】 Silence-STM v1.0.0 基于固件库开发模板 一、前提准备 &#x1f680;从ST官网获取stm32f103标准例程固件库&#x1f680; 参考文档 1.1&#x1f333;…

[HAOI2011]Problem b(莫比乌斯反演)

[HAOI2011]Problem b 题目链接&#xff1a;https://www.luogu.com.cn/problem/P2522 题目描述 对于给出的 nnn 个询问&#xff0c;每次求有多少个数对 (x,y)(x,y)(x,y)&#xff0c;满足 a≤x≤ba \le x \le ba≤x≤b&#xff0c;c≤y≤dc \le y \le dc≤y≤d&#xff0c;且 …

【CE】Mac下的CE教程Tutorial:进阶篇(第7关:代码注入)

▒ 目录 ▒&#x1f6eb; 导读开发环境1️⃣ 第7关&#xff1a;代码注入翻译非代码注入完成任务代码注入完成任务&#x1f6ec; 文章小结&#x1f4d6; 参考资料&#x1f6eb; 导读 开发环境 版本号描述文章日期2023-03-操作系统MacOS Big Sur 11.5Cheat Engine7.4.3 1️⃣ 第…

PADS生成SMT坐标文件

做SMT时&#xff0c;除了“gerber文件”外&#xff0c;还要提供 “BOM文件” 和 “坐标文件”。 “gerber文件” 和 “BOM文件”&#xff0c;前面都有介绍过了&#xff0c;现在详细说一下生成“坐标文件”的方法。 贴片厂家提供了操作教程&#xff0c;如下&#xff1a; 所以&a…

Leetcode力扣秋招刷题路-0289

从0开始的秋招刷题路&#xff0c;记录下所刷每道题的题解&#xff0c;帮助自己回顾总结 289. 生命游戏 根据 百度百科 &#xff0c; 生命游戏 &#xff0c;简称为 生命 &#xff0c;是英国数学家约翰何顿康威在 1970 年发明的细胞自动机。 给定一个包含 m n 个格子的面板&a…

应届生,实力已超6年,太卷了!

你好&#xff0c;我是田哥今晚上&#xff0c;给一位朋友做模拟面试&#xff0c;原本说好的90分钟左右&#xff0c;结果整了2个多小时。很多人估计也很好奇&#xff0c;我们这两个多小时聊聊什么&#xff0c;下面我给大致总结一下&#xff1a;面试技巧面试中&#xff0c;我们回答…

企业招采系统实现方案(SRM系统)

企事业数字化转型专家&#xff0c;提供各类应用解决方案。您身边的赋能小助手&#xff01; 文章目录前言一、当下采购的痛点二、解决方案-供应商管理1.供应商管理三、解决方案-企业询价、供应商报价管理四、解决方案-采购订单五、送货、到货、订单管理总结前言 随着各类产业链…