内容介绍
最近在使用csdn的markdown编辑器写东西时发现了一些有趣的东西,下面简单列举一下,希望对看到的小伙伴有所帮助(本文目的为演示编辑效果,目录显示较乱)。
一、基础编辑
1、目录
各级标题完整目录显示的位置。
@[TOC](目录显示位置)
2、标题
1-6级,一级一个"#“,六级六个”#"。
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题
一级标题
二级标题
三级标题
四级标题
五级标题
六级标题
3、快捷键
说明 | 组合键 |
---|---|
撤销 | Ctrl/Command + Z |
重做 | Ctrl/Command + Y |
加粗 | Ctrl/Command + B |
斜体 | Ctrl/Command + I |
标题 | Ctrl/Command + Shift + H |
无序列表 | Ctrl/Command + Shift + U |
有序列表 | Ctrl/Command + Shift + O |
检查列表 | Ctrl/Command + Shift + C |
插入代码 | Ctrl/Command + Shift + K |
插入链接 | Ctrl/Command + Shift + L |
插入图片 | Ctrl/Command + Shift + G |
4、文本样式
*敲掉文本* _强调文本_
**加粗文本** __加粗文本__
==标记文本==
~~删除文本~~
H~2~O is是液体
2^10^ 运算结果是 1024
> 引用文本
敲掉文本 强调文本
加粗文本 加粗文本
标记文本
删除文本
H2O is是液体。
210 运算结果是 1024。
引用文本
5、列表
5.1 无序列表
- 项目
- 项目
- 项目
- 项目
5.2 有序列表
- 项目1
- 项目2
- 项目3
5.3 待办事项TodoList
- 计划任务
- 完成任务
6、链接
[链接包含描述文本和地址链接两部分](https://www.csdn.net/)
7、图片
7.1 图片
![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg)
7.2 带尺寸的图片
![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg =100x100)
7.3 居中的图片
![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg#pic_center)
7.4居中且带尺寸的图片
![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg#pic_center =100x100)
8、分割线
使用星号"*“、减号”-“或下划线”_",连续三个或三个以上
***
_____
-----
9、段落
9.1 缩进
  缩进文本
缩进文本
9.2 换行和段落
一次Enter为换行,两次Enter为段落
10、代码片高亮显示
```后可设置语言,如html,css,javascript等
```code```
function handle(){ // todo... }
11、表格
11.1 markdown表格
冒号":"表示对齐方式
项目 | Value
-------- | -----
电脑 | $1600
手机 | $12
导管 | $1
| Column 1 | Column 2 |
|:--------| -------------:|
| centered 文本居中 | right-aligned 文本居右 |
项目 | Value |
---|---|
电脑 | $1600 |
手机 | $12 |
导管 | $1 |
Column 1 | Column 2 |
---|---|
centered 文本居中 | right-aligned 文本居右 |
11.2 html表格
<table id="htmltable">
<tr>
<td width=20% rowspan=3>单元格-合并-指定宽度</td><td bgcolor="#FF9797">单元格-背景色</td><td><font face="华文楷体">单元格-华文楷体</font></td>
</tr>
<tr>
<td><font color=blue size=5>单元格-字体颜色-5号字</font></td><td align="left"><font>单元格-文本左对齐</font></td></tr>
<tr>
<td><font face="华文彩云" size=5>单元格 - 华文彩云 - 5号字</font></td><td>单元格第一行<br>单元格第二行<br>单元格第三行</td>
</tr>
</table>
单元格-合并-指定宽度 单元格-背景色 单元格-华文楷体 单元格-字体颜色-5号字 单元格-文本左对齐 单元格 - 华文彩云 - 5号字 单元格第一行
单元格第二行
单元格第三行
12、注脚
**注脚1**:^[这是注脚1]
**注脚2**:[^2]
[^2]:这是注脚2
13、注释
> [^_^]: <> (注释内容1——符号左右加空格)
> [//]: # (注释内容2——符号左右加空格)
> <!-- 我是注释内容3 -->
14、自定义列表
markdown
: this is a markdown
authors
: author is 人间小美味695
markdown
- this is a markdown
authors
- author is 人间小美味695
二、小技巧
1、空格:
 
2、换行:
<br>
3、锚点跳转:
目标元素添加id属性,点击链接使用"#"加对应的id值。
[测试锚点——跳转至10.2html表格](#htmltable)
4、设置文本样式:
<font color="#FF8C0" size=3 face="华文楷体">文本内容使用font标签包裹,可通过face设置字体,size设置字号,color设置颜色</font>
文本内容使用font标签包裹,可通过face设置字体,size设置字号,color设置颜色
5、特殊符号使用实体编号代替:
X Y Z [ \ ] ^ _ ` a b c
X Y Z [ \ ] ^ _ ` a b c
ASCII字符集——参考文档:https://www.runoob.com/tags/html-ascii.html
6、添加表情符号:
代码 | 说明 | 显示效果 |
---|---|---|
>:( | 生气 | 😠 |
:") | 脸红 | 😊 |
</3 | 心碎 | 💔 |
:/ | 困惑 | 😕 |
:,( | 哭 | 😢 |
:( | 皱眉 | 😦 |
<3 | 心 | ❤️ |
]:( | 小鬼 | 👿 |
o:) | 无辜 | 😇 |
:,) | 哭笑 | 😂 |
x-) | 大笑 | 😆 |
:| | 面无表情 | 😐 |
:o | 安静 | 😮 |
:@ | 愤怒 | 😡 |
:) | 微笑 | 😃 |
]:) | 微笑 | 😈 |
;( | 呜咽 | 😭 |
:P | 吐舌鬼脸 | 😛 |
8-) | 太阳镜 | 😎 |
,:( | 流汗 | 😓 |
,:) | 流汗 | 😅 |
:s | 不爽 | 😒 |
;) | 飞媚眼 | 😉 |
6.1、People
代码 | 显示效果 | 代码 | 显示效果 |
---|---|---|---|
:smile: | 😄 | :laughing: | 😆 |
:blush: | 😊 | :smiley: | 😃 |
:thought_balloon: | 💭 | :smirk: | 😏 |
:heart_eyes: | 😍 | :kissing_heart: | 😘 |
:kissing_closed_eyes: | 😚 | :flushed: | 😳 |
:relieved: | 😌 | :satisfied: | 😆 |
:grin: | 😁 | :wink: | 😉 |
:stuck_out_tongue_winking_eye: | 😜 | :stuck_out_tongue_closed_eyes: | 😝 |
:grinning: | 😀 | :kissing: | 😗 |
:kissing_smiling_eyes: | 😙 | :stuck_out_tongue: | 😛 |
:sleeping: | 😴 | :worried: | 😟 |
:frowning: | 😦 | :anguished: | 😧 |
:open_mouth: | 😮 | :grimacing: | 😬 |
:confused: | 😕 | :hushed: | 😯 |
:expressionless: | 😑 | :unamused: | 😒 |
:sweat_smile: | 😅 | :sweat: | 😓 |
:disappointed_relieved: | 😥 | :weary: | 😩 |
:pensive: | 😔 | :disappointed: | 😞 |
:confounded: | 😖 | :fearful: | 😨 |
:cold_sweat: | 😰 | :persevere: | 😣 |
:cry: | 😢 | :sob: | 😭 |
:joy: | 😂 | :astonished: | 😲 |
:scream: | 😱 | :tired_face: | 😫 |
:angry: | 😠 | :rage: | 😡 |
:triumph: | 😤 | :sleepy: | 😪 |
:yum: | 😋 | :mask: | 😷 |
:sunglasses: | 😎 | :dizzy_face: | 😵 |
:imp: | 👿 | :smiling_imp: | 😈 |
:neutral_face: | 😐 | :no_mouth: | 😶 |
:innocent: | 😇 | :alien: | 👽 |
:yellow_heart: | 💛 | :blue_heart: | 💙 |
:purple_heart: | 💜 | :heart: | ❤️ |
:green_heart: | 💚 | :broken_heart: | 💔 |
:heartbeat: | 💓 | :heartpulse: | 💗 |
:two_hearts: | 💕 | :revolving_hearts: | 💞 |
:cupid: | 💘 | :sparkling_heart: | 💖 |
:sparkles: | ✨ | :star: | ⭐️ |
:star2: | 🌟 | :dizzy: | 💫 |
:boom: | 💥 | :collision: | 💥 |
:anger: | 💢 | :exclamation: | ❗️ |
:question: | ❓ | :grey_exclamation: | ❕ |
:grey_question: | ❔ | :zzz: | 💤 |
:dash: | 💨 | :sweat_drops: | 💦 |
:notes: | 🎶 | :musical_note: | 🎵 |
:fire: | 🔥 | :hankey: | 💩 |
:poop: | 💩 | :shit: | 💩 |
:+1: | 👍 | :thumbsup: | 👍 |
:-1: | 👎 | :thumbsdown: | 👎 |
:ok_hand: | 👌 | :punch: | 👊 |
:facepunch: | 👊 | :fist: | ✊ |
:v: | ✌️ | :wave: | 👋 |
:hand: | ✋ | :raised_hand: | ✋ |
:open_hands: | 👐 | :point_up: | ☝️ |
:point_down: | 👇 | :point_left: | 👈 |
:point_right: | 👉 | :raised_hands: | 🙌 |
:pray: | 🙏 | :point_up_2: | 👆 |
:clap: | 👏 | :muscle: | 💪 |
:metal: | 🤘 | :fu: | 🖕 |
:runner: | 🏃 | :running: | 🏃 |
:couple: | 👫 | :family: | 👪 |
:two_men_holding_hands: | 👬 | :two_women_holding_hands: | 👭 |
:dancer: | 💃 | :dancers: | 👯 |
:ok_woman: | 🙆 | :no_good: | 🙅 |
:information_desk_person: | 💁 | :raising_hand: | 🙋 |
:bride_with_veil: | 👰 | :person_with_pouting_face: | 🙎 |
:person_frowning: | 🙍 | :bow: | 🙇 |
:couple_with_heart: | 💑 | :massage: | 💆 |
:haircut: | 💇 | :nail_care: | 💅 |
:boy: | 👦 | :girl: | 👧 |
:woman: | 👩 | :man: | 👨 |
:baby: | 👶 | :older_woman: | 👵 |
:older_man: | 👴 | :person_with_blond_hair: | 👱 |
:man_with_gua_pi_mao: | 👲 | :man_with_turban: | 👳 |
:construction_worker: | 👷 | :cop: | 👮 |
:angel: | 👼 | :princess: | 👸 |
:smiley_cat: | 😺 | :smile_cat: | 😸 |
:heart_eyes_cat: | 😻 | :kissing_cat: | 😽 |
:smirk_cat: | 😼 | :scream_cat: | 🙀 |
:crying_cat_face: | 😿 | :joy_cat: | 😹 |
:pouting_cat: | 😾 | :japanese_ogre: | 👹 |
:japanese_goblin: | 👺 | :see_no_evil: | 🙈 |
:hear_no_evil: | 🙉 | :speak_no_evil: | 🙊 |
:guardsman: | 💂 | :skull: | 💀 |
:feet: | 🐾 | :lips: | 👄 |
:kiss: | 💋 | :droplet: | 💧 |
:ear: | 👂 | :eyes: | 👀 |
:nose: | 👃 | :tongue: | 👅 |
:love_letter: | 💌 | :bust_in_silhouette: | 👤 |
:busts_in_silhouette: | 👥 | :speech_balloon: | 💬 |
6.2、Nature(部分)
代码 | 显示效果 | 代码 | 显示效果 |
---|---|---|---|
:sunny: | ☀️ | :umbrella: | ☔️ |
:cloud: | ☁️ | :snowflake: | ❄️ |
:snowman: | ⛄️ | :zap: | ⚡️ |
:cyclone: | 🌀 | :foggy: | 🌁 |
:ocean: | 🌊 | :cat: | 🐱 |
:dog: | 🐶 | :mouse: | 🐭 |
:hamster: | 🐹 | :rabbit: | 🐰 |
:wolf: | 🐺 | :frog: | 🐸 |
:tiger: | 🐯 | :koala: | 🐨 |
:bear: | 🐻 | :pig: | 🐷 |
6.3、Objects(部分)
代码 | 显示效果 | 代码 | 显示效果 |
---|---|---|---|
:bamboo: | 🎍 | :gift_heart: | 💝 |
:dolls: | 🎎 | :school_satchel: | 🎒 |
:mortar_board: | 🎓 | :flags: | 🎏 |
:fireworks: | 🎆 | :sparkler: | 🎇 |
:wind_chime: | 🎐 | :rice_scene: | 🎑 |
:jack_o_lantern: | 🎃 | :ghost: | 👻 |
:santa: | 🎅 | :christmas_tree: | 🎄 |
:gift: | 🎁 | :bell: | 🔔 |
:no_bell: | 🔕 | :tanabata_tree: | 🎋 |
:tada: | 🎉 | :confetti_ball: | 🎊 |
:balloon: | 🎈 | :crystal_ball: | 🔮 |
:cd: | 💿 | :dvd: | 📀 |
6.4、Place(部分)
代码 | 显示效果 | 代码 | 显示效果 |
---|---|---|---|
:house: | 🏠 | :house_with_garden: | 🏡 |
:school: | 🏫 | :office: | 🏢 |
:post_office: | 🏣 | :hospital: | 🏥 |
:bank: | 🏦 | :convenience_store: | 🏪 |
:love_hotel: | 🏩 | :hotel: | 🏨 |
:wedding: | 💒 | :church: | ⛪️ |
:department_store: | 🏬 | :european_post_office: | 🏤 |
:city_sunrise: | 🌇 | :city_sunset: | 🌆 |
:japanese_castle: | 🏯 | :european_castle: | 🏰 |
:tent: | ⛺️ | :factory: | 🏭 |
:tokyo_tower: | 🗼 | :japan: | 🗾 |
:mount_fuji: | 🗻 | :sunrise_over_mountains: | 🌄 |
:sunrise: | 🌅 | :stars: | 🌠 |
:statue_of_liberty: | 🗽 | :bridge_at_night: | 🌉 |
:carousel_horse: | 🎠 | :rainbow: | 🌈 |
:ferris_wheel: | 🎡 | :fountain: | ⛲️ |
:roller_coaster: | 🎢 | :ship: | 🚢 |
6.5、Symbols(部分)
代码 | 显示效果 | 代码 | 显示效果 |
---|---|---|---|
:one: | 1️⃣ | :two: | 2️⃣ |
:three: | 3️⃣ | :four: | 4️⃣ |
:five: | 5️⃣ | :six: | 6️⃣ |
:seven: | 7️⃣ | :eight: | 8️⃣ |
:nine: | 9️⃣ | :keycap_ten: | 🔟 |
:1234: | 🔢 | :zero: | 0️⃣ |
:hash: | #️⃣ | :symbols: | 🔣 |
:arrow_backward: | ◀️ | :arrow_down: | ⬇️ |
:arrow_forward: | ▶️ | :arrow_left: | ⬅️ |
:capital_abcd: | 🔠 | :abcd: | 🔡 |
:abc: | 🔤 | :arrow_lower_left: | ↙️ |
:arrow_lower_right: | ↘️ | :arrow_right: | ➡️ |
:arrow_up: | ⬆️ | :arrow_upper_left: | ↖️ |
:arrow_upper_right: | ↗️ | :arrow_double_down: | ⏬ |
:arrow_double_up: | ⏫ | :arrow_down_small: | 🔽 |
:arrow_heading_down: | ⤵️ | :arrow_heading_up: | ⤴️ |
:leftwards_arrow_with_hook: | ↩️ | :arrow_right_hook: | ↪️ |
:left_right_arrow: | ↔️ | :arrow_up_down: | ↕️ |
:arrow_up_small: | 🔼 | :arrows_clockwise: | 🔃 |
:arrows_counterclockwise: | 🔄 | :rewind: | ⏪ |
:fast_forward: | ⏩ | :information_source: | ℹ️ |
:ok: | 🆗 | :twisted_rightwards_arrows: | 🔀 |
:repeat: | 🔁 | :repeat_one: | 🔂 |
:new: | 🆕 | :top: | 🔝 |
:up: | 🆙 | :cool: | 🆒 |
:free: | 🆓 | :ng: | 🆖 |
:cinema: | 🎦 | :koko: | 🈁 |
表情符号参考:https://www.webfx.com/tools/emoji-cheat-sheet/ |
注:
为方便区分代码和样式,所有样式均使用引用方式包裹,实际显示可复制代码自行试验。
流程图、甘特图等作者平时使用较少,暂不列入文中,需要的可查看帮助文档,也可留言或私聊沟通。
标签:csdn,markdown,编辑器,排版样式
更多演示案例,查看 案例演示
欢迎评论留言!