参考
- 主要参考:Jupyter Notebook 安装插件
- 美化和扩展安装:把Jupyter Notebook配置成Coding神器
- java内核安装:jupyter安装java内核
notebook
修改默认打开位置
通过配置文件修改
该方法全局生效,打开cmd输入:
//生成配置文件jupyter_notebook_config.py
jupyter notebook --generate-config
打开配置文件,在C.NotebookApp.notebook_dir="``"
引号中填入要指向的位置。
通过快捷方式
找到jupyter notebook的快捷方式,然后打开属性,将里面的目标值修改为要指向的位置,注意该方法仅针对通过快捷方式打开有效。
安装扩展中心:nbextensions
// 安装插件配置器
pip install jupyter_nbextensions_configurator
// 打开配置器
jupyter nbextensions_configurator enable --user
// 安装所有插件包
pip install jupyter_contrib_nbextensions
jupyter contrib nbextension install --user
打开常用扩展
Hinterland代码提示
Hinterland功能可以让你每敲完一个键,就出现下拉菜单,可以直接选中你需要的词汇。结合jupyter的方法提醒(在方法名后Shift+Tab)使用如虎添翼。不仅仅是python,同样支持其他内核。
Snippets/Snippets Menu
前者可以快捷插入固定程序片段,后者集成了一些常用的代码段。
添加Sublime Text快捷键
在安装好主题插件后,以下目录将会被创建:
在上述custom.js
中写入以下内容,刷新即可:
require(["codemirror/keymap/sublime", "notebook/js/cell", "base/js/namespace"],
function(sublime_keymap, cell, IPython) {
cell.Cell.options_default.cm_config.keyMap = 'sublime';
var cells = IPython.notebook.get_cells();
for(var cl=0; cl< cells.length ; cl++){
cells[cl].code_mirror.setOption('keyMap', 'sublime');
}
}
);
Sublime Text编辑器中内置了多种快捷键,可以很方便的进行代码编辑。 我结合日常使用习惯,把Jupyter中的常用快捷键进行了整理,并录制了GIF演示图。(手机浏览请左右滑动下面的表格)
快捷键 | 作用 | 演示 |
---|---|---|
Ctrl+ L |
选择一行(连续选取多行) | ![]() |
Ctrl+ D |
选择当前变量(或重复选择并编辑) | ![]() |
Ctrl+Shift+ M |
选择括号里面的内容 | ![]() |
Ctrl+Shift+ K |
或 Ctrl+ X
| 删除一行 | |
|
Ctrl+ K K
| 删除本行光标后的所有内容 | |
|
Ctrl+Shift+ D
| 快速复制一行 | |
|
Ctrl+ K U
| 大写 | |
|
Ctrl+ K L
| 小写 | |
|
Ctrl+ /
| 注释 | |
|
Ctrl+ Tab
| 代码提示,可以连续多按 | |
jupyter小控件
安装
# pip
pip install ipywidgets
jupyter nbextension enable --py widgetsnbextension
# Conda
conda install -c conda-forge ipywidgets
#Installing ipywidgets with conda automatically enables the extension
使用
使用“interact”功能自动创建UI控件,这是使用IPython最方便的方法。
# Start with some imports!
from ipywidgets import interact
import ipywidgets as widgets
多语言内核支持
内核相关命令:
// 列出当前所有的jupyter内核(包括lab)
jupyter kernelspec list
// 安装ipykernel库
pip install ipykernel
// 以当前环境创建内核
//以当前环境创建内核
python -m ipykernel install
//以当前环境为所有用户创建名为py的内核(user参数不加也可以)
python -m ipykernel install --user --name py
// 删除特定名称的内核
jupyter kernelspec remove kernel_name
多版本python内核
如果你的多个python 是安装在多个环境中的,那么可以先激活对应的虚拟环境,然后创建内核后退出该环境。下面假定以名为py的python环境创建名为py35的内核。
// 激活虚拟环境py
acitvate py (or source activate py35)
// 以当前环境创建内核py35
python -m ipykernel install --name py35
// 退出虚拟环境
conda deactivate (or source deactivate)
执行完毕后,刷新notebook或者lab,你会发现多出了一个名为py35的内核。
- notebook:
- lab:
安装java编译器
- 安装JDK,并配置好环境变量,注意JDK的版本要高于9
- 下载开源的jupyter java内核:IJAVA
- 将IJAVA的压缩包解压后,在目录中打开cmd,执行以下命令:
python install.py
- 安装完成后查看内核:
jupyter kernelspec list
- 如果内核中出现了java,那就大功告成。
安装Javascript内核
参考:写给Javascript程序员的Jupyter Notebook使用指北
Kernel error
内核调用出错,最终的报错是The system cannot find the file
可以查看当前调用的内核是否已失效(比如指向已删除的虚拟环境):
如果确已失效,那么可以在cmd中移除该内核条目,然后jupyter将使用默认内核。
或者你也可以通过以下命令重新安装默认内核:
//以当前的默认环境创建
python -m ipykernel install --user
主题
安装:
$ pip install jupyterthemes
$ pip install --upgrade jupyterthemes
Jupyter-themes
实际上是一个命令行的命令工具,切换主题的话需要用命令行来执行。安装好后,就可以用jt
命令来执行。
以下是常用的命令:
# 查看所有颜色主题 --list
$ jt -l
# 选择主题 --theme
$ jt -t 主题名称
# 恢复默认主题 --recover
$ jt -r
- chesterish
- grade3
- gruvboxd
- gruvboxl
- monokai
- oceans16
- onedork
- solarizedd
- solarizedl
lab
由于我在安装lab前已经安装配置了notebook,所以如果出现该部分未提及的报错等问题,可以先按照上面的步骤配置好notebook。
安装/启动
// 安装
pip install jupyterlab
或者
conda install -c conda-forge jupyterlab
// 启动
jupyter lab
或者
jupyter lab --port='8080' --ip='*' --notebook-dir='d:/'
多语言内核管理
lab是基于notebook的,所以内核管理也是一致的。通过上面notebook的内核管理方法一次配置,两处受用。
由于我之前已经给notebook配置了java内核支持并修改了默认打开文件位置,所以安装lab后这两点都无需再次配置。
安装扩展插件
首先需要安装Nodejs,安装后可能需要重启。
之后进入lab的界面,点击Settings
->Advanced Settings Editor
,将Extension Manager
里的enabled的fasle改为true(在右边的窗口修改)。
修改后刷新页面左侧将会出现上图侧边栏最下方的按钮,打开后再点击DISCOVER
等待几秒即可看到可安装的控件列表。
主题
自带的主题过于枯燥,网上找了一个,首先要安装chrome扩展stylus,然后打开jupyterlab页面后在当前页面点击插件按钮完成添加。
添加内容:
@-moz-document url("http://localhost:8888/lab"), regexp("^https?://.*/lab\\?$")
{
/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/
/*
The following CSS variables define the main, public API for styling JupyterLab.
These variables should be used by all plugins wherever possible. In other
words, plugins should not define custom colors, sizes, etc unless absolutely
necessary. This enables users to change the visual theme of JupyterLab
by changing these variables.
Many variables appear in an ordered sequence (0,1,2,3). These sequences
are designed to work well together, so for example, `--jp-border-color1` should
be used with `--jp-layout-color1`. The numbers have the following meanings:
* 0: super-primary, reserved for special emphasis
* 1: primary, most important under normal situations
* 2: secondary, next most important under normal situations
* 3: tertiary, next most important under normal situations
Throughout JupyterLab, we are mostly following principles from Google's
Material Design when selecting colors. We are not, however, following
all of MD as it is not optimized for dense, information rich UIs.
*/
:root {
/* Atom one dark colours */
--atom-one-dark-cyan: #56B6C2;
--atom-one-dark-blue: #61AFEF;
--atom-one-dark-bg-1: #121417;
--atom-one-dark-mono-2: #828997;
--atom-one-dark-red-1: #E06C75;
--atom-one-dark-mono-1: #ABB2BF;
--atom-one-dark-silver: #AAAAAA;
--atom-one-dark-purple: #C678DD;
--atom-one-dark-orange-2: #E5C07B;
--atom-one-dark-bg-hl: #2F343D;
--atom-one-dark-black: #0F1011;
--atom-one-dark-gutter: #666D7A;
--atom-one-dark-fg: #ABB2BF;
--atom-one-dark-green: #98C379;
--atom-one-dark-red-2: #BE5046;
--atom-one-dark-orange-1: #D19A66;
--atom-one-dark-mono-3: #5C6370;
--atom-one-dark-accent: #AEB9F5;
--atom-one-dark-bg: #282C34;
--atom-one-dark-gray: #3E4451;
/* Elevation
*
* We style box-shadows using Material Design's idea of elevation. These particular numbers are taken from here:
*
* https://github.com/material-components/material-components-web
* https://material-components-web.appspot.com/elevation.html
*/
/* The dark theme shadows need a bit of work, but this will probably also require work on the core layout
* colors used in the theme as well. */
--jp-shadow-base-lightness: 32;
--jp-shadow-umbra-color: rgba(var(--jp-shadow-base-lightness), var(--jp-shadow-base-lightness), var(--jp-shadow-base-lightness), 0.2);
/* shadow under menus */
--jp-shadow-penumbra-color: rgba(var(--jp-shadow-base-lightness), var(--jp-shadow-base-lightness), var(--jp-shadow-base-lightness), 0.14);
/* glow under menus */
--jp-shadow-ambient-color: rgba(var(--jp-shadow-base-lightness), var(--jp-shadow-base-lightness), var(--jp-shadow-base-lightness), 0.12);
/* same? */
--jp-elevation-z0: none;
--jp-elevation-z1: 0px 2px 1px -1px var(--jp-shadow-umbra-color),
0px 1px 1px 0px var(--jp-shadow-penumbra-color),
0px 1px 3px 0px var(--jp-shadow-ambient-color);
--jp-elevation-z2: 0px 3px 1px -2px var(--jp-shadow-umbra-color),
0px 2px 2px 0px var(--jp-shadow-penumbra-color),
0px 1px 5px 0px var(--jp-shadow-ambient-color);
--jp-elevation-z4: 0px 2px 4px -1px var(--jp-shadow-umbra-color),
0px 4px 5px 0px var(--jp-shadow-penumbra-color),
0px 1px 10px 0px var(--jp-shadow-ambient-color);
--jp-elevation-z6: 0px 3px 5px -1px var(--jp-shadow-umbra-color),
0px 6px 10px 0px var(--jp-shadow-penumbra-color),
0px 1px 18px 0px var(--jp-shadow-ambient-color);
--jp-elevation-z8: 0px 5px 5px -3px var(--jp-shadow-umbra-color),
0px 8px 10px 1px var(--jp-shadow-penumbra-color),
0px 3px 14px 2px var(--jp-shadow-ambient-color);
--jp-elevation-z12: 0px 7px 8px -4px var(--jp-shadow-umbra-color),
0px 12px 17px 2px var(--jp-shadow-penumbra-color),
0px 5px 22px 4px var(--jp-shadow-ambient-color);
--jp-elevation-z16: 0px 8px 10px -5px var(--jp-shadow-umbra-color),
0px 16px 24px 2px var(--jp-shadow-penumbra-color),
0px 6px 30px 5px var(--jp-shadow-ambient-color);
--jp-elevation-z20: 0px 10px 13px -6px var(--jp-shadow-umbra-color),
0px 20px 31px 3px var(--jp-shadow-penumbra-color),
0px 8px 38px 7px var(--jp-shadow-ambient-color);
--jp-elevation-z24: 0px 11px 15px -7px var(--jp-shadow-umbra-color),
0px 24px 38px 3px var(--jp-shadow-penumbra-color),
0px 9px 46px 8px var(--jp-shadow-ambient-color);
/* Custom kernel running icon */
--jp-icon-kernel-running: url("data:image/svg+xml,%3Csvg fill='#98C379' xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z'/%3E%3C/svg%3E");
--jp-icon-circle: url("data:image/svg+xml,%3Csvg fill='#98C379' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill='none' d='M0 0h18v18H0V0z'/%3E%3Ccircle cx='9' cy='9' r='8'/%3E%3C/svg%3E");
--jp-icon-run: url("data:image/svg+xml,%3Csvg fill='#98C379' height='18' viewBox='0 0 24 24' width='18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
--jp-icon-stop: url("data:image/svg+xml,%3Csvg fill='#E06C75' height='18' viewBox='0 0 24 24' width='18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M6 6h12v12H6z'/%3E%3C/svg%3E");
/*--jp-icon-refresh: url("data:image/svg+xml,%3Csvg fill='#D19A66' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M13.7 4.3C12.5 3.1 10.8 2.4 9 2.4c-3.6 0-6.6 3-6.6 6.6s2.9 6.6 6.6 6.6c3.1 0 5.6-2.1 6.4-5h-1.7c-.7 1.9-2.5 3.3-4.7 3.3-2.7 0-5-2.2-5-4.9s2.2-4.9 5-4.9c1.4 0 2.6.6 3.5 1.5L9.8 8.2h5.8V2.4l-1.9 1.9z'/%3E%3Cpath fill='none' d='M0 0h18v18H0V0z'/%3E%3C/svg%3E");
--jp-icon-refresh-default: url("data:image/svg+xml,%3Csvg fill='%23E0E0E0' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M13.7 4.3C12.5 3.1 10.8 2.4 9 2.4c-3.6 0-6.6 3-6.6 6.6s2.9 6.6 6.6 6.6c3.1 0 5.6-2.1 6.4-5h-1.7c-.7 1.9-2.5 3.3-4.7 3.3-2.7 0-5-2.2-5-4.9s2.2-4.9 5-4.9c1.4 0 2.6.6 3.5 1.5L9.8 8.2h5.8V2.4l-1.9 1.9z'/%3E%3Cpath fill='none' d='M0 0h18v18H0V0z'/%3E%3C/svg%3E");
/* Borders
*
* The following variables, specify the visual styling of borders in JupyterLab.
*/
--jp-border-width: 1px;
--jp-border-color0: var(--atom-one-dark-gray);
--jp-border-color1: var(--atom-one-dark-gray);
--jp-border-color2: var(--atom-one-dark-gray);
--jp-border-color3: var(--atom-one-dark-gray);
--jp-border-radius: 1px;
/* UI Fonts
*
* The UI font CSS variables are used for the typography all of the JupyterLab
* user interface elements that are not directly user generated content.
*
* The font sizing here is done assuming that the body font size of --jp-ui-font-size1
* is applied to a parent element. When children elements, such as headings, are sized
* in em all things will be computed relative to that body size.
*/
--jp-ui-font-scale-factor: 1.2;
--jp-ui-font-size0: 0.83333em;
--jp-ui-font-size1: 12px;
/* Base font size */
--jp-ui-font-size2: 1.2em;
--jp-ui-font-size3: 1.44em;
--jp-ui-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
/*
* Use these font colors against the corresponding main layout colors.
* In a light theme, these go from dark to light.
*/
/* Defaults use Material Design specification */
--jp-ui-font-color0: var(--atom-one-dark-mono-1);
--jp-ui-font-color1: var(--atom-one-dark-mono-1);
--jp-ui-font-color2: var(--atom-one-dark-mono-1);
--jp-ui-font-color3: var(--atom-one-dark-mono-1);
/*
* Use these against the brand/accent/warn/error colors.
* These will typically go from light to darker, in both a dark and light theme.
*/
--jp-ui-inverse-font-color0: rgba(0, 0, 0, 1.0);
--jp-ui-inverse-font-color1: rgba(0, 0, 0, 0.8);
--jp-ui-inverse-font-color2: rgba(0, 0, 0, 0.5);
--jp-ui-inverse-font-color3: rgba(0, 0, 0, 0.3);
/* Content Fonts
*
* Content font variables are used for typography of user generated content.
*
* The font sizing here is done assuming that the body font size of --jp-content-font-size1
* is applied to a parent element. When children elements, such as headings, are sized
* in em all things will be computed relative to that body size.
*/
--jp-content-line-height: 1.6;
--jp-content-font-scale-factor: 1.2;
--jp-content-font-size0: 0.83333em;
--jp-content-font-size1: 12px;
/* Base font size */
--jp-content-font-size2: 1.2em;
--jp-content-font-size3: 1.44em;
--jp-content-font-size4: 1.728em;
--jp-content-font-size5: 2.0736em;
/* This gives a magnification of about 125% in presentation mode over normal. */
--jp-content-presentation-font-size1: 17px;
--jp-content-heading-line-height: 1;
--jp-content-heading-margin-top: 1.2em;
--jp-content-heading-margin-bottom: 0.8em;
--jp-content-heading-font-weight: 500;
/* Defaults use Material Design specification */
--jp-content-font-color0: rgba(255, 255, 255, 1.0);
--jp-content-font-color1: var(--atom-one-dark-fg);
/* this will colour all markdown and output text */
--jp-content-font-color2: rgba(255, 255, 255, 0.7);
--jp-content-font-color3: rgba(255, 255, 255, 0.5);
--jp-content-link-color: var(--md-blue-300);
--jp-content-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
/*
* Code Fonts
*
* Code font variables are used for typography of code and other monospaces content.
*/
--jp-code-font-size: 12px;
--jp-code-line-height: 1.3077;
/* 17px for 13px base */
--jp-code-padding: 0.385em;
/* 5px for 13px base */
--jp-code-font-family: 'Consolas', monospace;
/*--jp-code-font-family: 'Source Code Pro', monospace;*/
/* This gives a magnification of about 125% in presentation mode over normal. */
--jp-code-presentation-font-size: 16px;
/* Layout
*
* The following are the main layout colors use in JupyterLab. In a light
* theme these would go from light to dark.
*/
--jp-layout-color0: #111111;
--jp-layout-color1: var(--md-grey-900);
--jp-layout-color2: var(--atom-one-dark-bg-hl);
/* these are for unselected tabs amongst other things... */
--jp-layout-color3: var(--atom-one-dark-bg-hl);
/* this is for the area behind the tabs of the notebooks open */
--jp-layout-color4: var(--atom-one-dark-bg-1);
/* Brand/accent */
--jp-brand-color0: var(--md-blue-700);
--jp-brand-color1: var(--atom-one-dark-blue);
/* selected cell colour, bar to left of cell, selected file in browser */
--jp-brand-color2: var(--md-blue-300);
--jp-brand-color3: var(--md-blue-100);
--jp-accent-color0: var(--md-green-700);
--jp-accent-color1: var(--md-green-500);
--jp-accent-color2: var(--md-green-300);
--jp-accent-color3: var(--md-green-100);
/* State colors (warn, error, success, info) */
--jp-warn-color0: var(--md-orange-700);
--jp-warn-color1: var(--md-orange-500);
--jp-warn-color2: var(--md-orange-300);
--jp-warn-color3: var(--md-orange-100);
--jp-error-color0: var(--md-red-700);
--jp-error-color1: var(--md-red-500);
--jp-error-color2: var(--md-red-300);
--jp-error-color3: var(--md-red-100);
--jp-success-color0: var(--md-green-700);
--jp-success-color1: var(--md-green-500);
--jp-success-color2: var(--md-green-300);
--jp-success-color3: var(--md-green-100);
--jp-info-color0: var(--md-cyan-700);
--jp-info-color1: var(--md-cyan-500);
--jp-info-color2: var(--md-cyan-300);
--jp-info-color3: var(--md-cyan-100);
/* Cell specific styles */
--jp-cell-padding: 0px 10px 10px 0px;
/* T R B L */
--jp-cell-collapser-width: 8px;
--jp-cell-collapser-min-height: 20px;
--jp-cell-collapser-not-active-hover-opacity: 0.6;
--jp-cell-editor-background: var(--atom-one-dark-bg);
/* background colour of all cells */
--jp-cell-editor-border-color: var(--atom-one-dark-gray);
--jp-cell-editor-box-shadow: inset 0 0 2px var(--md-blue-300);
--jp-cell-editor-active-background: var(--jp-layout-color0);
/* background colour of current cell */
--jp-cell-editor-active-border-color: var(--jp-brand-color1);
/* border colour of current cell */
--jp-cell-prompt-width: 75px;
/* width of cell thing to left of active cell */
--jp-cell-prompt-font-family: 'Consolas', monospace;
--jp-cell-prompt-letter-spacing: 0px;
--jp-cell-prompt-opacity: 1.0;
--jp-cell-prompt-not-active-opacity: 1.0;
--jp-cell-prompt-not-active-font-color: var(--atom-one-dark-mono-1);
--jp-cell-inprompt-font-color: var(--jp-brand-color1);
--jp-cell-outprompt-font-color: var(--atom-one-dark-mono-1);
/* Notebook specific styles */
--jp-notebook-padding: 0px 10px 0px 0px;
/* default 10 */
--jp-notebook-scroll-padding: 100px;
--jp-notebook-select-background: var(--jp-layout-color1);
--jp-notebook-multiselected-color: rgba(33, 150, 243, .24);
/* multi select colour */
/* Rendermime styles */
--jp-rendermime-error-background: rgba(244, 67, 54, .28);
--jp-rendermime-table-row-background: var(--md-grey-900);
--jp-rendermime-table-row-hover-background: rgba(3, 169, 244, .2);
/* Dialog specific styles */
--jp-dialog-background: rgba(0, 0, 0, .6);
/* Console specific styles */
--jp-console-padding: 10px;
/* Toolbar specific styles */
--jp-toolbar-border-color: var(--jp-border-color2);
--jp-toolbar-micro-height: 8px;
--jp-toolbar-background: var(--jp-layout-color1);
--jp-toolbar-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.8);
--jp-toolbar-header-margin: 4px 4px 0px 4px;
--jp-toolbar-active-background: var(--jp-layout-color0);
/* Input field styles */
--jp-input-box-shadow: inset 0 0 2px var(--md-blue-300);
--jp-input-active-background: var(--jp-layout-color0);
--jp-input-hover-background: var(--jp-layout-color2);
--jp-input-background: var(--md-grey-800);
--jp-input-border-color: var(--jp-border-color1);
--jp-input-active-border-color: var(--jp-brand-color1);
/* General editor styles */
--jp-editor-selected-background: var(--jp-layout-color2);
--jp-editor-selected-focused-background: rgba(33, 150, 243, .24);
--jp-editor-cursor-color: var(--atom-one-dark-blue);
/* Code mirror specific styles */
--jp-mirror-editor-keyword-color: var(--atom-one-dark-purple);
--jp-mirror-editor-atom-color: var(--md-blue-300);
--jp-mirror-editor-number-color: var(--atom-one-dark-orange-1);
--jp-mirror-editor-def-color: var(--atom-one-dark-blue);
--jp-mirror-editor-variable-color: var(--atom-one-dark-mono-1);
--jp-mirror-editor-variable-2-color: var(--atom-one-dark-mono-1);
--jp-mirror-editor-variable-3-color: var(--md-grey-600);
--jp-mirror-editor-punctuation-color: var(--atom-one-dark-mono-1);
--jp-mirror-editor-property-color: var(--atom-one-dark-red-1);
--jp-mirror-editor-operator-color: var(--atom-one-dark-mono-1);
--jp-mirror-editor-comment-color: var(--atom-one-dark-mono-3);
--jp-mirror-editor-string-color: var(--atom-one-dark-green);
--jp-mirror-editor-string-2-color: #f50;
--jp-mirror-editor-meta-color: #AA22FF;
--jp-mirror-editor-qualifier-color: #555;
--jp-mirror-editor-builtin-color: var(--atom-one-dark-purple);
--jp-mirror-editor-bracket-color: var(--atom-one-dark-mono-1);
--jp-mirror-editor-tag-color: var(--md-green-700);
--jp-mirror-editor-attribute-color: var(--atom-one-dark-red-1);
--jp-mirror-editor-header-color: var(--md-blue-500);
--jp-mirror-editor-quote-color: var(--md-green-300);
--jp-mirror-editor-link-color: var(--atom-one-dark-red-1);
--jp-mirror-editor-error-color: #f00;
--jp-mirror-editor-hr-color: #FFFFFF;
/* Edit the background and stuff */
--jp-layout-color0: var(--atom-one-dark-bg);
--jp-layout-color1: var(--atom-one-dark-bg);
--jp-editor-selected-background: var(--atom-one-dark-bg-hl);
--jp-editor-selected-focused-background: var(--atom-one-dark-bg-hl);
/*--jp-layout-color0: #fcfcfd;
--jp-layout-color1: #ffffff;
--jp-editor-selected-background: #d9d9d9;
--jp-editor-selected-focused-background: #d7d4f0;
--jp-editor-cursor-color: var(--jp-ui-font-color0);
--jp-mirror-editor-keyword-color: #4c8bc3;
--jp-mirror-editor-atom-color: #88F;
--jp-mirror-editor-number-color: #de611e;
--jp-mirror-editor-def-color: #8c4ace;
--jp-mirror-editor-variable-color: var(--md-grey-900);
--jp-mirror-editor-variable-2-color: var(--md-grey-800);
--jp-mirror-editor-variable-3-color: var(--md-grey-700);
--jp-mirror-editor-punctuation-color: #05a;
--jp-mirror-editor-property-color: #05a;
--jp-mirror-editor-operator-color: #bb90d6;
--jp-mirror-editor-comment-color: #9ca2a2;
--jp-mirror-editor-string-color: #4a99f3;
--jp-mirror-editor-string-2-color: #ada;
--jp-mirror-editor-meta-color: #ff228f;
--jp-mirror-editor-qualifier-color: #7616d8;
--jp-mirror-editor-builtin-color: #cc0000;
--jp-mirror-editor-bracket-color: #997;
--jp-mirror-editor-tag-color: #170;
--jp-mirror-editor-attribute-color: #5a86dc;
--jp-mirror-editor-header-color: blue;
--jp-mirror-editor-quote-color: #090;
--jp-mirror-editor-link-color: #00c;
--jp-mirror-editor-error-color: #e627b5;
--jp-mirror-editor-hr-color: #999;
--jp-vega-background: #F5F5F5;
--jp-cell-editor-background: var(--md-grey-50);*/
/* Vega extension styles */
--jp-vega-background: var(--atom-one-dark-bg-1);
/*--jp-SideBar-background: var(--atom-one-dark-bg-1);*/
--jp-main-dock-panel-background: var(--atom-one-dark-bg-1);
}
/* Change the colour of linenumbers */
.CodeMirror-linenumber
{
padding: 0 3px 0 5px;
min-width: 20px;
text-align: right;
color: var(--atom-one-dark-mono-1);
white-space: nowrap;
}
/* This is the region where the linenumbers are */
.CodeMirror-gutters
{
border-right: 1px solid var(--atom-one-dark-bg-hl);
background-color: var(--atom-one-dark-bg);
white-space: nowrap;
}
/* Do some nice things with brackets */
div.CodeMirror span.CodeMirror-matchingbracket
{
color: var(--atom-one-dark-mono-1);
border-bottom: 1px solid var(--atom-one-dark-blue);
line-height: 1;
}
div.CodeMirror span.CodeMirror-nonmatchingbracket
{
color: var(--atom-one-dark-mono-1);
border-bottom: 1px solid var(--atom-one-dark-red-1);
line-height: 0.55;
}
.CodeMirror-matchingtag
{
background: rgba(255, 150, 0, .3);
}
.CodeMirror-activeline-background
{
background: #e8f2ff;
}
.CodeMirror-selected
{
background: var(--atom-one-dark-bg-hl);
}
.CodeMirror-focused .CodeMirror-selected
{
background: var(--atom-one-dark-bg-hl);
}
/* selected text highlight */
/* Item selected in menu for files and what not */
.jp-DirListing-item.jp-mod-selected
{
color: white;
background: var(--atom-one-dark-bg-hl);
}
/* Makes the running icon a tiny bit bigger */
.jp-DirListing-item.jp-mod-running .jp-DirListing-itemIcon:before
{
color: var(--atom-one-dark-green);
content: "\25CF";
font-size: 12px;
position: relative;
width: 100%;
height: 100%;
top: -2px;
left: -8px;
}
/*.jp-Toolbar-item.jp-Toolbar-kernelStatus {
display: inline-block;
width: 32px;
background-repeat: no-repeat;
background-position: center;
background-size: 16px;
color: black;
fill: green;
}*/
/* width */
::-webkit-scrollbar
{
width: 6px;
height: 6px;
}
/* Track */
::-webkit-scrollbar-track
{
background: rgba(0, 0, 0, 0);
}
/* Handle */
::-webkit-scrollbar-thumb
{
background: var(--atom-one-dark-mono-3);
border-radius: 10px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover
{
background: var(--atom-one-dark-mono-3);
}
/* Handle */
::-webkit-scrollbar-thumb:active
{
background: var(--atom-one-dark-blue);
}
/* Controls colour of self */
.cm-s-jupyter span.cm-variable-2
{
color: var(--atom-one-dark-orange-1);
}
/* Controls colour of self */
.cm-s-jupyter span.cm-variable-3
{
color: var(--atom-one-dark-green);
}
/* Controls colour of built in like print, range, etc */
.cm-s-jupyter span.cm-builtin
{
color: var(--atom-one-dark-cyan);
}
/* Center any plots e.g. Matplotlib plots */
.p-Widget.jp-RenderedImage.jp-mod-trusted.jp-OutputArea-output
{
/*display: table-cell;*/
text-align: center;
/*vertical-align: middle;*/;
}
.jp-Completer-item.jp-mod-active
{
color: var(--atom-one-dark-fg);
background: var(--atom-one-dark-bg-hl);
}
/* Custom line rule */
.jp-RenderedHTMLCommon hr
{
display: block;
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: 0em;
margin-right: 0em;
border-style: inset;
border-width: 1px;
border-top: 1px solid var(--atom-one-dark-fg);
border-bottom: 1px solid var(--atom-one-dark-fg);
}
/* Markdown inline code */
.jp-RenderedHTMLCommon code
{
background-color: var(--atom-one-dark-gray);
padding: 1px 3px;
}
.jp-MarkdownOutput
{
flex: 1 1 auto;
margin-top: 0;
margin-bottom: 0;
padding-left: var(--jp-code-padding);
padding-right: var(--jp-code-padding);
}
.cm-s-zenburn
{
background-color: var(--atom-one-dark-bg);
color: var(--atom-one-dark-fg);
}
.cm-s-zenburn .CodeMirror-gutters
{
background: var(--atom-one-dark-bg) !important;
}
}
如果字体大小不合适,还可以在编辑器内修改:
[
](https://blog.csdn.net/weixin_42509569/article/details/113719202)