《fk标记语言文档》

fk标记语言示例:https://xueluo.cn/doc

fk说明

fk(方块的首字母简写)是一种可以使用普通文本编写的标记语言,通过简单的标记语法,使内容具有丰富的格式样式,主要用来编写文章、技术文档、产品手册……等等。

初衷

我的一些项目上线之前,需要编写大量的文档说明,这需要放在官网上供他人查阅,除了借助第三方平台写作之外,自己只能通过html静态页来做,内容少还好些,当类目众多的时候,编写起来十分不方便,这让我开始考虑要不要做一套文档写作系统,经过一段时间的思考,我还是认为文档的编写使用Markdown比较方便,内容直观,易于维护,但是,我不喜欢Markdown的编写方式,并且Markdown支持的样式有限,所以我不得不考虑搞一套纯属文档编写的标记语言。

目标

文档的格式以及所用的样式需要高度自由化,并且目录分类必须明确,使用简单,也就是说一个文档的形成最起码需要有一个目录树,或者说章节名称,例如看云平台创建目录需要依靠平台来做,首先你必须要使用鼠标操作,输入文字,一个一个来创建,如果目录也可以使用纯文本建立呢?那么大大的提高了文档编辑操作,并且也与正文的编辑方式统一了,所有的文件都是统一的fk文本文档,易于任何编辑器编写,包括手机。

过程

我在使用Markdown的过程中,有些使用方式比较繁琐,甚至混淆,例如斜体用到一个*,粗体用到两个*,粗斜体用到三个*,如果直接浏览源文本的话就容易混淆,为什么就不能分开?必须都使用星号*?还有最常用的#,H1用一个#,H2用两个#,如果是H6那么你就需要写六个#,先不说这很让人心烦,写这么多也累啊,还不直观,所以从格式上来看,至少我个人是认为不够完美的,影响美观,增加了字符,我的理想目标是整个文档就像是一个纯文本,尽量不要出现过多的符号。

不仅如此,在使用一些特别的样式时,需要使用HTML的标签才能支持,最后就会感觉这一切很混乱,更让我无法忍受的是添加图片时,一眼过去我已经对链接和图片混淆了,所以最终我编写了fk。

标识符说明

  • 为了说明文档,以下的语法演示中,CMD表示标识符
  • 标识符出现在正文的初始位置时,作用于整行
  • 标识符出现在局部标识符[ ]中初始位置时,作用于局部
  • 一般标识符后面紧跟一个空格,用于区分标识符和正文,而多个标识符之间用点.分割
  • 如果想要在正文中显示标识符,使用反斜杠来转义
  • 整行语法:CMD 正文,或 [CMD] 正文
  • 局部语法:[CMD 正文]
以下标识符列表说明中,带星号 * 的表示仅作用于整行,可以使用中括号[],也可以不使用。
标识符说明

[ ]

局部标识符,成对出现

<>

html代码,成对出现

` `

单行code代码展示,成对出现,语法为:`代码`

`` ``

多行code代码展示,成对出现,两个反引号或以上,语法为:``编程语言 代码``

( )

A链接跳转,成对出现

-

* 无序列表

*

* 有序列表

#

* H标题

#1

* H1标题

#2

* H2标题

#3

* H3标题

#4

* H4标题

#5

* H5标题

#6

* H6标题

@

邮箱

/

斜体

%

粗体

_

下划线

i

斜体(italic的小写首字母),同/

b

粗体(bold的小写首字母),同%

u

下划线(underline的小写首字母),同_

s

删除线(strikethrough的小写首字母)

R

红色(Red的大写首字母)

O

橙色(Orange的大写首字母)

Y

黄色(Yellow的大写首字母)

G

绿色(Green的大写首字母)

C

青色(Cyan的大写首字母)

B

蓝色(Blue的大写首字母)

P

紫色(Purple的大写首字母)

D

默认色(Default的大写首字母)

==

* hr水平线,两个等号或以上

>

* 引用

|

* 表格,多列使用|分割

--

* 表格中用于分割表头和正文,两个减号或以上

t

普通标题

ts

删除线类型标题

tu

下划线类型标题

tl

居左类型标题

tc

居中类型标题

tr

居右类型标题

sup

上标

sub

下标

img

图片展示

file

文件下载

icon

徽章图标 图标: graceful 图标graceful

left

* 文本左对齐

center

* 文本居中对齐

right

* 文本右对齐badge

#525D76

* 十六进制颜色,设置文本颜色

~20

* 文本大小

$

* 定义变量

.

使用变量

CONF配置项

conf中的$符前缀用于定义正文的属性样式,属性样式请参考CSS,例如:$font-size = 14px $color = #353535

配置项说明

wrap

渲染文本中的换行

$style

设置正文的样式

// conf的几种写法,看个人习惯

// 第一种:每行一条配置
[conf wrap = true]
[conf $font-size = 14px]

// 第二种:合并配置,用逗号隔开
[conf wrap = true, $font-size = 14px]

// 第三种:合并配置,换行隔开
[conf
  wrap=true
  font-size=14px
]

TABLE表格

对齐标识符为减号-,如果在左边为左对齐,如果在左右两边为居中对齐,如果在右边为右对齐,默认左对齐

表头的正文左侧如果为数字,则表示列宽,数字后面应紧跟一个空格或者-

表头的正文左侧颜色标识符,则可设置当前表格的前景色和背景色,背景色语法为:[#F08080],背景色与前景色用点.隔开,语法为:[#F08080.#FFFFFF]

姓名年龄

霍尘

29

沉秋

27

百里名兰

31

云千尤

22

冬梅

23

姓名年龄购买金额

霍尘

29

笔记本

3988

沉秋

27

手机

3988

百里名兰

31

电脑

3988

云千尤

22

平板

3988

冬梅

23

手机

3988

高级表格使用示例,支持多行文本

标题说明

支持情况

支持标题

表格内的内容支持所有标记符

fk标记语言支持任何浏览器,因为她最终会生成标准的HTML代码,比起Markdown,fk更加灵活多变,支持的样式更加丰富,为了使排版更加方便,fk不仅仅是单纯的标记语言,她正在向编程语言方向扩展,就像HTML中的JS脚本能力。

文字引用

浏览器支持

IE Firefox Chrome Safari Opera

所有浏览器都支持

fk标记语言支持任何浏览器,因为她最终会生成标准的HTML代码,比起Markdown,fk更加灵活多变,支持的样式更加丰富,为了使排版更加方便,fk不仅仅是单纯的标记语言,她正在向编程语言方向扩展,就像HTML中的JS脚本能力。

浏览器支持

IE Firefox Chrome Safari Opera

所有浏览器都支持

fk标记语言支持任何浏览器,因为她最终会生成标准的HTML代码,比起Markdown,fk更加灵活多变,支持的样式更加丰富,为了使排版更加方便,fk不仅仅是单纯的标记语言,她正在向编程语言方向扩展,就像HTML中的JS脚本能力。

  • 标记符使用table
  • 表头列使用|分割,如果第一行出现|,则为表头
  • 正文列之间使用两个横杠-或两个以上分割
  • 如果存在表头,例如表头的列数量为3,那么正文行数应为3的倍数,将依次按照九宫格的顺序依次渲染
[table
  180 标题 | 说明
  --
  浏览器支持
  --
  IE Firefox Chrome Safari Opera
  所有浏览器都支持
  fk标记语言支持任何浏览器,因为她最终会生成标准的HTML代码,比起Markdown,fk更加灵活多变,支持的样式更加丰富,为了使排版更加方便,fk不仅仅是单纯的标记语言,她正在向编程语言方向扩展,就像HTML中的JS脚本能力。
  --
  浏览器支持
  --
  IE Firefox Chrome Safari Opera
  所有浏览器都支持
  fk标记语言支持任何浏览器,因为她最终会生成标准的HTML代码,比起Markdown,fk更加灵活多变,支持的样式更加丰富,为了使排版更加方便,fk不仅仅是单纯的标记语言,她正在向编程语言方向扩展,就像HTML中的JS脚本能力。
]

自定义变量使用前缀$,使用变量使用前缀.

标题:晚霞的笼罩

内容:此时淡蓝的天中飘着几团淡火,粉红粉红的,如一个个温柔而含情脉脉的少女。

变量可以重复定义,定义的内容可以使用变量

title变量内容已改为:夕阳西下-晚霞的笼罩

变量还可以放在局部标识符中

非常美丽

字体:作用整行,每行的开头使用标识符

斜体

粗体

下划线

斜体

粗体

删除线

下划线

字体:作用局部,使用中括号,里面使用标识符

斜体:唯美青丝

粗体:唯美青丝

下划线:唯美青丝

斜体:唯美青丝

粗体:唯美青丝

删除线:唯美青丝

下划线:唯美青丝

自定义颜色:唯美青丝

我是自定义的颜色

红色

颜色

所有颜色标识符为大写字母,并为颜色单词的首字母,如下表示:

R:红色Red

O:橙色Orange

Y:黄色Yellow

G:绿色Green

C:青色Cyan

B:蓝色Blue

P:紫色Purple

引用

普通的引用

以下为添加颜色标识符的引用

红色的

橙色的

黄色的

绿色的

青色的

蓝色的

紫色的

标识符组合使用

标识符可以组合使用,用小点.分割,例如:

我加粗并为红色

我倾斜、加粗并为绿色

也可以局部使用啦

徽章图标

语法:[icon 标题|内容 颜色](链接),内容、颜色和链接都是选填

颜色说明

red

红色

orange

橙色

yellow

黄色

green

绿色

cyan

青色

blue

蓝色

purple

紫色

gray

灰色

black

黑色

default

默认色:红色,不填写为默认色

rgb(0,0,0)

RGB色值

默认 DK: graceful DKgraceful

版本 Version: 12.45 Version12.45

更新 Update: 1.0.2 Update1.0.2

gitee Gitee: iceui Giteeiceui

github Github: iceui Githubiceui

build Build: iceui Buildiceui

访问量 Views: 49.3K Views49.3K

时间 Time: 2017-08-14 Time2017-08-14

禁用 Disable: v46.01 Disablev46.01

issues Issues: 12.9K Issues12.9K

水平线

两个等号或以上为水平线


上标和下标

上标:X4,下标:O2

文字颜色

彩色文字: 红色 橙色 黄色 绿色 青色 蓝色 紫色

标签

普通标签: 唯美青丝 倾国倾城

彩色标签(淡色): 红色 橙色 黄色 绿色 青色 蓝色 紫色 默认

彩色标签(深色): 红色 橙色 黄色 绿色 青色 蓝色 紫色 默认

% 淡色与深色使用说明:

淡色:颜色标识符前面为L,Light的首字母

深色:颜色标识符前面为D,Dark的首字母

H标题

H标题

H标题

H标题

H标题

H标题
H标题
默认使用#即可,为H2,带下划线,如果不想使用下划线请使用#2,如果想要使#1到#6都有下划线的话,只需要后面添加一个减号“-”就行,例如:“#3-”;

样式标题

普通标题

删除线类型标题

下划线类型标题

居左类型标题

居中类型标题

居右类型标题

A链接

雪洛

带title的雪洛

可以点击的网址:https://xueluo.cn

可以点击的网址,带title:https://xueluo.cn

无序列表

无序列表使用减号 - 标识符,子级的减号 - 前面为两个空格,减号 - 后面可以为颜色标识符

+R 我是列表1

  • 进入百度
  • 我是列表3
    • 我是子列表1
    • 我是子列表2
    • 我是子列表3
      • 我是子列表1
      • 我是子列表2
  • 我是列表4

有序列表

有序列表使用星号 * 标识符,子级的星号 * 前面为两个空格,星号 * 后面可以为颜色标识符

  1. 我是列表1
  2. 我是列表2
  3. 我是列表3
    1. 我是子列表
    2. 我是子列表
    3. 我是子列表

图片

这是普通的图片:

这是带alt和title的图片:我是alt

这是带连接的图片:我是atr

文件下载

下载:logo.png

链接

这是普通的A连接:进入百度

这是带title的A链接:进入百度

水平线


代码展示-局部

使用一对反引号,例如class,data-name="Tali",var a = 1+1;

代码展示

  • 这种方式书写比较美观,建议使用,代码段的开头和结尾最少使用三个相连的反引号 “`”
  • 代码语言标识需要写在开头反引号的后面,注意:是最少三个相连的反引号后面哦
$a = 1;
if($a){
  echo 1;
}else{
  echo '2';
}

这种方式与md使用一样,也支持,但是与正文容易混淆,

//右下角弹出
function popup_p_rb(){
  iceui.popup({
    title:'这是标题',
    content:'这是标准弹窗',
    position:'rb'
  });
}

//导航菜单锚点平滑滚动
iceui.scrollAnchor('.menu',200);

//树形菜单
iceui.tree({div:'tree'});

//轮播图
iceui.slider({id:'slider-none'});
上一篇:清雨博客PHP开源系统
下一篇:微信小程序路径转换
评论留言
一共3条留言