简体   繁体   English

Jupyter Notebook 中用于编辑代码和 Markdown 单元格的不同字体设置

[英]Different font settings for editing code and markdown cells in the Jupyter Notebook

In the Jupyter notebook, I would like to use the regular Ubuntu font when editing markdown cells and UbuntuMono for code cells.在 Jupyter notebook 中,我想在编辑Markdown 单元格时使用常规的 Ubuntu 字体,而在编辑代码单元格时使用 UbuntuMono。 I can change the fonts of both these cell types simultaneously by editing .jupyter/custom/custom.css like so:我可以.jupyter/custom/custom.css像这样编辑.jupyter/custom/custom.css同时更改这两种单元格类型的字体:

.CodeMirror pre {
    font-family: "Ubuntu Mono", monospace;
    font-size: 14pt;
}

I can also change the formatting of the headers in the markdown code cells:我还可以更改 Markdown 代码单元格中标题的格式:

.cm-header {
    font-size: 110%;
    font-family: "Ubuntu";
}

As well as how the text looks when rendered (after executing a markdown cell):以及呈现时文本的外观(在执行降价单元后):

div.text_cell_render {
    font-family: "Ubuntu";
    font-size: 12pt;
}

However, I don't understand which css classes I could use to discriminate between code cells and paragragh/body text in markdown cells in edit mode.但是,我不明白我可以使用哪些 css 类来区分编辑模式下 Markdown 单元格中的代码单元格和段落/正文文本。 I tried the object inspector in Firefox, but the input text for both cell types show up with the same span tags and css classes.我在 Firefox 中尝试了对象检查器,但两种单元格类型的输入文本显示为相同的跨度标签和 css 类。 I have tried many of the combinations listed here , but it seems like I just can't find the right one, any ideas?我已经尝试了这里列出的许多组合,但似乎我找不到合适的组合,有什么想法吗?

I received a reply from the Jupyter Notebook issue linked in the comments of my questions here.我收到了来自 Jupyter Notebook 问题的回复,链接在我的问题评论中。 It is possible to combine CSS selector, so the following solves my problem:可以组合 CSS 选择器,因此以下解决了我的问题:

.text_cell .CodeMirror pre {
    font-family: "Ubuntu";
    font-size: 12pt;
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM