5. sphinx book theme 特殊内容块¶
这个主题的一些特别的指令语法。
5.1. epigraph 引文¶
没有署名的引用：
Here’s my quote, it’s pretty neat. I wonder how many lines I can create with a single stream-of-consciousness quote. I could try to add a list of ideas to talk about. I suppose I could just keep going on forever, but I’ll stop here.
> Here’s my quote, it’s pretty neat. I wonder how many lines I can create with a single stream-of-consciousness quote. I could try to add a list of ideas to talk about. I suppose I could just keep going on forever, but I’ll stop here.
有时候你会想让引用更引人注意。为此，使用 {epigraph} 指令。下面是一个引文，点击它右边的按钮，显示用于生成它的代码:
Here’s my quote, it’s pretty neat. I wonder how many lines I can create with a single stream-of-consciousness quote. I could try to add a list of ideas to talk about. I suppose I could just keep going on forever, but I’ll stop here.
```{epigraph}
Here's my quote, it's pretty neat.
I wonder how many lines I can create with
a single stream-of-consciousness quote.
I could try to add a list of ideas to talk about.
I suppose I could just keep going on forever,
but I'll stop here.
```
还可以通过添加空行，后跟以 -- 开头的行，向题词添加属性。这将被渲染成这样:
Here’s my quote, it’s pretty neat. I wonder how many lines I can create with a single stream-of-consciousness quote. I could try to add a list of ideas to talk about. I suppose I could just keep going on forever, but I’ll stop here.
—Jo the Jovyan, the jupyter book docs
```{epigraph}
Here's my quote, it's pretty neat.
I wonder how many lines I can create with
a single stream-of-consciousness quote.
I could try to add a list of ideas to talk about.
I suppose I could just keep going on forever,
but I'll stop here.
-- Jo the Jovyan, *[the jupyter book docs](https://beta.jupyterbook.org)*
```
5.2. Sidebars¶
sphinx-book-theme 中有两种不同类型的类似边栏的内容，典型且通用的的 {sidebar} 指令，以及特定于此主题的 {margin} 指令。本节将涵盖这两方面。两者都允许你将额外内容与主要内容分开放置。
小技巧
侧边栏的内容通常会与站点内容表所在的空白区域重叠。当阅读器将侧边栏内容滚动到视图中时，右边的导航栏应该自动隐藏。
```{sidebar} 有两种方式添加内容到左侧边栏中
* 通过`{margin}`指令
* 通过添加 `margin` 这个CSS类到你自己的内容块中。
```
5.2.1. 通过指令添加¶
margin 侧边栏语法如下：
```{margin} **margin 侧边栏标题**
margin 侧边栏标题内容
```
通过上文我们可以知道，margin 侧边栏标题与代码块之类的组件是没有办法处于同一行（水平的）位置的，我们在使用 margin 侧边栏标题时需要注意其放置的位置。
5.2.2. 通过CSS类 margin 添加¶
备注
This note will be in the margin!
:::{note}
:class: margin
This note will be in the margin!
:::
这适用于页面上的大多数指令，但一般来说，这适用于“父容器”，即内容包的顶部指令。
图 5.2.1 And here is my figure caption¶
例如： figure图片
```{figure} img/fun-fish.png
---
figclass: margin
alt: My figure text
name: myfig4
---
And here is my figure caption
```
5.2.3. 在页边空白处加上图片的文字说明¶
图 5.2.2 And here is my figure caption, if you look to the left, you can see that COOL is in big red letters. But you probably already noticed that, really I am just taking up space to see how the margin caption looks like when it is really long :-)¶
```{figure} img/fun-fish.png
---
width: 60%
figclass: margin-caption
alt: My figure text
name: myfig54
---
And here is my figure caption, if you look to the left, you can see that COOL is in big red letters. But you probably already noticed that, really I am just taking up space to see how the margin caption looks like when it is really long :-)
```
5.3. 宽屏的内容¶
全宽度的内容延伸到右边，使它在你的书的其他内容中脱颖而出。要向页面添加全宽内容，请向文档中的任何元素添加类全宽内容。例如，你可以像这样给 note 指令或其他指令添加一个全宽类属性:
```{note}
:class: full-width
This content will be full-width
```
```{code-block} java
:class: full-width
public class main {
public static void main(String[] args) {
System.out.println("hello world");
}
}
```
这段代码的结果如下:
备注
This content will be full-width
public class main {
public static void main(String[] args) {
System.out.println("hello world");
}
}