如何在浏览器中增加Jupyter / ipython笔记本的单元格宽度？

Question

我想在浏览器中增加ipython笔记本的宽度。我有一个高分辨率的屏幕，我想扩大单元格的宽度/大小，以利用这个额外的空间。

谢谢！

---

编辑：5/2017

我现在使用jupyterthemes：https://github.com/dunovank/jupyter-themes

和这个命令：

jt -t oceans16 -f roboto -fs 12 -cellw 100%

使用漂亮的主题将宽度设置为100％。

Answer 1

如果您不想更改默认设置，并且只想更改正在处理的当前笔记本的宽度，则可以在单元格中输入以下内容：

from IPython.core.display import display, HTML
display(HTML("<style>.container { width:100% !important; }</style>"))

Answer 2

那个div.cell解决方案并没有真正起作用我的IPython，但幸运的是有人为新的IPythons提出了一个有效的解决方案：

创建包含内容的文件~/.ipython/profile_default/static/custom/custom.css（iPython）或~/.jupyter/custom/custom.css（Jupyter）

.container { width:100% !important; }

然后重启iPython / Jupyter笔记本。请注意，这将影响所有笔记本电脑。

Answer 3

为了使这与jupyter（版本4.0.6）一起使用，我创建了~/.jupyter/custom/custom.css，其中包含：

/* Make the notebook cells take almost all available width */
.container {
    width: 99% !important;
}   

/* Prevent the edit cell highlight box from getting clipped;
 * important so that it also works when cell is in edit mode*/
div.cell.selected {
    border-left-width: 1px !important;
}

Answer 4

是时候使用jupyterlab

了

最后，笔记本电脑急需升级。默认情况下，它使用窗口的整个宽度，就像任何其他完整的原生IDE一样。

您所要做的就是：

pip install jupyterlab
# if you use conda
conda install -c conda-forge jupyterlab
# to run 
jupyter lab    # instead of jupyter notebook

Here is a screenshot from blog.Jupyter.org

Answer 5

您可以通过从任何单元格调用样式表来设置笔记本的CSS。例如，请查看12 Steps to Navier Stokes course。

特别是，创建一个包含

的文件

<style>
    div.cell{
        width:100%;
        margin-left:1%;
        margin-right:auto;
    }
</style>

应该给你一个起点。但是，可能还需要调整例如div.text_cell_render以处理降价以及代码单元格。

如果该文件为custom.css，则添加包含以下内容的单元格：

from IPython.core.display import HTML
def css_styling():
    styles = open("custom.css", "r").read()
    return HTML(styles)
css_styling()

这将应用所有样式，特别是更改单元格宽度。

Answer 6

我在新安装后通常会修改存储所有视觉样式的主css文件。我使用Miniconda，但位置与其他C:\Miniconda3\Lib\site-packages\notebook\static\style\style.min.css

类似

对于某些屏幕，这些分辨率是不同的并且大于1.为了安全起见，我将所有内容更改为98％，因此如果我从笔记本电脑上的外部屏幕断开连接，我仍然有98％的屏幕宽度。 / em>的

然后只需用屏幕宽度的98％替换 1140px。

@media (min-width: 1200px) {
  .container {
    width: 1140px;
  }
}

编辑后

@media (min-width: 1200px) {
  .container {
    width: 98%;
  }
}

保存并重新启动笔记本

<强>更新

最近在安装的环境中不得不使用更广泛的Jupyter单元，这让我回到这里并提醒自己。

如果您需要在虚拟环境中执行此操作，则安装了jupyter。您可以在此子目录中找到css文件

env/lib/python3.6/site-packages/notebook/static/style/stye.min.css

Answer 7

（截至2018年，我建议尝试使用JupyterHub / JupyterLab。它使用显示器的全宽。如果这不是一个选项，可能因为你使用的是基于云的Jupyter-as-a-服务提供商，继续阅读）

（时尚被指控窃取用户数据，我转而使用Stylus插件）

我建议使用Stylish Browser Plugin。这样，您可以覆盖所有笔记本的css，而无需向笔记本添加任何代码。 我们不喜欢在.ipython / profile_default中更改配置，因为我们正在为整个团队运行共享Jupyter服务器，而width是用户首选项。

我专门为垂直方向的高分辨率屏幕制作了一种风格，它使细胞更宽，并在底部增加了一些空白空间，因此您可以将最后一个细胞定位在屏幕的中心。 https://userstyles.org/styles/131230/jupyter-wide 当然，如果您有不同的布局，或者您最后不想要额外的空白空间，您可以根据自己的喜好修改我的CSS。

最后但同样重要的是，Stylish是您工具集中的绝佳工具，因为您可以根据自己的喜好轻松自定义其他网站/工具（例如Jira，Podio，Slack等）

@media (min-width: 1140px) {
  .container {
    width: 1130px;
  }
}

.end_space {
  height: 800px;
}

Answer 8

对于Chrome用户，我建议使用Stylebot，它可以覆盖任何页面上的任何CSS，还可以搜索和安装其他共享自定义CSS。但是，出于我们的目的，我们不需要任何先进的主题。打开Stylebot，更改为Edit CSS。 Jupyter捕获了一些击键，因此您将无法在下面输入代码。只需复制和粘贴，或只是编辑：

#notebook-container.container {
    width: 90%;
}

根据需要更改宽度，我发现90％看起来比100％好。但这完全取决于你的眼睛。

Answer 9

我对@ jvd10的解决方案做了一些修改。 “！important”似乎太强了，以至于在显示TOC侧栏时容器不能很好地适应。我将其删除，并添加了“最小宽度”以限制最小宽度。

这是我的.juyputer / custom / custom.css：

/* Make the notebook cells take almost all available width and limit minimal width to 1110px */
.container {
    width: 99%;
    min-width: 1110px;
}   

/* Prevent the edit cell highlight box from getting clipped;
 * important so that it also works when cell is in edit mode*/
div.cell.selected {
    border-left-width: 1px;
}

Answer 10

这是我最终使用的代码。它将输入和输出单元格向左和向右拉伸。请注意，输入/输出编号指示将消失：

from IPython.core.display import display, HTML
display(HTML("<style>.container { width:100% !important; }</style>"))
display(HTML("<style>.output_result { max-width:100% !important; }</style>"))
display(HTML("<style>.prompt { display:none !important; }</style>"))

Answer 11

我尝试了一切，但没有任何效果，最终我将数据框显示为HTML，如下所示

from IPython.display import HTML    
HTML (pd.to_html())

Answer 12

对于Firefox / Chrome用户，实现100％宽度的一种不错的方法是使用自定义TamperMonkey脚本。

好处是

1. 在浏览器中配置一次，无需修改服务器配置。
2. 可与多个jupyter服务器配合使用。
3. TamperMonkey受信任，维护且稳定。
4. 可以通过javascript进行很多其他自定义。

此脚本对我有用https://gist.githubusercontent.com/mrk-andreev/2a9c2538fad0b687c27e192d5948834f/raw/6aa1148573dc20a22fca126e56e3b03f4abf281b/jpn_tmonkey.js