Code snippets often used in Markdown writing, including HTML code for icons and interactive HTML code for accessibility.

UsefulSnippetsForMarkdownCreative.md

Html image tags of icons frequently used in Markdown composing

Icons

Shell Icons

<img style="float: left;" src="https://i.ibb.co/JsbTwVn/terminal.png" alt="bash-command-icon" border="0" width="64" height="64">

Attention Icons

<img style="float: left;" src="https://docs.ezmeral.hpe.com/datafabric-customer-managed/74/oxygen-webhelp/app/a4e3132304e55c477c8b.svg" alt="icon-important" border="0" width="64" height="64">

---

<img style="float: left;" src="https://docs.ezmeral.hpe.com/datafabric-customer-managed/74/oxygen-webhelp/app/7905db3e6db01ebd2b30.svg" alt="icon-note" border="0" width="64" height="64">

---

<img style="float: left;" src="https://docs.ezmeral.hpe.com/datafabric-customer-managed/74/oxygen-webhelp/app/c208bc83c7ec263265c3.svg" alt="icon-caution" border="0" width="64" height="64">

Collapse and expand the code area

❕Copyright owner: ©pierrejoubert73/markdown-details-collapsible.md

Example

Click me

Heading

1. Foo
2. Bar
   • Baz
   • Qux

Some Code

function logSomething(something) {
  console.log('Something', something);
}

Code

<details>
  <summary>Click me</summary>
  
  ### Heading
  1. Foo
  2. Bar
     * Baz
     * Qux

  ### Some Code
  ```js
  function logSomething(something) {
    console.log('Something', something);
  }
  ```
</details>

Rules (If you don't do this, your code may not work)

1. Always have an empty line after the </summary> tag
2. Always have an empty line after each </details> tag