Question

我会对我的IPython / IHaskell / Jupyter笔记本的外观进行一些简单的修改，例如

rendered_html :link {
    text-decoration: none;
}

但我无法弄清楚如何做到这一点。我已经尝试了许多我通过搜索找到的解决方案，例如将CSS放入

~/.ipython/profile_default/static/css/custom.css

但没有任何影响，我怀疑，鉴于最近对Notebook架构的更改，实现此目的的方法已经改变，我发现的指令已经过时了。

如何为我的IPython / IHaskell / Jupyter Notebook设置自定义CSS？

OS X 10.10.4; Xcode 6.4; CLT：6.4.0.0.1; Clang：6.1; Python Python 2.7.10（Homebrew）; IHaskell 0.6.4.1，IPython 3.0.0（4.0.0和Jupiter 4.0的答案也很受欢迎，因为我很快就会升级）。

Answer 1

Starting Jupyter / IPython 4.1, the custom folder location has changed to ~/.jupyter/custom/. So place your custom.css and custom.js like this:

~/.jupyter/custom/custom.css
~/.jupyter/custom/custom.js

Works for me that way. Credits goes to Liang2

Edit:

If you are missing ~/.jupyter folder, you can use jupyter notebook --generate-config command to generate the folder.

Answer 2

要将自定义CSS添加到特定笔记本，您可以使用HTML。添加并执行具有以下内容的常规Python代码单元：

from IPython.core.display import HTML
HTML("""
<style>
// add your CSS styling here
</style>
""")

或者（感谢@abalter）使用%%html单元格魔法：

%%html
<style>
// add your CSS styling here
</style>

Answer 3

我认为custom.css的路径应为：

~/.ipython/profile_default/static/custom/custom.css

custom文件夹而不是css文件夹。

Answer 4

根据建议的文档，我首先从Anaconda Navigator中下载了Anaconda3 - Jupyter 5.0 Notebook是几个预建选项之一。我在这个位置找到了我的CSS文件。

C:\Users\YourUsername\Anaconda3\Lib\site-packages\notebook\static\cutom\custom.css

Answer 5

这就是我所做的。

从http://jupyter.readthedocs.io/en/latest/projects/jupyter-directories.html我发现您可以通过设置 JUPYTER_CONFIG_DIR env var来更改配置目录，然后运行jupyter，如：

JUPYTER_CONFIG_DIR=./jupyter/ jupyter notebook

我当前目录中的jupyter dir具有以下结构：

jupyter/
- custom/
  - custom.css
  - custom.js

Answer 6

我使用Tensorflow Docker镜像在Google Cloud Platform上运行Jupyter，它位于/usr/local/lib/python2.7/dist-packages/notebook/static/custom/。在任何情况下，您都可以通过搜索找到它。

Answer 7

根据Jupyter文档，DATE_FROM应该放在DATE_TO文件夹中。

通过在Jupyter笔记本单元中运行，您将找到默认配置文件的位置：

database.getFilePath().replace("\\", "/");

哪个给了我

custom.css

然后，在default_profile/static/custom文件夹中创建目录结构，例如：

import jupyter_core
jupyter_core.paths.jupyter_config_dir()

您看到所需的结构是'/home/sergey/.jupyter'

这在Ubuntu 18.04和最新的Jupyter（2018年10月）中为我工作

Answer 8

我在这里找到了一个很好的解决方案： https://martinapugliese.github.io/jupyter-customise/

我需要添加这个：

<style>..</style>

from IPython.core.display import HTML

def _set_css_style(css_file_path):
   """
   Read the custom CSS file and load it into Jupyter.
   Pass the file path to the CSS file.
   """

   styles = open(css_file_path, "r").read()
   s = '<style>%s</style>' % styles     
   return HTML(s)

Answer 9

对于基本conda环境，我在这里找到它：〜/ Programs / Anaconda3 / lib / python3.6 / site-packages / notebook / static / custom

对于自定义conda环境，我在这里找到了它：〜/ Programs / Anaconda3 / envs / [环境名称] /lib/python3.6/site-packages/notebook/static/custom

在Ubuntu 18.04，conda 4.6.8下工作。

Answer 10

如果您是通过PIP而不是Anaconda安装的，则它将位于此文件夹中
C:\Users\<user-name>\AppData\Local\Programs\Python\Python37\Lib\site-packages\notebook\static\custom
在这里，您可以找到custom.css文件并进行编辑以反映更改。您还将在那里也有custom.js文件。

Answer 11

对于Windows

C:\Users\<username>\.jupyter\custom\custom.css

以上内容将覆盖默认位置：site-packages https://github.com/jupyter/jupyter/issues/295

Answer 12

由于声誉原因无法添加评论，所以我将作为答案发布。

当我生成配置文件时，/custom/custom.css 停止为我工作，但如果有人也遇到此问题，解决方案是取消注释 c.NotebookApp.extra_static_paths = [] 文件中的行 jupyter_notebook_config.py 并在括号内添加“./custom/” - 或您为自定义 css 选择的任何路径。

P.S.：操作系统为 Linux Manjaro 5.12，Jupyter Notebook 版本为 6.3.0。

Answer 13

Ubuntu 18.04

文件夹 ~/venv/lib/python3.8/site-packages/notebook/static/custom

venv 是虚拟环境名称，因此该位置相对于您环境的位置。

这里有一个占位符文件“custom.css”。用你自己的 css 覆盖它。

任何安装了 Conda 的机器

C:\Users******.conda\envs\py37\lib\site-packages\notebook\static\custom

使用相对于 .conda 的路径。我的环境名称是py37

将您的自定义 css 放在此处的 custom.css 文件中。

重新加载 jupyter 笔记本。

如何为我的IPython / IHaskell / Jupyter Notebook设置自定义CSS？

13 个答案: