表格滑动和图片链接,mdnice安排上了!
有一个传说中的微信群,叫做 mdnice 用户群,里面会有很多神奇的用户讨论 markdown 排版相关的各种需求
表格不支持滑动
前两天得到一个反馈信息,表示表格不支持滑动,据说在 typora 里面很好看
mdnice 不支持就算了,居然还比其他软件排版的丑,这个就不能接受了,于是更新了一版支持滑动的表格,并且增加了表格默认列宽度,保证不会出现表格文字很挤的情况,下面举一些例子。
表格长度适宜
文本:
| 姓名 | 年龄 | 工作 |
| :--------- | :--: | -----------: |
| 小可爱 | 18 | 吃可爱多 |
| 小小勇敢 | 20 | 爬棵勇敢树 |
| 小小小机智 | 22 | 看一本机智书 |
渲染效果:
姓名 |
年龄 |
工作 |
---|---|---|
小可爱 |
18 |
吃可爱多 |
小小勇敢 |
20 |
爬棵勇敢树 |
小小小机智 |
22 |
看一本机智书,人傻就要多看书,笨鸟先飞嘛 |
表格列数过多
文本:
| 姓名 | 年龄 | 工作 | 邮箱 | 手机 |
| :--------- | :--: | -----------: | :-------------: | :---------: |
| 小可爱 | 18 | 吃可爱多 | lovely@test.com | 18812345678 |
| 小小勇敢 | 20 | 爬棵勇敢树 | brave@test.com | 17712345678 |
| 小小小机智 | 22 | 看一本机智书 | smart@test.com | 16612345678 |
渲染效果:
姓名 |
年龄 |
工作 |
邮箱 |
手机 |
---|---|---|---|---|
小可爱 |
18 |
吃可爱多 |
lovely@test.com |
18812345678 |
小小勇敢 |
20 |
爬棵勇敢树 |
brave@test.com |
17712345678 |
小小小机智 |
22 |
看一本机智书 |
smart@test.com |
16612345678 |
宽度过长的表格可以滚动,可在自定义主题中调节默认宽度
图片链接怎么做
很早之前,还有一位资深用户反馈,图片链接是怎么做到的,markdown 是不是没有办法处理呀?
放心吧,没有 markdown 处理不了的排版效果!mdnice 推出了卡片链接语法,之后欢迎大家使用!
语法本身并不复杂,图片语法和链接语法嵌套使用即可,就能够实现推荐卡片的效果,用法如下:
文本:
[![Markdown Nice 最全功能介绍](https://imgkr.cn-bj.ufileos.com/5a820626-482d-4c2c-94aa-6f77c4ff9e21.gif)](https://mp.weixin.qq.com/s/lM808MxUu6tp8zU8SBu3sg)
简单来说这个嵌套是这样写出来的:
图片文本:![Markdown Nice 最全功能介绍](https://imgkr.cn-bj.ufileos.com/5a820626-482d-4c2c-94aa-6f77c4ff9e21.gif)
链接文本:[](https://mp.weixin.qq.com/s/lM808MxUu6tp8zU8SBu3sg)
将图片文本放到链接文本的[]
位置即可,相当于[![文本](图片链接)](超链接)
渲染效果:
Markdown Nice 最全功能介绍
这部分内容自然也是支持自定义的,可以定义出各种各样有意思的版式
- END -
- 数据库表设计对性能的影响
- V部落博客管理平台开源啦! Vue+SpringBoot强强联合!
- SpringBoot+SpringSecurity处理Ajax登录请求
- MongoDB副本集配置
- MongoDB副本集搭建
- vhr部门管理数据库设计与编程
- SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题(六)
- 权限管理模块中动态加载Vue组件
- axios请求封装和异常统一处理
- SpringSecurity中密码加盐与SpringBoot中异常统一处理
- SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题(二)
- SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题(一)
- Java操作MongoDB
- 初识MongoDB分片
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 编程世界/前端技术/BootStrap/BootStrap插件组件使用总结
- Vim编辑器基础入门
- GitLab安装与基础使用
- apt命令使用一览表
- Hexo博客框架初识入门到进阶.md
- dubbo SPI 主要配置技术解读
- 三维城市建模之开发视角,10万场景资源+用户样例
- 3分钟短文:Laravel应用跟用户打交道,就从拿到他们的数据开始!
- leetcode之字符串压缩
- Android如何获取屏幕、状态栏及标题栏的高度详解
- Android中FloatingActionButton的显示与隐藏示例
- Android 中RecyclerView顶部刷新实现详解
- Android开发实现图片平移、缩放、倒影及旋转功能的方法
- Grafana + InfluxDB 实现 Jmeter 压测的图形化监控
- Android 浮动编辑框的具体实现代码