commit
1f433637fe
|
@ -61,9 +61,7 @@ Markdown doesn't have strict rules about how to process lists. When we moved
|
|||
from Jekyll to Hugo, we broke some lists. To fix them, keep the following in
|
||||
mind:
|
||||
|
||||
- Make sure you indent sub-list items **4 spaces** rather than the 2 that you
|
||||
may be used to. Counter-intuitively, you need to indent block-level content
|
||||
within a list item an extra 4 spaces too.
|
||||
- Make sure you indent sub-list items **2 spaces**.
|
||||
|
||||
- To end a list and start another, you need a HTML comment block on a new line
|
||||
between the lists, flush with the left-hand border. The first list won't end
|
||||
|
@ -74,10 +72,9 @@ mind:
|
|||
- This is a list item
|
||||
* This is another list item in the same list
|
||||
- You can mix `-` and `*`
|
||||
- To make a sub-item, indent two tabstops (4 spaces). **This is different
|
||||
from Jekyll and Kramdown.**
|
||||
- This is a sub-sub-item. Indent two more tabstops (4 more spaces).
|
||||
- Another sub-item.
|
||||
- To make a sub-item, indent two spaces.
|
||||
- This is a sub-sub-item. Indent two more spaces.
|
||||
- Another sub-item.
|
||||
|
||||
<!-- separate lists -->
|
||||
|
||||
|
@ -85,15 +82,15 @@ mind:
|
|||
consecutive lists. **The HTML comment needs to be at the left margin.**
|
||||
- Bullet lists can have paragraphs or block elements within them.
|
||||
|
||||
Indent the content to be one tab stop beyond the text of the bullet
|
||||
point. **This paragraph and the code block line up with the second `l` in
|
||||
`Bullet` above.**
|
||||
Indent the content to be the same as the first line of the bullet point.
|
||||
**This paragraph and the code block line up with the first `B` in `Bullet`
|
||||
above.**
|
||||
|
||||
```bash
|
||||
ls -l
|
||||
```
|
||||
```bash
|
||||
ls -l
|
||||
```
|
||||
|
||||
- And a sub-list after some block-level content
|
||||
- And a sub-list after some block-level content
|
||||
|
||||
- A bullet list item can contain a numbered list.
|
||||
1. Numbered sub-list item 1
|
||||
|
@ -116,13 +113,13 @@ mind:
|
|||
two consecutive lists. **The HTML comment needs to be at the left margin.**
|
||||
2. Numbered lists can have paragraphs or block elements within them.
|
||||
|
||||
Just indent the content to be one tab stop beyond the text of the bullet
|
||||
point. **This paragraph and the code block line up with the `m` in
|
||||
`Numbered` above.**
|
||||
Just indent the content to be the same as the first line of the bullet
|
||||
point. **This paragraph and the code block line up with the `N` in
|
||||
`Numbered` above.**
|
||||
|
||||
```bash
|
||||
ls -l
|
||||
```
|
||||
```bash
|
||||
ls -l
|
||||
```
|
||||
|
||||
- And a sub-list after some block-level content. This is at the same
|
||||
"level" as the paragraph and code block above, despite being indented
|
||||
|
@ -178,13 +175,6 @@ back-ticks (code fences) for code blocks.** This allows you to specify the
|
|||
language of the enclosed code, which enables syntax highlighting. It is also more
|
||||
predictable than using indentation.
|
||||
|
||||
{{< warning >}}
|
||||
There is one situation where you need to use indentation for code blocks: when
|
||||
the contents of the code block contain lines starting with `-` or `*` characters.
|
||||
This is due to
|
||||
[blackfriday issue #239](https://github.com/russross/blackfriday/issues/239).
|
||||
{{< /warning >}}
|
||||
|
||||
```
|
||||
this is a code block created by back-ticks
|
||||
```
|
||||
|
@ -241,7 +231,7 @@ character. The square brackets contain the image's alt text. Try to always use
|
|||
alt text so that people using screen readers can get some benefit from the
|
||||
image.
|
||||
|
||||
![pencil icon](/static/images/pencil.png)
|
||||
![pencil icon](/images/pencil.png)
|
||||
|
||||
To specify extended attributes, such as width, title, caption, etc, use the
|
||||
<a href="https://gohugo.io/content-management/shortcodes/#figure">figure shortcode</a>,
|
||||
|
@ -249,17 +239,17 @@ which is preferred to using a HTML `<img>` tag. Also, if you need the image to
|
|||
also be a hyperlink, use the `link` attribute, rather than wrapping the whole
|
||||
figure in Markdown link syntax as shown below.
|
||||
|
||||
{{< figure src="/static/images/pencil.png" title="Pencil icon" caption="Image used to illustrate the figure shortcode" width="200px" >}}
|
||||
{{< figure src="/images/pencil.png" title="Pencil icon" caption="Image used to illustrate the figure shortcode" width="200px" >}}
|
||||
|
||||
Even if you choose not to use the figure shortcode, an image can also be a link. This
|
||||
time the pencil icon links to the Kubernetes website. Outer square brackets enclose
|
||||
the entire image tag, and the link target is in the parentheses at the end.
|
||||
|
||||
[![pencil icon](/static/images/pencil.png)](https://kubernetes.io)
|
||||
[![pencil icon](/images/pencil.png)](https://kubernetes.io)
|
||||
|
||||
You can also use HTML for images, but it is not preferred.
|
||||
|
||||
<img src="/static/images/pencil.png" alt="pencil icon" />
|
||||
<img src="/images/pencil.png" alt="pencil icon" />
|
||||
|
||||
|
||||
## Tables
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 700 B After Width: | Height: | Size: 1.4 KiB |
Loading…
Reference in New Issue