首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Jekyll \ kramdown -将`.table`类添加到生成的表

Jekyll是一个静态网站生成器,它使用Ruby编程语言开发。它允许开发人员使用简单的文本文件(如Markdown)来创建内容,并将其转换为静态HTML网站。

kramdown是Jekyll默认的Markdown解析器,它支持扩展语法和更多的功能。

.table类添加到生成的表可以通过在Markdown文件中使用HTML标签来实现。具体步骤如下:

  1. 在Markdown文件中创建一个表格,可以使用Markdown语法或HTML标签来定义表格的结构和内容。
  2. 在表格的<table>标签上添加class属性,并将其值设置为.table,即<table class=".table">
  3. 保存并构建Jekyll网站,生成的HTML文件将包含带有.table类的表格。

添加.table类的优势是可以使用CSS样式来自定义表格的外观和样式。例如,可以使用.table类来设置表格的边框样式、背景颜色、字体样式等。

以下是一个示例表格的Markdown代码:

代码语言:txt
复制
| 列1标题 | 列2标题 |
| ------- | ------- |
| 单元格1 | 单元格2 |
| 单元格3 | 单元格4 |

.table类添加到生成的表格的HTML代码如下:

代码语言:txt
复制
<table class=".table">
  <thead>
    <tr>
      <th>列1标题</th>
      <th>列2标题</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>单元格1</td>
      <td>单元格2</td>
    </tr>
    <tr>
      <td>单元格3</td>
      <td>单元格4</td>
    </tr>
  </tbody>
</table>

推荐的腾讯云相关产品和产品介绍链接地址:

  • 腾讯云服务器(CVM):提供可扩展的云服务器实例,适用于各种应用场景。详情请参考:腾讯云服务器
  • 腾讯云对象存储(COS):提供安全、稳定、低成本的云端存储服务,适用于存储和管理各种类型的数据。详情请参考:腾讯云对象存储
  • 腾讯云CDN加速:提供全球分布式加速服务,加速内容分发,提升用户访问体验。详情请参考:腾讯云CDN加速

请注意,以上推荐的腾讯云产品仅供参考,具体选择应根据实际需求进行评估和决策。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

这里有你想要的 Rouge 主题

其中,markdown 字段的值表示使用哪一款插件来将 Markdown 文本转换为 HTML 页面结构。 GitHub 推荐使用的 Jekyll 的 Markdown 插件为 kramdown。...在 Jekyll 的配置文件中这样配置它们: markdown: kramdown kramdown: input: GFM syntax_highlighter: rouge 其中,input...Rouge 支持的语言可以前往此处查看:Rouge 生成 Rouge 语法高亮样式 当然,以上配置只是告诉 kramdown 转换引擎在转换 Markdown 为 HTML 的时候,使用 rouge 格式的样式...我们需要另外使用 rougify 工具生成对应的样式文件才行。 你需要先配好 Ruby 环境。如果没有配好,推荐阅读 快速在 Windows 上搭建 Jekyll 开发环境 快速配置。...我将默认文字颜色从白色 #ffffff 改成了 #bbbbbb,然后将 diff 的颜色也修改成 monokai 的样式。 ?

1.8K30
  • 为 Markdown 生成 TOC 的 Vim 插件

    因为饱受 GFM 和 Redcarpet 两种 Markdown 引擎生成 TOC 链接的差异的折磨,而我又不得不同时使用它们——博客基于 Jekyll 使用 Redcarpet(Update 2016.../09/16: GitHub Pages 现在已经改为只支持 kramdown),而其它放在 GitHub 仓库里的文档使用 GFM,我决定为我常用的 Markdown 编辑器 Vim 做一款同时支持...使用方法 生成 Table of Contents 将光标移动到想在后面插入 Table of Contents 的那一行,然后运行下面的某个命令: :GenTocGFM 生成 GFM 链接风格的 Table...适用于使用 Redcarpet 作为 Markdown 引擎的 Jekyll 项目或其它地方。...: 这里提供一个选项改变这个行为,如果设置: 那标记将根据级别循环使用 *、- 和 +: 这不会影响 Markdown 文档解析后的显示效果,只用于提升源文件的可读性。

    45810

    为 Markdown 生成 TOC 的 Vim 插件

    因为饱受 GFM 和 Redcarpet 两种 Markdown 引擎生成 TOC 链接的差异的折磨,而我又不得不同时使用它们——博客基于 Jekyll 使用 Redcarpet(Update 2016.../09/16: GitHub Pages 现在已经改为只支持 kramdown),而其它放在 GitHub 仓库里的文档使用 GFM,我决定为我常用的 Markdown 编辑器 Vim 做一款同时支持...使用方法 生成 Table of Contents 将光标移动到想在后面插入 Table of Contents 的那一行,然后运行下面的某个命令: :GenTocGFM 生成 GFM 链接风格的...适用于使用 Redcarpet 作为 Markdown 引擎的 Jekyll 项目或其它地方。...如果你不想看到它们,可以在 vimrc 文件里加入如下内容移除: let g:vmt_dont_insert_fence = 1 需要注意的是移除之后插件将无法再帮你保存文件时自动更新 Table

    1.1K10

    基于Jekyll与Github Pages搭建博客

    而 Jekyll 是一个生成静态网页的工具,在 Github 上绑定自己的域名后可以当作个人博客访问。 那么接下来就开始用这两个工具搭建一个属于我们自己的博客吧。 1....而我作为一个强迫症,已经将自己 Github 的库克隆在 Windows 的本地文件里,不想再改位置,于是我硬着头皮一边查资料,一边尝试将 Jekyll 安装在 Window 系统上。...为了看到博客呈现出来的效果,就要用上我们上一步安装的 Jekyll,先打开命令行,将路径修改至博客模板所在路径,执行命令 jekyll server,复制 http://127.0.0.1:4000/..._config.yml里相关的参数如下: markdown: kramdown highlighter: rouge kramdown: input: GFM 根据上面的教程,我们已经配置好 Ruby...在本地博客文件的根目录里打开命令行,使用命令rougify style github > css/syntax.css生成一个 github 风格的样式到css/syntax.css文件中。

    1.2K10

    手动将 OpenWithProgids 键和值添加到 Windows 注册表所需执行的步骤

    这将打开注册表编辑器。 3、导航到HKEY_CLASSES_ROOT键。 4、查找表示要与特定程序关联的文件类型的键。例如,如果要将文件类型“.txt”与程序相关联,则需要查找“.txt”键。...使用要与程序关联的文件扩展名命名密钥。 6、找到或创建密钥后,右键单击它并选择“新建”和“密钥”。将新密钥命名为“OpenWithProgids”。...7、选择您刚刚创建的 OpenWithProgids 键,然后右键单击窗口右侧并选择“新建”和“字符串值”。将新值命名为要与文件类型关联的程序的名称。...8、双击刚刚创建的值,在“值数据”字段中输入程序可执行文件的名称(例如记事本.exe),然后单击“确定”。 9、关闭注册表编辑器,您指定的文件类型现在将与您指定的程序相关联。...请注意,如果您不熟悉注册表,修改注册表可能会很危险,如果操作不正确,可能会导致严重的系统问题。还建议在进行任何更改之前备份注册表。

    16110

    我的GitPage博客也挂了,紧急修复之路

    , unicode-display_width, terminal-table, jekyll after 33 seconds 26 gems installed >查看安装的Jekyll版本 `...接下来就是我们的**重点**内容了,虽然默认模版也不难看,但终究不是我们的博客。在这里我的目标是将个人博客进行本地编译运行。...build),接下来看以看到文件下的 _site 内容的生成。...编译到指定地方 14 jekyll build --watch 编译后好自动监听文件变化 自动编译 15 bundle exec jekyll build 您只需构建您的站点(而不是在本地提供),然后您可以将生成的文件上传到您的服务器...(这将生成与_config.yml中配置变量url的值的规范链接) 16 jekyll clean 清空编译_site 17 jekyll serve 本地启动服务 18 jekyll serve -

    1K00

    如何优雅的将数据库表逆向生成代码

    Hibernate消除了代码的映射规则,开发人员可以将数据库表当对象使用,确实很方便,但是它最大的一个问题是在表关联和复杂的SQL查询支持较差。...基于这样的原因我总结了三种方式通过数据库表逆向生成代码,让使用 Mabitas的小伙伴的开发效率提高一个台阶。...逆向生成代码 在需要生成表右键->EasyCode->Generate Code就可以生成代码。 ? 根据自己的需要选择生成的代码: ?...-- tableName是数据库中的表名或视图名, domainObjectName是实体类名,要生成多个表的时候,添加多个 table标签即可--> table tableName=...(true); strategy.setRestControllerStyle(true); strategy.setSuperControllerClass("你自己的父类控制器

    1.9K10

    如何快速给自己构建一个温馨的家——用Jekyll搭建静态博客

    关于jekyll其他一些命令的用法如下: $ jekyll build # => 当前文件夹中的内容将会生成到 ./_site 文件夹中。...$ jekyll build --watch # => 当前文件夹中的内容将会生成到 ./_site 文件夹中, # 查看改变,并且自动再生成。...把整个文件都push到github上去 git add --all #添加到暂存区 git commit -m "提交jekyll默认页面"...highlighter: rouge markdown: kramdown复制代码 等待大概1-2分钟之后,再次刷新username.github.io,就能看到我们的blog了。...添加两条记录,@和www的主机记录,记录类型为CNAME类型,CNAME表示别名记录,该记录可以将多个名字映射到同一台计算机。 记录值请写username.github.io.

    1.3K20

    Jekyll 优化合集

    前言   Jekyll 是一款采用 Ruby 语言编写的、非常方便简单又功能强大的静态站点生成器,适合于搭建个人博客、静态网站等。...我们知道,Github Page 默认支持的也是 Jekyll,而非 Hexo、Hugo等静态站点生成器。...学术首页   所谓的学术首页功能其实就是将原来的首页移到 blog 子目录下,首页用一个自定义的页面来替代。由于 H2O 主题本身很适合转换成一个页面模板,要实现这一功能比较方便。...通常来说,英文单词的阅读速度在 350 词/分钟 左右,而中文的阅读速度也差不多,所以可以将字数除以 350 即可得到大概所需的阅读时长。...最后将以下代码添加到 _layouts/post.html 相应的位置即可,一般来说在写作时间下面较佳。

    2.1K30

    如何快速给自己构建一个温馨的"家"——用Jekyll搭建静态博客

    关于jekyll其他一些命令的用法如下: $ jekyll build # => 当前文件夹中的内容将会生成到 ./_site 文件夹中。...$ jekyll build --watch # => 当前文件夹中的内容将会生成到 ./_site 文件夹中, # 查看改变,并且自动再生成。...把整个文件都push到github上去 git add --all #添加到暂存区 git commit -m "提交jekyll默认页面"...highlighter: rouge markdown: kramdown 等待大概1-2分钟之后,再次刷新username.github.io,就能看到我们的blog了。...添加两条记录,@和www的主机记录,记录类型为CNAME类型,CNAME表示别名记录,该记录可以将多个名字映射到同一台计算机。 记录值请写username.github.io.

    30310

    Jekyll 渲染 LaTeX 数学公式

    preface 最近又在看深度学习相关的内容,并且讲学习笔记呈现在了博客上,课程中有很多的公式,之前都是靠着截图的,但是这样就太繁琐了,想着如果能够直接敲公式的话效率就会高点了,就去看了一下 LaTeX...的语法,好像挺简单的,就稍微学习了一下,想发布到博客上发现渲染不出来 solution 博客是用 MarkDown 编写的,而 MarkDown 本身并不支持公式,但是我使用的 Typora 编辑器可以扩展...LaTeX 的公式,只要勾选 文件 -> 偏好设置 -> MarkDown -> 内联公式 ,然后再重启 Typora 就可以编辑行内的 LaTeX 公式了 下面是在 Typora 上编辑公式展示的效果...这在 Typora 里面是没有任何问题的,可以正常显示,但是 push 到基于 Jekyll 模板的 GitHub page 上就出现了不能渲染公式的问题,网上搜了一下,Jekyll 模板确实不支持...: kramdown ,再打开 _includes 文件夹中的 head.html ,将下面这段脚本粘贴进去,提交修改,就可以正常渲染 LaTeX 公式了 <script type="text/x-mathjax-config

    1.3K20

    Github搭建个人博客(2019最新版,亲测)

    (五) 将博客修改成自己的博客 (1)先说个概念,现在的github个人搭建博客方式有两种, 一种是: GitHub Pages + Hexo 的方式 另外一种是: GitHub Pages...+ jekyll 的方式 我采用的搭建博客的方式是第二种: 使用GitHub Pages +jekyll的方式。...我们现在用Git工具将整个项目Git clone下来,可以看一下现在的目录结构: 这里进行一下各个文件(夹)的用途 _config.yml :全局配置文件 posts :放文章的文件夹 其他的文件夹是各页面的...kramdown: input: GFM syntax_highlighter: rouge # port # port: 1234 # url category_dir: category...的6为每页显示6篇文章,port:4001 是jekyll启动端口号, # statistic analysis 统计代码 # 百度统计 id,将统计代码替换为自己的百度统计id,即 # hm.src

    68020

    【已解决】如果将MySQL数据库中的表生成PDM

    | 分类:经验分享 有时候,我们需要MySQL数据库中的表生成对应的...PDM文件,这里凯哥就讲讲第一种将MySQL数据库的表生成对应的PDM文件。...环境准备: MySQL数据库连接客户端(可以使用sqlyong或者是navicat等这类客户都工具类) PowerDesigner。这里凯哥使用的是PowerDesigner来生成PDM的。...注:本文是以PowerDesigner为案例来讲解的。如果您使用的是其他的工具,请自行查询。 操作步骤: ①:打开MySQL客户端,连接到需要生成PDM的数据库,并将表导出成sql文件的。...④:选择在第二步骤中我们导出的sql文件 ⑤:点击确当,就可以生成对应的PDM文件了。生成后的如下图: 说明: 自动生成的,不会添加表之间的关系。

    45600
    领券