本页介绍了如何将表格插入到您的页面中。
用法
没有专门的包含来创建表。 不过,您可以使用 Markdown 轻松创建一个:
代码
|蓝色|红色|绿色|黄色|紫色|
|------|-----|--------|--------|--------|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |结果
| 蓝色 | 红色 | 绿色 | 黄色 | 紫色 |
|---|---|---|---|---|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |
对齐表格
默认情况下,表格拉伸至 100% 宽度:
| 蓝色 | 红色 | 绿色 | 黄色 | 紫色 |
|---|---|---|---|---|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |
如果您希望表格保持其自然宽度,请将 {:.left} 放在表格下方:
代码
| Blue | Red | Green | Yellow | Purple |
|------|-----|-------|--------|--------|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |
{:.left}
结果
| 蓝色 | 红色 | 绿色 | 黄色 | 紫色 |
|---|---|---|---|---|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |
或者对于居中的表格,使用 {:.center}:
代码
| Blue | Red | Green | Yellow | Purple |
|------|-----|-------|--------|--------|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |
{:.center}
结果
| 蓝色 | 红色 | 绿色 | 黄色 | 紫色 |
|---|---|---|---|---|
| 5 | 4 | 3 | 2 | 1 |
| 1 | 2 | 3 | 4 | 5 |
对齐列
您可以在表格标题中放置 : 符号来指定列对齐方式:
代码
| 日 |缩写 |描述 |
|----------:|:------------:|:----------------|
| 星期一 | 星期一 | Dynamo 字谜 |
| 星期二 | 周二 |胜利之日! |
|星期三 | 周三 |最好的亚当斯|
| 星期四 | 星期四 |星期五星期五 |
| 星期五 | 周五 | TGIF |结果
| 日 | 缩写 | 描述 |
|---|---|---|
| 星期一 | 星期一 | Dynamo 字谜 |
| 星期二 | 周二 | 胜利之日! |
| 星期三 | 周三 | 最好的亚当斯 |
| 星期四 | 星期四 | 星期五星期五 |
| 星期五 | 周五 | TGIF |
添加图像
您可以在表格中包含图像:
代码
| | ImageJ 的面包和黄油。 |
| |你知道你想要。 |结果
![]() |
ImageJ 的面包和黄油。 |
![]() |
你知道你想要。 |
自定义样式
您可以通过附加一个来向表格添加自定义样式 CSS class:
代码
|超级英雄 |超级大国 |
| ------------- | -------------------- |
|独眼巨人|光学爆炸 |
|闪电侠 |超级速度|
|松鼠女孩|与松鼠交谈|
{:.框}结果
|超级英雄 |超级大国 | | ————- | ——————– | |独眼巨人|光学爆炸 | |闪电侠 |超级速度| |松鼠女孩|与松鼠交谈| {:.框}
如果还没有具有您想要的样式的类, 你可以内联声明它:
代码
<style>
.power-levels-table {
background-image: repeating-linear-gradient(60deg,
plum, hotpink 30px, turquoise 30px, aquamarine 60px);
font-family: "Comic Sans MS", "Comic Sans", cursive;
font-weight: bold;
}
.power-levels-table th { text-decoration: underline; }
.power-levels-table th, .power-levels-table td {
padding: 0.2em 1em;
color: black;
text-shadow:
-1px -1px 0 white, 1px -1px 0 white,
-1px 1px 0 white, 1px 1px 0 white;
}
</style>
|超级英雄 |功率等级 |
| -------------- | ------------|
|惊奇队长 |荒谬|
|超人|可笑|
|银色冲浪者 |荒谬|
{:.功率级别表}结果
| 超级英雄 | 功率等级 |
|---|---|
| 惊奇队长 | 荒谬 |
| 超人 | 可笑 |
| 银色冲浪者 | 荒谬 |
电子表格
您可以嵌入外部电子表格。
谷歌表格
{% include spreadsheet platform="google" id="1xl0owZ1kAJDLrA2XtNjlvKwhO5ZsS5_CMmw-dU64sFk" title="ImageJ Conference 2015 Program" %}
