{"data":{"mdx":{"code":{"body":"function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nconst layoutProps = {};\nreturn class MDXContent extends React.Component {\n  constructor(props) {\n    super(props);\n    this.layout = null;\n  }\n\n  render() {\n    const _this$props = this.props,\n          {\n      components\n    } = _this$props,\n          props = _objectWithoutProperties(_this$props, [\"components\"]);\n\n    return React.createElement(MDXTag, {\n      name: \"wrapper\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#overview\"\n      }\n    }, `Overview`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components,\n      parentName: \"li\"\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#philosophy\"\n      }\n    }, `Philosophy`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#html\"\n      }\n    }, `Inline HTML`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#autoescape\"\n      }\n    }, `Automatic Escaping for Special Characters`)))), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#block\"\n      }\n    }, `Block Elements`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components,\n      parentName: \"li\"\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#p\"\n      }\n    }, `Paragraphs and Line Breaks`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#header\"\n      }\n    }, `Headers`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#blockquote\"\n      }\n    }, `Blockquotes`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#list\"\n      }\n    }, `Lists`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#precode\"\n      }\n    }, `Code Blocks`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#hr\"\n      }\n    }, `Horizontal Rules`)))), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#span\"\n      }\n    }, `Span Elements`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components,\n      parentName: \"li\"\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#link\"\n      }\n    }, `Links`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#em\"\n      }\n    }, `Emphasis`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#code\"\n      }\n    }, `Code`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#img\"\n      }\n    }, `Images`)))), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#misc\"\n      }\n    }, `Miscellaneous`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components,\n      parentName: \"li\"\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#backslash\"\n      }\n    }, `Backslash Escapes`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"href\": \"#autolink\"\n      }\n    }, `Automatic Links`))))), React.createElement(MDXTag, {\n      name: \"hr\",\n      components: components\n    }), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h2\", {\n      id: \"overview\"\n    }, `Overview`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"philosophy\"\n    }, `Philosophy`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown is intended to be as easy-to-read and easy-to-write as is feasible.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Readability, however, is emphasized above all else. A Markdown-formatted\ndocument should be publishable as-is, as plain text, without looking\nlike it’s been marked up with tags or formatting instructions. While\nMarkdown’s syntax has been influenced by several existing text-to-HTML\nfilters – including `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://docutils.sourceforge.net/mirror/setext.html\"\n      }\n    }, `Setext`), `, `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://www.aaronsw.com/2002/atx/\"\n      }\n    }, `atx`), `, `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://textism.com/tools/textile/\"\n      }\n    }, `Textile`), `, `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://docutils.sourceforge.net/rst.html\"\n      }\n    }, `reStructuredText`), `,\n`, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://www.triptico.com/software/grutatxt.html\"\n      }\n    }, `Grutatext`), `, and `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://ettext.taint.org/doc/\"\n      }\n    }, `EtText`), ` – the single biggest source of\ninspiration for Markdown’s syntax is the format of plain text email.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To this end, Markdown’s syntax is comprised entirely of punctuation\ncharacters, which punctuation characters have been carefully chosen so\nas to look like what they mean. E.g., asterisks around a word actually\nlook like `, `*`, `emphasis`, `*`, `. Markdown lists look like, well, lists. Even\nblockquotes look like quoted passages of text, assuming you’ve ever\nused email.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"html\"\n    }, `Inline HTML`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown’s syntax is intended for one purpose: to be used as a\nformat for `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `writing`), ` for the web.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown is not a replacement for HTML, or even close to it. Its\nsyntax is very small, corresponding only to a very small subset of\nHTML tags. The idea is `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `not`), ` to create a syntax that makes it easier\nto insert HTML tags. In my opinion, HTML tags are already easy to\ninsert. The idea for Markdown is to make it easy to read, write, and\nedit prose. HTML is a `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `publishing`), ` format; Markdown is a `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `writing`), `\nformat. Thus, Markdown’s formatting syntax only addresses issues that\ncan be conveyed in plain text.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `For any markup that is not covered by Markdown’s syntax, you simply\nuse HTML itself. There’s no need to preface it or delimit it to\nindicate that you’re switching from Markdown to HTML; you just use\nthe tags.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The only restrictions are that block-level HTML elements – e.g. `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<div>`), `,\n`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<table>`), `, `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<pre>`), `, `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<p>`), `, etc. – must be separated from surrounding\ncontent by blank lines, and the start and end tags of the block should\nnot be indented with tabs or spaces. Markdown is smart enough not\nto add extra (unwanted) `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<p>`), ` tags around HTML block-level tags.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `For example, to add an HTML table to a Markdown article:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `This is a regular paragraph.\n\n<table>\n    <tr>\n        <td>Foo</td>\n    </tr>\n</table>\n\nThis is another regular paragraph.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Note that Markdown formatting syntax is not processed within block-level\nHTML tags. E.g., you can’t use Markdown-style `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `*emphasis*`), ` inside an\nHTML block.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Span-level HTML tags – e.g. `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<span>`), `, `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<cite>`), `, or `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<del>`), ` – can be\nused anywhere in a Markdown paragraph, list item, or header. If you\nwant, you can even use HTML tags instead of Markdown formatting; e.g. if\nyou’d prefer to use HTML `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<a>`), ` or `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<img>`), ` tags instead of Markdown’s\nlink or image syntax, go right ahead.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Unlike block-level HTML tags, Markdown syntax `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `is`), ` processed within\nspan-level tags.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"autoescape\"\n    }, `Automatic Escaping for Special Characters`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `In HTML, there are two characters that demand special treatment: `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<`), `\nand `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&`), `. Left angle brackets are used to start tags; ampersands are\nused to denote HTML entities. If you want to use them as literal\ncharacters, you must escape them as entities, e.g. `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&lt;`), `, and\n`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&amp;`), `.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Ampersands in particular are bedeviling for web writers. If you want to\nwrite about ‘AT&T’, you need to write ’`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `AT&amp;T`), `’. You even need to\nescape ampersands within URLs. Thus, if you want to link to:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `http://images.google.com/images?num=30&q=larry+bird`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `you need to encode the URL as:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `http://images.google.com/images?num=30&amp;q=larry+bird`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `in your anchor tag `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `href`), ` attribute. Needless to say, this is easy to\nforget, and is probably the single most common source of HTML validation\nerrors in otherwise well-marked-up web sites.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown allows you to use these characters naturally, taking care of\nall the necessary escaping for you. If you use an ampersand as part of\nan HTML entity, it remains unchanged; otherwise it will be translated\ninto `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&amp;`), `.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `So, if you want to include a copyright symbol in your article, you can write:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&copy;`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `and Markdown will leave it alone. But if you write:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `AT&T`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown will translate it to:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `AT&amp;T`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Similarly, because Markdown supports `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"#html\"\n      }\n    }, `inline HTML`), `, if you use\nangle brackets as delimiters for HTML tags, Markdown will treat them as\nsuch. But if you write:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `4 < 5`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown will translate it to:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `4 &lt; 5`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `However, inside Markdown code spans and blocks, angle brackets and\nampersands are `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `always`), ` encoded automatically. This makes it easy to use\nMarkdown to write about HTML code. (As opposed to raw HTML, which is a\nterrible format for writing about HTML syntax, because every single `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<`), `\nand `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&`), ` in your example code needs to be escaped.)`), React.createElement(MDXTag, {\n      name: \"hr\",\n      components: components\n    }), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h2\", {\n      id: \"block\"\n    }, `Block Elements`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"p\"\n    }, `Paragraphs and Line Breaks`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `A paragraph is simply one or more consecutive lines of text, separated\nby one or more blank lines. (A blank line is any line that looks like a\nblank line – a line containing nothing but spaces or tabs is considered\nblank.) Normal paragraphs should not be indented with spaces or tabs.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The implication of the “one or more consecutive lines of text” rule is\nthat Markdown supports “hard-wrapped” text paragraphs. This differs\nsignificantly from most other text-to-HTML formatters (including Movable\nType’s “Convert Line Breaks” option) which translate every line break\ncharacter in a paragraph into a `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<br />`), ` tag.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `When you `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `do`), ` want to insert a `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<br />`), ` break tag using Markdown, you\nend a line with two or more spaces, then type return.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Yes, this takes a tad more effort to create a `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<br />`), `, but a simplistic\n“every line break is a `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<br />`), `” rule wouldn’t work for Markdown.\nMarkdown’s email-style `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"#blockquote\"\n      }\n    }, `blockquoting`), ` and multi-paragraph `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"#list\"\n      }\n    }, `list items`), `\nwork best – and look better – when you format them with hard breaks.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"header\"\n    }, `Headers`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown supports two styles of headers, `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://docutils.sourceforge.net/mirror/setext.html\"\n      }\n    }, `Setext`), ` and `, React.createElement(MDXTag, {\n      name: \"a\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"href\": \"http://www.aaronsw.com/2002/atx/\"\n      }\n    }, `atx`), `.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Setext-style headers are “underlined” using equal signs (for first-level\nheaders) and dashes (for second-level headers). For example:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, `This is an H1\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=============`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, `This is an H2\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `-------------`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Any number of underlining `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `=`), `’s or `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `-`), `’s will work.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Atx-style headers use 1-6 hash characters at the start of the line,\ncorresponding to header levels 1-6. For example:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `#`), ` This is an H1`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `##`), ` This is an H2`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `######`), ` This is an H6`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Optionally, you may “close” atx-style headers. This is purely\ncosmetic – you can use this if you think it looks better. The\nclosing hashes don’t even need to match the number of hashes\nused to open the header. (The number of opening hashes\ndetermines the header level.) :`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `#`), ` This is an H1 `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `#`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `##`), ` This is an H2 `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `##`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `###`), ` This is an H3 `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `######`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"blockquote\"\n    }, `Blockquotes`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown uses email-style `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `>`), ` characters for blockquoting. If you’re\nfamiliar with quoting passages of text in an email message, then you\nknow how to create a blockquote in Markdown. It looks best if you hard\nwrap the text and put a `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `>`), ` before every line:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` \n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` id sem consectetuer libero luctus adipiscing.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown allows you to be lazy and only put the `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `>`), ` before the first\nline of a hard-wrapped paragraph:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,\nconsectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.\nVestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse\nid sem consectetuer libero luctus adipiscing.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Blockquotes can be nested (i.e. a blockquote-in-a-blockquote) by\nadding additional levels of `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `>`), `:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` This is the first level of quoting.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `> >`), ` This is nested blockquote.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` Back to the first level.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Blockquotes can contain other Markdown elements, including headers, lists,\nand code blocks:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `##`), ` This is a header.`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` \n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), `   This is the first list item.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `2.`), `   This is the second list item.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` \n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` Here's some example code:\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), ` \n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token blockquote punctuation\"\n      }\n    }, `>`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `     return shell_exec(\"echo $input | $markdown_script\");`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Any decent text editor should make email-style quoting easy. For\nexample, with BBEdit, you can make a selection and choose Increase\nQuote Level from the Text menu.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"list\"\n    }, `Lists`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown supports ordered (numbered) and unordered (bulleted) lists.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Unordered lists use asterisks, pluses, and hyphens – interchangably\n– as list markers:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Red\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Green\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Blue`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `is equivalent to:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `+`), `   Red\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `+`), `   Green\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `+`), `   Blue`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `and:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `-`), `   Red\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `-`), `   Green\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `-`), `   Blue`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Ordered lists use numbers followed by periods:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), `  Bird\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `2.`), `  McHale\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `3.`), `  Parish`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `It’s important to note that the actual numbers you use to mark the\nlist have no effect on the HTML output Markdown produces. The HTML\nMarkdown produces from the above list is:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `ol`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Bird`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `McHale`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Parish`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `ol`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `If you instead wrote the list in Markdown like this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), `  Bird\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), `  McHale\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), `  Parish`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `or even:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `3.`), ` Bird\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), ` McHale\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `8.`), ` Parish`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `you’d get the exact same HTML output. The point is, if you want to,\nyou can use ordinal numbers in your ordered Markdown lists, so that\nthe numbers in your source match the numbers in your published HTML.\nBut if you want to be lazy, you don’t have to.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `If you do use lazy list numbering, however, you should still start the\nlist with the number 1. At some point in the future, Markdown may support\nstarting ordered lists at an arbitrary number.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `List markers typically start at the left margin, but may be indented by\nup to three spaces. List markers must be followed by one or more spaces\nor a tab.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To make lists look nice, you can wrap items with hanging indents:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi,`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    viverra nec, fringilla in, laoreet vitae, risus.`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Donec sit amet nisl. Aliquam semper ipsum sit amet velit.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    Suspendisse id sem consectetuer libero luctus adipiscing.`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `But if you want to be lazy, you don’t have to:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\nAliquam hendrerit mi posuere lectus. Vestibulum enim wisi,\nviverra nec, fringilla in, laoreet vitae, risus.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Donec sit amet nisl. Aliquam semper ipsum sit amet velit.\nSuspendisse id sem consectetuer libero luctus adipiscing.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `If list items are separated by blank lines, Markdown will wrap the\nitems in `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<p>`), ` tags in the HTML output. For example, this input:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Bird\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Magic`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will turn into:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `ul`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Bird`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Magic`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `ul`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `But this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Bird\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Magic`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will turn into:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `ul`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Bird`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Magic`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `li`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `ul`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `List items may consist of multiple paragraphs. Each subsequent\nparagraph in a list item must be indented by either 4 spaces\nor one tab:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1.`), `  This is a list item with two paragraphs. Lorem ipsum dolor\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    sit amet, consectetuer adipiscing elit. Aliquam hendrerit`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    mi posuere lectus.`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    Vestibulum enim wisi, viverra nec, fringilla in, laoreet`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    vitae, risus. Donec sit amet nisl. Aliquam semper ipsum`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    sit amet velit.`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `2.`), `  Suspendisse id sem consectetuer libero luctus adipiscing.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `It looks nice if you indent every line of the subsequent\nparagraphs, but here again, Markdown will allow you to be\nlazy:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   This is a list item with two paragraphs.\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    This is the second paragraph in the list item. You're`), `\nonly required to indent the first line. Lorem ipsum dolor\nsit amet, consectetuer adipiscing elit.\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   Another item in the same list.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To put a blockquote within a list item, the blockquote’s `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `>`), `\ndelimiters need to be indented:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   A list item with a blockquote:\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    > This is a blockquote`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    > inside a list item.`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To put a code block within a list item, the code block needs\nto be indented `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `twice`), ` – 8 spaces or two tabs:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   A list item with a code block:\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `        <code goes here>`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `It’s worth noting that it’s possible to trigger an ordered list by\naccident, by writing something like this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `1986.`), ` What a great season.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `In other words, a `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `number-period-space`), ` sequence at the beginning of a\nline. To avoid this, you can backslash-escape the period:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `1986\\\\. What a great season.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"precode\"\n    }, `Code Blocks`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Pre-formatted code blocks are used for writing about programming or\nmarkup source code. Rather than forming normal paragraphs, the lines\nof a code block are interpreted literally. Markdown wraps a code block\nin both `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<pre>`), ` and `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<code>`), ` tags.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To produce a code block in Markdown, simply indent every line of the\nblock by at least 4 spaces or 1 tab. For example, given this input:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `This is a normal paragraph:\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    This is a code block.`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown will generate:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `This is a normal paragraph:`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `pre`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `This is a code block.\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `pre`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `One level of indentation – 4 spaces or 1 tab – is removed from each\nline of the code block. For example, this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `Here is an example of AppleScript:\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    tell application \"Foo\"`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `        beep`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    end tell`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will turn into:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Here is an example of AppleScript:`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `pre`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `tell application \"Foo\"\n    beep\nend tell\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `pre`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `A code block continues until it reaches a line that is not indented\n(or the end of the article).`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Within a code block, ampersands (`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `&`), `) and angle brackets (`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<`), ` and `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `>`), `)\nare automatically converted into HTML entities. This makes it very\neasy to include example HTML source code using Markdown – just paste\nit and indent it, and Markdown will handle the hassle of encoding the\nampersands and angle brackets. For example, this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    <div class=\"footer\">`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `        &copy; 2004 Foo Corporation`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    </div>`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will turn into:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `pre`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"<\"\n      }\n    }, `&lt;`), `div class=\"footer\"`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \">\"\n      }\n    }, `&gt;`), `\n    `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"&\"\n      }\n    }, `&amp;`), `copy; 2004 Foo Corporation\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"<\"\n      }\n    }, `&lt;`), `/div`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \">\"\n      }\n    }, `&gt;`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `pre`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Regular Markdown syntax is not processed within code blocks. E.g.,\nasterisks are just literal asterisks within a code block. This means\nit’s also easy to use Markdown to write about Markdown’s own syntax.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"hr\"\n    }, `Horizontal Rules`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `You can produce a horizontal rule tag (`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<hr />`), `) by placing three or\nmore hyphens, asterisks, or underscores on a line by themselves. If you\nwish, you may use spaces between the hyphens or asterisks. Each of the\nfollowing lines will produce a horizontal rule:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token hr punctuation\"\n      }\n    }, `* * *`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token hr punctuation\"\n      }\n    }, `***`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token hr punctuation\"\n      }\n    }, `*****`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token hr punctuation\"\n      }\n    }, `- - -`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token hr punctuation\"\n      }\n    }, `---------------------------------------`)))), React.createElement(MDXTag, {\n      name: \"hr\",\n      components: components\n    }), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h2\", {\n      id: \"span\"\n    }, `Span Elements`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"link\"\n    }, `Links`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown supports two style of links: `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `inline`), ` and `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `reference`), `.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `In both styles, the link text is delimited by `, `[square brackets]`, `.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To create an inline link, use a set of regular parentheses immediately\nafter the link text’s closing square bracket. Inside the parentheses,\nput the URL where you want the link to point, along with an `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `optional`), `\ntitle for the link, surrounded in quotes. For example:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `This is `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[an example](http://example.com/ `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Title\"`), `)`), ` inline link.\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[This link](http://example.net/)`), ` has no title attribute.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Will produce:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `This is `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `http://example.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `title`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `Title`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\nan example`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), ` inline link.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `http://example.net/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `This link`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), ` has no\ntitle attribute.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `If you’re referring to a local resource on the same server, you can\nuse relative paths:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `See my `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[About](/about/)`), ` page for details.   `))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Reference-style links use a second set of square brackets, inside\nwhich you place a label of your choosing to identify the link:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `This is `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[an example][`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), `]`), ` reference-style link.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `You can optionally use a space to separate the sets of brackets:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `This is `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[an example] [`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), `]`), ` reference-style link.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Then, anywhere in the document, you define your link label like this,\non a line by itself:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://example.com/  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Optional Title Here\"`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `That is:`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `Square brackets containing the link identifier (optionally\nindented from the left margin using up to three spaces);`), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `followed by a colon;`), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `followed by one or more spaces (or tabs);`), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `followed by the URL for the link;`), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `optionally followed by a title attribute for the link, enclosed\nin double or single quotes, or enclosed in parentheses.`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The following three link definitions are equivalent:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `foo`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://example.com/  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Optional Title Here\"`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `foo`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://example.com/  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `'Optional Title Here'`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `foo`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://example.com/  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `(Optional Title Here)`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"strong\",\n      components: components,\n      parentName: \"p\"\n    }, `Note:`), ` There is a known bug in Markdown.pl 1.0.1 which prevents\nsingle quotes from being used to delimit link titles.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The link URL may, optionally, be surrounded by angle brackets:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `http://example.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`), `  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Optional Title Here\"`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `You can put the title attribute on the next line and use extra spaces\nor tabs for padding, which tends to look better with longer URLs:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://example.com/longish/path/to/resource/here`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `    \"Optional Title Here\"`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Link definitions are only used for creating links during Markdown\nprocessing, and are stripped from your document in the HTML output.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Link definition names may consist of letters, numbers, spaces, and\npunctuation – but they are `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `not`), ` case sensitive. E.g. these two\nlinks:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[link text][`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `a`), `]`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[link text][`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `A`), `]`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `are equivalent.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `implicit link name`), ` shortcut allows you to omit the name of the\nlink, in which case the link text itself is used as the name.\nJust use an empty set of square brackets – e.g., to link the word\n“Google” to the google.com web site, you could simply write:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Google][]`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `And then define the link:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `Google`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://google.com/`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Because link names may contain spaces, this shortcut even works for\nmultiple words in the link text:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `Visit `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Daring Fireball][]`), ` for more information.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `And then define the link:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `Daring Fireball`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://daringfireball.net/`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Link definitions can be placed anywhere in your Markdown document. I\ntend to put them immediately after each paragraph in which they’re\nused, but if you want, you can put them all at the end of your\ndocument, sort of like footnotes.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Here’s an example of reference links in action:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `I get 10 times more traffic from `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Google] [`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `1`), `]`), ` than from\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Yahoo] [`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `2`), `]`), ` or `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[MSN] [`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `3`), `]`), `.\n\n  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `1`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://google.com/        `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Google\"`)), `\n  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `2`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://search.yahoo.com/  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Yahoo Search\"`)), `\n  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `3`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://search.msn.com/    `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"MSN Search\"`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Using the implicit link name shortcut, you could instead write:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `I get 10 times more traffic from `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Google][]`), ` than from\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Yahoo][]`), ` or `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[MSN][]`), `.\n\n  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `google`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` http://google.com/        `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Google\"`)), `\n  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `yahoo`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), `  http://search.yahoo.com/  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Yahoo Search\"`)), `\n  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `msn`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), `    http://search.msn.com/    `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"MSN Search\"`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Both of the above examples will produce the following HTML output:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `I get 10 times more traffic from `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `http://google.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `title`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `Google`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Google`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), ` than from\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `http://search.yahoo.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `title`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `Yahoo Search`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Yahoo`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\nor `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `http://search.msn.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `title`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `MSN Search`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `MSN`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `For comparison, here is the same paragraph written using\nMarkdown’s inline link style:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `I get 10 times more traffic from `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Google](http://google.com/ `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Google\"`), `)`), `\nthan from `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[Yahoo](http://search.yahoo.com/ `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Yahoo Search\"`), `)`), ` or\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `[MSN](http://search.msn.com/ `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"MSN Search\"`), `)`), `.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The point of reference-style links is not that they’re easier to\nwrite. The point is that with reference-style links, your document\nsource is vastly more readable. Compare the above examples: using\nreference-style links, the paragraph itself is only 81 characters\nlong; with inline-style links, it’s 176 characters; and as raw HTML,\nit’s 234 characters. In the raw HTML, there’s more markup than there\nis text.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `With Markdown’s reference-style links, a source document much more\nclosely resembles the final output, as rendered in a browser. By\nallowing you to move the markup-related metadata out of the paragraph,\nyou can add links without interrupting the narrative flow of your\nprose.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"em\"\n    }, `Emphasis`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown treats asterisks (`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `*`), `) and underscores (`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `_`), `) as indicators of\nemphasis. Text wrapped with one `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `*`), ` or `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `_`), ` will be wrapped with an\nHTML `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<em>`), ` tag; double `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `*`), `’s or `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `_`), `’s will be wrapped with an HTML\n`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<strong>`), ` tag. E.g., this input:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token italic\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `*`), `single asterisks`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `*`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token italic\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `_`), `single underscores`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `_`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token bold\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `**`), `double asterisks`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `**`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token bold\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `__`), `double underscores`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `__`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will produce:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `em`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `single asterisks`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `em`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `em`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `single underscores`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `em`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `strong`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `double asterisks`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `strong`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `strong`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `double underscores`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `strong`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `You can use whichever style you prefer; the lone restriction is that\nthe same character must be used to open and close an emphasis span.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Emphasis can be used in the middle of a word:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `un`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token italic\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `*`), `frigging`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `*`)), `believable`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `But if you surround an `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `*`), ` or `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `_`), ` with spaces, it’ll be treated as a\nliteral asterisk or underscore.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To produce a literal asterisk or underscore at a position where it\nwould otherwise be used as an emphasis delimiter, you can backslash\nescape it:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `\\\\*this text is surrounded by literal asterisks\\\\*`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"code\"\n    }, `Code`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To indicate a span of code, wrap it with backtick quotes (`, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `\\``), `).\nUnlike a pre-formatted code block, a code span indicates code within a\nnormal paragraph. For example:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `Use the `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`printf()\\``), ` function.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will produce:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Use the `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `printf()`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), ` function.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `To include a literal backtick character within a code span, you can use\nmultiple backticks as the opening and closing delimiters:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`\\`There is a literal backtick (\\`) here.\\`\\``)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `which will produce this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, `    `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `There is a literal backtick (\\`) here.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The backtick delimiters surrounding a code span may include spaces –\none after the opening, one before the closing. This allows you to place\nliteral backtick characters at the beginning or end of a code span:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `A single backtick in a code span: `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`\\` \\` \\`\\``), `\n\nA backtick-delimited string in a code span: `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`\\` \\`foo\\` \\`\\``)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `will produce:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `A single backtick in a code span: `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\\``, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `A backtick-delimited string in a code span: `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `\\`foo\\``, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `With a code span, ampersands and angle brackets are encoded as HTML\nentities automatically, which makes it easy to include example HTML\ntags. Markdown will turn this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `Please don't use any `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`<blink>\\``), ` tags.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `into:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `Please don't use any `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"<\"\n      }\n    }, `&lt;`), `blink`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \">\"\n      }\n    }, `&gt;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), ` tags.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `You can write this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`&#8212;\\``), ` is the decimal-encoded equivalent of `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token code keyword\"\n      }\n    }, `\\`&mdash;\\``), `.`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `to produce:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"&\"\n      }\n    }, `&amp;`), `#8212;`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), ` is the decimal-encoded\nequivalent of `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"&\"\n      }\n    }, `&amp;`), `mdash;`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `code`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `.`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `p`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"img\"\n    }, `Images`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Admittedly, it’s fairly difficult to devise a “natural” syntax for\nplacing images into a plain text document format.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown uses an image syntax that is intended to resemble the syntax\nfor links, allowing for two styles: `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `inline`), ` and `, React.createElement(MDXTag, {\n      name: \"em\",\n      components: components,\n      parentName: \"p\"\n    }, `reference`), `.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Inline image syntax looks like this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `![Alt text](/path/to/img.jpg)`), `\n\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `![Alt text](/path/to/img.jpg `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Optional title\"`), `)`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `That is:`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `An exclamation mark: `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `!`), `;`), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `followed by a set of square brackets, containing the `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `alt`), `\nattribute text for the image;`), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, `followed by a set of parentheses, containing the URL or path to\nthe image, and an optional `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"li\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `title`), ` attribute enclosed in double\nor single quotes.`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Reference-style image syntax looks like this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url\"\n      }\n    }, `![Alt text][`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), `]`)))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Where “id” is the name of a defined image reference. Image references\nare defined using syntax identical to link references:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token url-reference url\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `[`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token variable\"\n      }\n    }, `id`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `]`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `:`), ` url/to/image  `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token string\"\n      }\n    }, `\"Optional title attribute\"`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `As of this writing, Markdown has no syntax for specifying the\ndimensions of an image; if this is important to you, you can simply\nuse regular HTML `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<img>`), ` tags.`), React.createElement(MDXTag, {\n      name: \"hr\",\n      components: components\n    }), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h2\", {\n      id: \"misc\"\n    }, `Miscellaneous`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"autolink\"\n    }, `Automatic Links`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown supports a shortcut style for creating “automatic” links for URLs and email addresses: simply surround the URL or email address with angle brackets. What this means is that if you want to show the actual text of a URL or email address, and also have it be a clickable link, you can do this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `<http://example.com/>`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown will turn this into:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), `http://example.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), `http://example.com/`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Automatic links for email addresses work similarly, except that\nMarkdown will also perform a bit of randomized decimal and hex\nentity-encoding to help obscure your address from address-harvesting\nspambots. For example, Markdown will turn this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `address@example.com`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `into something like this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markup\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `<`), `a`), ` `, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-name\"\n      }\n    }, `href`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token attr-value\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `=`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"m\"\n      }\n    }, `&#x6D;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"a\"\n      }\n    }, `&#x61;`), `i`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"l\"\n      }\n    }, `&#x6C;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"t\"\n      }\n    }, `&#x74;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"o\"\n      }\n    }, `&#x6F;`), `:`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"a\"\n      }\n    }, `&#x61;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"d\"\n      }\n    }, `&#x64;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"d\"\n      }\n    }, `&#x64;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"r\"\n      }\n    }, `&#x72;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"e\"\n      }\n    }, `&#x65;`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"s\"\n      }\n    }, `&#115;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"s\"\n      }\n    }, `&#115;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"@\"\n      }\n    }, `&#64;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"e\"\n      }\n    }, `&#101;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"x\"\n      }\n    }, `&#120;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"a\"\n      }\n    }, `&#x61;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"m\"\n      }\n    }, `&#109;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"p\"\n      }\n    }, `&#x70;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"l\"\n      }\n    }, `&#x6C;`), `e`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \".\"\n      }\n    }, `&#x2E;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"c\"\n      }\n    }, `&#99;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"o\"\n      }\n    }, `&#111;`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"m\"\n      }\n    }, `&#109;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `\"`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`)), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"a\"\n      }\n    }, `&#x61;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"d\"\n      }\n    }, `&#x64;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"d\"\n      }\n    }, `&#x64;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"r\"\n      }\n    }, `&#x72;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"e\"\n      }\n    }, `&#x65;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"s\"\n      }\n    }, `&#115;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"s\"\n      }\n    }, `&#115;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"@\"\n      }\n    }, `&#64;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"e\"\n      }\n    }, `&#101;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"x\"\n      }\n    }, `&#120;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"a\"\n      }\n    }, `&#x61;`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"m\"\n      }\n    }, `&#109;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"p\"\n      }\n    }, `&#x70;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"l\"\n      }\n    }, `&#x6C;`), `e`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \".\"\n      }\n    }, `&#x2E;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"c\"\n      }\n    }, `&#99;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"o\"\n      }\n    }, `&#111;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token entity\",\n        \"title\": \"m\"\n      }\n    }, `&#109;`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token tag\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `</`), `a`), React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `>`))))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `which will render in a browser as a clickable link to “address@example.com”.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `(This sort of entity-encoding trick will indeed fool many, if not\nmost, address-harvesting bots, but it definitely won’t fool all of\nthem. It’s better than nothing, but an address published in this way\nwill probably eventually start receiving spam.)`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, React.createElement(\"h3\", {\n      id: \"backslash\"\n    }, `Backslash Escapes`)), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown allows you to use backslash escapes to generate literal\ncharacters which would otherwise have special meaning in Markdown’s\nformatting syntax. For example, if you wanted to surround a word\nwith literal asterisks (instead of an HTML `, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"p\",\n      props: {\n        \"className\": \"language-text\"\n      }\n    }, `<em>`), ` tag), you can use\nbackslashes before the asterisks, like this:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `\\\\*literal asterisks\\\\*`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Markdown provides backslash escapes for the following characters:`), React.createElement(MDXTag, {\n      name: \"div\",\n      components: components,\n      props: {\n        \"className\": \"gatsby-highlight\",\n        \"data-language\": \"markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"pre\",\n      components: components,\n      parentName: \"div\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"code\",\n      components: components,\n      parentName: \"pre\",\n      props: {\n        \"className\": \"language-markdown\"\n      }\n    }, `\\\\   backslash\n\\`   backtick\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `*`), `   asterisk\n_   underscore\n{}  curly braces\n[]  square brackets\n()  parentheses\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token title important\"\n      }\n    }, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"span\",\n      props: {\n        \"className\": \"token punctuation\"\n      }\n    }, `#`), `   hash mark`), `\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `+`), `\tplus sign\n`, React.createElement(MDXTag, {\n      name: \"span\",\n      components: components,\n      parentName: \"code\",\n      props: {\n        \"className\": \"token list punctuation\"\n      }\n    }, `-`), `\tminus sign (hyphen)\n.   dot\n!   exclamation mark`))));\n  }\n\n}\nMDXContent.isMDXComponent = true;"},"frontmatter":{"date":"November 7, 2017","path":"/content/markdown-syntax/","title":"Markdown Syntax"}}},"pageContext":{}}