如何改变gitbook的代码填充的效果呢?(How to change the code paddi

2019-10-21 18:29发布

这是计算器的降价效果的代码:

Code from stackoverflow
Nearly no extra space at the beginning

这是gitbook的降价效果的代码:

在开头的额外的空白是混淆了我。 所以,我决定自己去改变它。

我所做的:

cd /usr/local/lib/node_modules/gitbook/theme/stylesheets/base
vim markdown.less

其中有一个代码块,它看起来像:

code {
    padding: 0;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    margin: 0;
    font-size: 85%;
    background-color: #f7f7f7;
    border-radius: 3px;
}

我改变了font-size ,以385%border-radius ,以0px 。 我用git serve . 重新启动我的gitbook服务器,但该代码的效果并没有改变。

我得到了这些文件,这HAVS code在主题目录中的关键字,这是我应该修改?

.//assets/app.js
.//assets/fonts/fontawesome/fontawesome-webfont.svg
.//assets/fonts/fontawesome/fontawesome-webfont.ttf
.//assets/fonts/fontawesome/FontAwesome.otf
.//assets/print.css
.//assets/style.css
.//javascript/utils/sharing.js
.//stylesheets/base/markdown.less
.//stylesheets/base/normalize.less
.//stylesheets/website/highlight/night.less
.//stylesheets/website/highlight/white.less
.//stylesheets/website/markdown.less
.//templates/book/includes/exercise.html
.//templates/ebook/includes/exercise.html

还有什么应该怎么办?

Answer 1:

这应该是一个评论,但你可以不甘示弱的意见。

正如你可以看到下面,你给不包括要更改样式的样式信息,你从什么地方遗漏了一些重要信息。
你已经包含的代码显示在左侧,你所描述的问题是正确的。

 code { padding: 0; padding-top: 0.2em; padding-bottom: 0.2em; margin: 0; font-size: 85%; background-color: #f7f7f7; border-radius: 3px; } .described { padding: 20px; } 
 <code>fprintf(...);</code> <code class="described">fprintf(...);</code> 



Answer 2:

为忽略的Gitbook默认样式,创建一个名为您的gitbook项目的根“风格/ website.css`文件。

编辑book.json文件,并添加下面以定义你自己的自定义样式源

{
    "styles": {
        "website": "styles/website.css",
        "ebook": "styles/ebook.css",
        "pdf": "styles/pdf.css",
        "mobi": "styles/mobi.css",
        "epub": "styles/epub.css"
    }
}

任何在这个文件将过乘坐Gitbook样式(如果你的名字右)。

然后找出你想申请或更改样式使用浏览器检查的HTML元素的名称。 在浏览器中打开Gitbook项目,右键单击一个代码块,这带来了检查或检查元素的菜单。

您将需要重新启动gitbook serve多变的款式时,因为它只能读取styles/website.css上启动文件。

我要定义的样式过度骑Gitbook们可以在这个Github的要点可以看出

https://gist.github.com/jr0cket/9cc41eb9dd0b6c6d091831be43fa3e42

这些都可以风格的结果可以看出在:

https://practicalli.github.io/clojure/basic-clojure/

谢谢



文章来源: How to change the code padding effect of gitbook?
标签: css gitbook