diff --git a/examples/blog/src/content/blog/markdown-style-guide.md b/examples/blog/src/content/blog/markdown-style-guide.md index e7cede3d35..e8ba6c03fe 100644 --- a/examples/blog/src/content/blog/markdown-style-guide.md +++ b/examples/blog/src/content/blog/markdown-style-guide.md @@ -31,18 +31,44 @@ Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sap ## Images -![This is a placeholder image description](/blog-placeholder-1.jpg) +#### Syntax + +```markdown +![Alt text](./full/or/relative/path/of/image) +``` + +#### Output + +![blog placeholder](../../../public/blog-placeholder-about.jpg) ## Blockquotes The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations. -#### Blockquote without attribution +### Blockquote without attribution + +#### Syntax + +```markdown +> Tiam, ad mint andaepu dandae nostion secatur sequo quae. +> **Note** that you can use _Markdown syntax_ within a blockquote. +``` + +#### Output > Tiam, ad mint andaepu dandae nostion secatur sequo quae. > **Note** that you can use _Markdown syntax_ within a blockquote. -#### Blockquote with attribution +### Blockquote with attribution + +#### Syntax + +```markdown +> Don't communicate by sharing memory, share memory by communicating.
+> — Rob Pike[^1] +``` + +#### Output > Don't communicate by sharing memory, share memory by communicating.
> — Rob Pike[^1] @@ -51,12 +77,43 @@ The blockquote element represents content that is quoted from another source, op ## Tables +#### Syntax + +```markdown +| Italics | Bold | Code | +| --------- | -------- | ------ | +| _italics_ | **bold** | `code` | + +``` + +#### Output + | Italics | Bold | Code | | --------- | -------- | ------ | | _italics_ | **bold** | `code` | ## Code Blocks +#### Syntax + +we can use 3 backticks ``` in new line and write snippet and close with 3 backticks on new line and to highlight language specific syntac, write one word of language name after first 3 backticks, for eg. html, javascript, css, markdown, typescript, txt, bash + +````markdown + ```html + + + + + Example HTML5 Document + + +

Test

+ + + ``` +```` +Output + ```html @@ -72,19 +129,53 @@ The blockquote element represents content that is quoted from another source, op ## List Types -#### Ordered List +### Ordered List + +#### Syntax + +```markdown +1. First item +2. Second item +3. Third item +``` + +#### Output 1. First item 2. Second item 3. Third item -#### Unordered List +### Unordered List + +#### Syntax + +```markdown +- List item +- Another item +- And another item +``` + +#### Output - List item - Another item - And another item -#### Nested list +### Nested list + +#### Syntax + +```markdown +- Fruit + - Apple + - Orange + - Banana +- Dairy + - Milk + - Cheese +``` + +#### Output - Fruit - Apple @@ -96,6 +187,22 @@ The blockquote element represents content that is quoted from another source, op ## Other Elements — abbr, sub, sup, kbd, mark +#### Syntax + +```markdown +GIF is a bitmap image format. + +H2O + +Xn + Yn = Zn + +Press CTRL+ALT+Delete to end the session. + +Most salamanders are nocturnal, and hunt for insects, worms, and other small creatures. +``` + +#### Output + GIF is a bitmap image format. H2O