` tags in the HTML output. For example, this input:
363 |
364 | :::text
365 | * Bird
366 | * Magic
367 |
368 | will turn into:
369 |
370 | :::html
371 |
433 |
434 |
435 | It's worth noting that it's possible to trigger an ordered list by accident, by
436 | writing something like this:
437 |
438 | :::text
439 | 1986. What a great season.
440 |
441 | In other words, a *number-period-space* sequence at the beginning of a line. To
442 | avoid this, you can backslash-escape the period:
443 |
444 | :::text
445 | 1986\. What a great season.
446 |
447 |
448 |
449 | ### Code Blocks
450 |
451 | Pre-formatted code blocks are used for writing about programming or markup
452 | source code. Rather than forming normal paragraphs, the lines of a code block
453 | are interpreted literally. Markdown wraps a code block in both `` and
454 | `` tags.
455 |
456 | To produce a code block in Markdown, simply indent every line of the block by at
457 | least 4 spaces or 1 tab. For example, given this input:
458 |
459 | :::text
460 | This is a normal paragraph:
461 |
462 | This is a code block.
463 |
464 | Markdown will generate:
465 |
466 | :::html
467 | This is a normal paragraph:
468 |
469 | This is a code block.
470 |
471 |
472 | One level of indentation -- 4 spaces or 1 tab -- is removed from each line of
473 | the code block. For example, this:
474 |
475 | :::text
476 | Here is an example of AppleScript:
477 |
478 | tell application "Foo"
479 | beep
480 | end tell
481 |
482 | will turn into:
483 |
484 | :::html
485 | Here is an example of AppleScript:
486 |
487 | tell application "Foo"
488 | beep
489 | end tell
490 |
491 |
492 | A code block continues until it reaches a line that is not indented (or the end
493 | of the article).
494 |
495 | Within a code block, ampersands (`&`) and angle brackets (`<` and `>`) are
496 | automatically converted into HTML entities. This makes it very easy to include
497 | example HTML source code using Markdown -- just paste it and indent it, and
498 | Markdown will handle the hassle of encoding the ampersands and angle brackets.
499 | For example, this:
500 |
501 | :::text
502 |
505 |
506 | will turn into:
507 |
508 | :::html
509 | <div class="footer">
510 | © 2004 Foo Corporation
511 | </div>
512 |
513 |
514 | Regular Markdown syntax is not processed within code blocks. E.g., asterisks are
515 | just literal asterisks within a code block. This means it's also easy to use
516 | Markdown to write about Markdown's own syntax.
517 |
518 |
519 |
520 | ### Horizontal Rules
521 |
522 | You can produce a horizontal rule tag (`
`) by placing three or more
523 | hyphens, asterisks, or underscores on a line by themselves. If you wish, you may
524 | use spaces between the hyphens or asterisks. Each of the following lines will
525 | produce a horizontal rule:
526 |
527 | :::text
528 | * * *
529 |
530 | ***
531 |
532 | *****
533 |
534 | - - -
535 |
536 | ---------------------------------------
537 |
538 |
539 | * * *
540 |
541 | ## Span Elements
542 |
543 | ### Links
544 |
545 | Markdown supports two style of links: *inline* and *reference*.
546 |
547 | In both styles, the link text is delimited by [square brackets].
548 |
549 | To create an inline link, use a set of regular parentheses immediately after the
550 | link text's closing square bracket. Inside the parentheses, put the URL where
551 | you want the link to point, along with an *optional* title for the link,
552 | surrounded in quotes. For example:
553 |
554 | :::text
555 | This is [an example](http://example.com/ "Title") inline link.
556 |
557 | [This link](http://example.net/) has no title attribute.
558 |
559 | Will produce:
560 |
561 | :::html
562 | This is
563 | an example inline link.
564 |
565 | This link has no
566 | title attribute.
567 |
568 | If you're referring to a local resource on the same server, you can use relative
569 | paths:
570 |
571 | :::text
572 | See my [About](/about/) page for details.
573 |
574 | Reference-style links use a second set of square brackets, inside which you
575 | place a label of your choosing to identify the link:
576 |
577 | :::text
578 | This is [an example][id] reference-style link.
579 |
580 | You can optionally use a space to separate the sets of brackets:
581 |
582 | :::text
583 | This is [an example] [id] reference-style link.
584 |
585 | Then, anywhere in the document, you define your link label like this, on a line
586 | by itself:
587 |
588 | :::text
589 | [id]: http://example.com/ "Optional Title Here"
590 |
591 | That is:
592 |
593 | * Square brackets containing the link identifier (optionally indented from the
594 | left margin using up to three spaces);
595 | * followed by a colon;
596 | * followed by one or more spaces (or tabs);
597 | * followed by the URL for the link;
598 | * optionally followed by a title attribute for the link, enclosed in double or
599 | single quotes, or enclosed in parentheses.
600 |
601 | The following three link definitions are equivalent:
602 |
603 | :::text
604 | [foo]: http://example.com/ "Optional Title Here"
605 | [foo]: http://example.com/ 'Optional Title Here'
606 | [foo]: http://example.com/ (Optional Title Here)
607 |
608 | The link URL may, optionally, be surrounded by angle brackets:
609 |
610 | :::text
611 | [id]: "Optional Title Here"
612 |
613 | You can put the title attribute on the next line and use extra spaces or tabs
614 | for padding, which tends to look better with longer URLs:
615 |
616 | :::text
617 | [id]: http://example.com/longish/path/to/resource/here
618 | "Optional Title Here"
619 |
620 | Link definitions are only used for creating links during Markdown processing,
621 | and are stripped from your document in the HTML output.
622 |
623 | Link definition names may consist of letters, numbers, spaces, and punctuation
624 | -- but they are *not* case sensitive. E.g. these two links:
625 |
626 | :::text
627 | [link text][a]
628 | [link text][A]
629 |
630 | are equivalent.
631 |
632 | The *implicit link name* shortcut allows you to omit the name of the link, in
633 | which case the link text itself is used as the name. Just use an empty set of
634 | square brackets -- e.g., to link the word "Google" to the google.com web site,
635 | you could simply write:
636 |
637 | :::text
638 | [Google][]
639 |
640 | And then define the link:
641 |
642 | :::text
643 | [Google]: http://google.com/
644 |
645 | Because link names may contain spaces, this shortcut even works for multiple
646 | words in the link text:
647 |
648 | :::text
649 | Visit [Daring Fireball][] for more information.
650 |
651 | And then define the link:
652 |
653 | :::text
654 | [Daring Fireball]: http://daringfireball.net/
655 |
656 | Link definitions can be placed anywhere in your Markdown document. I tend to put
657 | them immediately after each paragraph in which they're used, but if you want,
658 | you can put them all at the end of your document, sort of like footnotes.
659 |
660 | Here's an example of reference links in action:
661 |
662 | :::text
663 | I get 10 times more traffic from [Google] [1] than from
664 | [Yahoo] [2] or [MSN] [3].
665 |
666 | [1]: http://google.com/ "Google"
667 | [2]: http://search.yahoo.com/ "Yahoo Search"
668 | [3]: http://search.msn.com/ "MSN Search"
669 |
670 | Using the implicit link name shortcut, you could instead write:
671 |
672 | :::text
673 | I get 10 times more traffic from [Google][] than from
674 | [Yahoo][] or [MSN][].
675 |
676 | [google]: http://google.com/ "Google"
677 | [yahoo]: http://search.yahoo.com/ "Yahoo Search"
678 | [msn]: http://search.msn.com/ "MSN Search"
679 |
680 | Both of the above examples will produce the following HTML output:
681 |
682 | :::html
683 | I get 10 times more traffic from Google than from
685 | Yahoo
686 | or MSN.
687 |
688 | For comparison, here is the same paragraph written using Markdown's inline link
689 | style:
690 |
691 | :::text
692 | I get 10 times more traffic from [Google](http://google.com/ "Google")
693 | than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or
694 | [MSN](http://search.msn.com/ "MSN Search").
695 |
696 | The point of reference-style links is not that they're easier to write. The
697 | point is that with reference-style links, your document source is vastly more
698 | readable. Compare the above examples: using reference-style links, the paragraph
699 | itself is only 81 characters long; with inline-style links, it's 176 characters;
700 | and as raw HTML, it's 234 characters. In the raw HTML, there's more markup than
701 | there is text.
702 |
703 | With Markdown's reference-style links, a source document much more closely
704 | resembles the final output, as rendered in a browser. By allowing you to move
705 | the markup-related metadata out of the paragraph, you can add links without
706 | interrupting the narrative flow of your prose.
707 |
708 |
709 | ### Emphasis
710 |
711 | Markdown treats asterisks (`*`) and underscores (`_`) as indicators of emphasis.
712 | Text wrapped with one `*` or `_` will be wrapped with an HTML `` tag; double
713 | `*`'s or `_`'s will be wrapped with an HTML `` tag. E.g., this input:
714 |
715 | :::text
716 | *single asterisks*
717 |
718 | _single underscores_
719 |
720 | **double asterisks**
721 |
722 | __double underscores__
723 |
724 | will produce:
725 |
726 | :::html
727 | single asterisks
728 |
729 | single underscores
730 |
731 | double asterisks
732 |
733 | double underscores
734 |
735 | You can use whichever style you prefer; the lone restriction is that the same
736 | character must be used to open and close an emphasis span.
737 |
738 | Emphasis can be used in the middle of a word:
739 |
740 | :::text
741 | un*frigging*believable
742 |
743 | But if you surround an `*` or `_` with spaces, it'll be treated as a literal
744 | asterisk or underscore.
745 |
746 | To produce a literal asterisk or underscore at a position where it would
747 | otherwise be used as an emphasis delimiter, you can backslash escape it:
748 |
749 | :::text
750 | \*this text is surrounded by literal asterisks\*
751 |
752 |
753 |
754 | ### Code
755 |
756 | To indicate a span of code, wrap it with backtick quotes (`` ` ``). Unlike a
757 | pre-formatted code block, a code span indicates code within a normal paragraph.
758 | For example:
759 |
760 | :::text
761 | Use the `printf()` function.
762 |
763 | will produce:
764 |
765 | :::html
766 | Use the printf() function.
767 |
768 | To include a literal backtick character within a code span, you can use multiple
769 | backticks as the opening and closing delimiters:
770 |
771 | :::text
772 | ``There is a literal backtick (`) here.``
773 |
774 | which will produce this:
775 |
776 | :::html
777 | There is a literal backtick (`) here.
778 |
779 | The backtick delimiters surrounding a code span may include spaces -- one after
780 | the opening, one before the closing. This allows you to place literal backtick
781 | characters at the beginning or end of a code span:
782 |
783 | :::text
784 | A single backtick in a code span: `` ` ``
785 |
786 | A backtick-delimited string in a code span: `` `foo` ``
787 |
788 | will produce:
789 |
790 | :::html
791 | A single backtick in a code span: `
792 |
793 | A backtick-delimited string in a code span: `foo`
794 |
795 | With a code span, ampersands and angle brackets are encoded as HTML entities
796 | automatically, which makes it easy to include example HTML tags. Markdown will
797 | turn this:
798 |
799 | :::text
800 | Please don't use any `