CINXE.COM
HackMD Tutorial Book - HackMD
<!DOCTYPE html> <html lang="dev" data-themeable="true"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="mobile-web-app-capable" content="yes"> <meta name="description" content="Learn how to use HackMD with tutorials covering all aspects of the powerful markdown editor."> <title>HackMD Tutorial Book - HackMD</title> <link rel="icon" type="image/png" href="https://hackmd.io/favicon.png"> <link rel="apple-touch-icon" href="https://hackmd.io/apple-touch-icon.png"> <script nonce="51c3ad5b-81c8-4034-9828-564d8274ffdc"> window.domain = 'hackmd.io' window.urlpath = '' window.debug = false || window.localStorage.getItem('HMD_DEBUG_FLAG') === 'true' window.version = '1.3.0' window.brand = 'HackMD' window.GOOGLE_DRIVE_API_KEY = 'AIzaSyAHmcP5gL_64ZafuAYOvJruFAIaYgHQaY4' window.GOOGLE_DRIVE_CLIENT_ID = '65857506266-76uhhee8se8dgs1i0q8fhtj1prg0ar27.apps.googleusercontent.com' window.DROPBOX_APP_KEY = 'rdoizrlnkuha23r' window.PLANTUML_SERVER = 'https://ptuml.hackmd.io' window.ASSET_URL = 'https://assets.hackmd.io' window.USER_CAN_CREATE_TEAM = true window.USER_CAN_DELETE_ACCOUNT = true window.USER_DELETE_ACCOUNT_VIA_EMAIL = true window.PAYMENT_ENABLED = true window.PAYMENT_PROMOTION_BANNER_ENABLED = false window.GITHUB_SYNC_ENABLED = true window.GITLAB_SYNC_ENABLED = false window.GITLAB_SYNC_BASE_URL = '' window.VCS_SYNC_MODE = 'github' window.VCS_PROVIDER_NAME = 'GitHub' window.FREE_TEAM_NUM = 20 window.FREE_TEAM_MEMBER_NUM = 3 window.FREE_PUBLIC_TEAM_NUM = 10 window.NEO_OVERVIEW_UI = false window.FOLDER_ENABLE = false window.ALLOW_ANONYMOUS = true window.ALLOW_ANONYMOUS_EDIT = false window.ALLOW_DOWNLOAD_PDF = true window.PUBLIC_OVERVIEW = false window.INTERNAL_PUBLIC_OVERVIEW = false window.FULL_TEXT_SEARCH_ENABLE = false window.ALGOLIA_SEARCH_ENABLE = true window.MARKETING_EMAIL_ENABLE = true window.OFFLINE_ACCESS = true window.WALLET_CONNECT_PROJECT_ID = '91d6fa182b725b5895a17a170a5878c1' window.API_MANAGEMENT_UI_ENABLE = true window.FEEDBACK_UI_ENABLE = true window.PUBLISH_ENABLE = true window.TRASH_NOTE_DELETE_AFTER_FREE = 3 window.TRASH_NOTE_DELETE_AFTER_PAID = 30 window.IMGUR_FALLBACK_CDN = 'https://imgur-backup.hackmd.io' window.CLOUD_META_UI = true window.CLOUD_META_API = true window.CLOUD_META_MIGRATION = false window.YAML_METADATA_ENABLED = false window.NOTE_CAPACITY_LIMIT = 50 window.DOCUMENT_MAX_LENGTH = 100000 window.SOCIAL_NETWORK_FEATURES_ENABLED = true window.PUBLISHMENT_MODERATION_ENABLED = true window.SUGGEST_EDIT_ENABLED = true window.REALTIME_CLIENT_WITH_CREDENTIALS = false window.DEBUG_DISCONNECT_SOCKET_WHEN_OFFLINE = false window.USE_NEW_LOGO = true window.ITERABLE_ENABLED = true window.ITERABLE_API_KEY = "c2c36a44c2614fb19aa3b46d660bbce2" window.TEXT_SELECTION_CHANGED = false window.CAN_VIEW_HISTORY_AT_REVISION = false </script> <!-- Google Tag Manager --> <script nonce="51c3ad5b-81c8-4034-9828-564d8274ffdc">(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-KLW9Z3');</script> <!-- End Google Tag Manager --> <meta property="fb:app_id" content="1436904003272070"> <meta name="twitter:image:src" content="https://hackmd.io/_uploads/SyBv-nInC.jpg"> <meta name="twitter:image:alt" content="HackMD Tutorial Book - HackMD"> <meta name="twitter:site" content="@hackmdio" /> <meta name="twitter:card" content="summary" /> <meta name="twitter:title" content="HackMD Tutorial Book - HackMD" /> <meta name="twitter:description" content="Learn how to use HackMD with tutorials covering all aspects of the powerful markdown editor." /> <meta property="og:image" content="https://hackmd.io/_uploads/SyBv-nInC.jpg"> <meta property="og:image:alt" content="HackMD Tutorial Book - HackMD"> <meta property="og:site_name" content="HackMD" /> <meta property="og:type" content="article" /> <meta property="og:title" content="HackMD Tutorial Book - HackMD" /> <meta property="og:description" content="Learn how to use HackMD with tutorials covering all aspects of the powerful markdown editor." /> <link rel="canonical" href="https://hackmd.io/c/tutorials/%2F%40docs%2Fbasic_formatting_en" /> <meta property="og:url" content="https://hackmd.io/c/tutorials/%2F%40docs%2Fbasic_formatting_en" /> <meta property="twitter:url" content="https://hackmd.io/c/tutorials/%2F%40docs%2Fbasic_formatting_en" /> <link href="https://assets.hackmd.io/build/font-vendor.ea8218d7d4f468b2c430.css" rel="stylesheet"><link href="https://assets.hackmd.io/build/common-vendor.0a08ae20e14fefe857eb.css" rel="stylesheet"><link href="https://assets.hackmd.io/build/book-vendor.d2661e6880a181215ec1.css" rel="stylesheet"><link href="https://assets.hackmd.io/build/book.d3910ba1a84932cca719.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js" integrity="sha256-3Jy/GbSLrg0o9y5Z5n1uw0qxZECH7C6OQpVBgNFYa0g=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js" integrity="sha256-g6iAfvZp+nDQ2TdTR/VVKJf3bGro4ub5fvWSWVRi2NE=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.9/es5-shim.min.js" integrity="sha256-8E4Is26QH0bD52WoQpcB+R/tcWQtpzlCojrybUd7Mxo=" crossorigin="anonymous"></script> <![endif]--> <script defer data-domain="hackmd.io" src="https://plausible.io/js/script.js"></script> <script nonce="51c3ad5b-81c8-4034-9828-564d8274ffdc"> window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments); } const keyboardWhiteList = ['a', 'span', 'button'] function getTaggedEventAttributes (e) { const eventAttrs = { name: null, props: {} } if (!e || !e.classList) return eventAttrs const psEvent = /plausible-event-(.+)(=|--)(.+)/ for (const className of [...e.classList]) { const [, key, , val] = className.match(psEvent) || [] if (!key || !val) continue const value = val.replace(/\+/g, ' ') switch (key.toLowerCase()) { case 'name': eventAttrs.name = value break default: eventAttrs.props[key] = value break } } return eventAttrs } function isLocal () { return /^localhost$|^127(\.[0-9]+){0,2}\.[0-9]+$|^\[::1?\]$/.test(location.hostname) || location.protocol === 'file:' } function isAutomation () { return Boolean(window._phantom || window.__nightmare || window.navigator.webdriver || window.Cypress) } function shouldIgnore () { return isLocal() || isAutomation() || window.localStorage.getItem('plausible_ignore') === 'true' } function handler (e) { if (!window.plausible) return if (!e.target || !('className' in e.target)) return const ele = e.target const eventAttrs = getTaggedEventAttributes(ele) if (!eventAttrs.name) return if (ele?.href) eventAttrs.props.url = ele.href if (shouldIgnore()) { if (window.debug) logDebugEventMsg(eventAttrs) return } window.plausible(eventAttrs.name, { props: eventAttrs.props }) } function logDebugEventMsg (eventAttrs) { console.warn( `Ignoring Event: "${eventAttrs.name}"`, eventAttrs, ) } function keydownHandler (e) { if (e.key !== 'Enter') return if (e.target.nodeName.toLowerCase() === 'input') { switch (e.target.type.toLowerCase()) { case 'submit': case 'button': case 'reset': case 'checkbox': case 'radio': case 'file': case 'image': case 'color': break default: return } } else if (!keyboardWhiteList.includes(e.target.nodeName.toLowerCase())) { return } handler(e) } document.addEventListener('mousedown', handler) document.addEventListener('keydown', keydownHandler) </script> </head> <body class="ui-book-mode-body" style="display:none;"> <div id="doc" class="container markdown-body" style="display:none;" data-hard-breaks="true"> HackMD Tutorial Book === **[中文版](/c/tutorials-tw)** - [Welcome](/s/tutorials) - [Features](/s/features) Feel free to leave comments below to request for (or contribute) tutorials on certain topics. You can also leave comments below each tutorial to ask for clarifications or report bugs. If you want a quick overview of all features, visit [features](/features) New Feature 🔥 --- - [Paragraph link copy](/@docs/paragraph_link_copy_en) - [Dark Mode](/@docs/how-to-set-dark-mode-en) - [Offline Access](/@docs/offline-access-en) Introduction --- - [Registration and binding](/@docs/registration_and_binding_en) - [Choose your interface language](/@docs/interface-language-en) - [Manage profile page](/@docs/personal-profile-page-en) - [Navigation bar intro](/@docs/editor_en) - [View note directory](/@docs/view-en) - [How to edit metadata of a note](/@docs/how-to-edit-metadata-of-a-note-en) - [How to edit title and tags](/@docs/how-to-edit-title-and-tags-en) Tips for using HackMD --- - [How to use Tag List and Tag Filter](/@docs/how-to-use-tag-list-filter-en) - [How to Follow](/@docs/how-to-follow-en) - [Spotlight](/@hackmd/spotlight-en) - [Use Regular Expression to search the in text editor](/@docs/regular-expression-to-search-en) - [Tips for editing on mobile phone](/@docs/rJ5BU988A) - [Embed another note](/@docs/embed-another-note-en) - [Keyboard shortcuts](/@docs/keyboard-shortcuts) Text Editor --- - [Basic Formatting: Title, Quotation, Bold Text](/@docs/basic_formatting_en) - [Highlighting, color blocks, and collapsing](/@docs/enhance_content_en) - [Insert image in notes](/@docs/insert-image-in-team-note) - [Embed YouTube, link notes, and more](/@docs/insert-external-media-en) - [Search and replace](/@docs/search-and-replace-en) - [Emoji cheat sheet](https://github.com/ikatyang/emoji-cheat-sheet) [target=_blank] - [Changing text color](/@docs/change-text-color-en) - [How to create table](/@docs/how-to-create-table-en) - [How to paste table from Excel ](/@docs/paste-table-from-excel-en) - [Inserting code into your notes](/@docs/insert-code-into-note-en) <!-- - [Tips on Mobile](/zr2FvF_URe2HhgWddVvmdQ) --> Book Mode & Slide Mode 📍 --- - [How to create a book](/@docs/create-a-book-en) - [How to create a slide deck](/@docs/create-slides-en) Creating graphs 🖍️ --- - [How to use MathJax & UML](/@docs/use-mathjax-and-UML-en) - [How to create flowchart](/@docs/flowchart-en) - [How to create pie chart](/@docs/pie-chart-en) - [How to create Gantt chart](/@docs/gantt-chart-en) <!--Drawing musical notation --> Notes Management & Template 📚 --- - [Delete notes](/@docs/delete-note-en) - [Restore notes](/@docs/restore-notes) - [How to use template](/@docs/how-to-use-template-en) - [How to save versions](/@docs/save-version-en) - [How to export & import notes](/@docs/export-and-import-notes-en) - [How to export to PDF](/@docs/export-to-pdf-en) - [How to import from/export to Arweave](/@docs/export-import-arweave-en) - [Publish with permalink](/@docs/publish-notes-with-permalink-en) Team Workspace 🚀 --- - [What is Team?](/@docs/what-is-team) - [Create and manage Team](/@docs/create-and-manage-team) - [Manage Team notes](/@docs/manage-team-notes) - [Insert image in Team notes](/@docs/insert-image-in-team-note) - [Unlock Team member limit](/@docs/unlock-team-member-limit) - [How to Transfer Team Ownership](/@docs/transfer-team-ownership-en) Collaboration 🤝 --- - [Invite others to a private note](/@docs/invite-others-to-a-private-note-en) - [Live Host a Collaborative Session](/@docs/hosting-a-collaborative-session-en) - [Use comments to collaborate asynchronously](/@docs/comment-to-collaborate-en) - [Hide and Resolve comments](/@docs/hide-resolve-comment-en) - [How to Raise a Suggest Edit](/@docs/suggest-edit-en) Pricing and Payment 💍 --- - [Personal Prime subscription and management](/@docs/Personal-Prime-subscription-management-en) - [Subscribe to Team Prime Plan](/@docs/unlock-team-member-limit) - [FAQ about yearly payment](/@docs/yearly-payment-faq-en) - [How to apply for non-profit sponsorship?](/@docs/NPOplan) <!-- [About Personal & Team Prime plan] --> <!-- [Failed payment](/tLIgOkh7SgGLdf_b7eNagw) --> Account --- - [How to merge accounts?](/@docs/merge-accounts-en) - [How to delete my account](/@docs/delete-my-account-en) Advance Feature 🛠️ --- - [How to sync with GitHub](/@docs/sync-a-note-with-github) - [Command line tool: hackmd-cli](/@docs/hackmd-cli) - [Browser extension: HackMD-it](/@docs/browser-extension-en) - [How to turn on the feature preview](/@docs/feature-preview) API --- - [How to issue/revoke an API token?](/@docs/issue-revoke-api-token-en) - [Developer Portal](/@hackmd-api/developer-portal?utm_source=tutorial&utm_medium=book-section) [target=_blank] </div> <div id="meta" style="display: none;">{"breaks":true,"title":"HackMD Tutorial Book","description":"Learn how to use HackMD with tutorials covering all aspects of the powerful markdown editor.","image":"https://hackmd.io/_uploads/SyBv-nInC.jpg","contributors":"[{\"id\":\"9fb45a0a-ff1a-49af-9ba3-dc411256dc2b\",\"add\":2241,\"del\":1346},{\"id\":\"61af98f4-b303-4819-b08b-aa32cf6677a8\",\"add\":788,\"del\":336},{\"id\":\"b69c1c71-1f6f-41b4-b230-8f8f857d1db7\",\"add\":92,\"del\":0},{\"id\":\"3ab19145-8243-4557-8f3e-70a733b710c0\",\"add\":364,\"del\":0},{\"id\":\"7252c271-4d52-435d-b724-900478f7cef4\",\"add\":1228,\"del\":345},{\"id\":\"6d3b4625-23c8-4275-a28e-cdc2cb546eda\",\"add\":466,\"del\":49},{\"id\":\"23942b32-8d81-4d00-ae9b-702abb782e84\",\"add\":125,\"del\":32},{\"id\":\"d7bc100e-ab59-4c37-948d-734e8e215f68\",\"add\":17325,\"del\":16233},{\"id\":\"1fb5b07b-07b2-4267-92c0-d31539e3d000\",\"add\":154,\"del\":38}]"}</div> <div class="summary pl-1.5"> <div class="toolbar flex flex-row gap-1 absolute top-0 w-auto py-2 pr-1.5"> <div class="input-group-sm search flex-shrink min-w-0"> <input class=" ui-summary-search w-full text-text-default bg-background-default px-3 py-2 text-normal font-normal leading-normal rounded border border-solid border-border-default outline-none focus:outline-none placeholder:text-text-subtler focus-within:border-border-primary-subtler focus:border-border-primary-subtler " placeholder="Search title..." /> </div> <div class="btn ui-summary-action ui-summary-refresh" aria-hidden="true" title="Refresh"> <i class="ph ph-arrows-clockwise" aria-hidden="true"></i> </div> <span class="ui-summary-action-disabled ui-summary-refresh-disabled" aria-disabled="true" style="display: none" data-original-title="<span class='whitespace-pre'>Unavailable offline</span>" data-placement="bottom" data-toggle="tooltip" data-html="true" > <i class="ph ph-arrows-clockwise pointer-events-auto" aria-hidden="true"></i> </span> <a class="btn ui-summary-action ui-summary-edit" href="https://hackmd.io/tutorials" target="_blank" title="Edit"> <i class="ph ph-pencil-simple" aria-hidden="true"></i> </a> <span class="ui-summary-action-disabled ui-summary-edit-disabled" aria-disabled="true" style="display: none" data-original-title="<span class='whitespace-pre'>Unavailable offline</span>" data-placement="bottom" data-toggle="tooltip" data-html="true" > <i class="ph ph-pencil-simple pointer-events-auto" aria-hidden="true"></i> </span> <div class="btn ui-summary-action ui-summary-collapse" aria-hidden="true" title="Collapse"> <i class="ph ph-caret-double-left" aria-hidden="true"></i> </div> </div> <div id="summary"></div> </div> <div class="topbar"> <div class="btn ui-summary-action ui-summary-open p-1.5" aria-hidden="true" title="Expand""> <span class="visible-xs-inline">Expand menu </span> <i class="ph ph-caret-double-right text-lg leading-sm" aria-hidden="true"></i> </div> </div> <div class="container-mask"></div> <div class="book-container"> <div class="ui-book-spinner unselectable hidden-print"></div> </div> </body> </html> <script src="https://www.googletagmanager.com/gtag/js?id=G-NGVZMM6DR6"></script> <script nonce="51c3ad5b-81c8-4034-9828-564d8274ffdc"> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); let userid = (document.cookie.match('(^|; )userid=([^;]*)')||0)[2]; gtag('config', 'G-NGVZMM6DR6', {'user_id': userid}); </script> <script src="https://browser.sentry-cdn.com/5.15.5/bundle.min.js" crossorigin="anonymous"></script> <script nonce="51c3ad5b-81c8-4034-9828-564d8274ffdc">Sentry.init({ dsn: 'https://73410f1915d84abc8b2dd1f1aabd1c82@sentry.hackmd.dev/4', environment: 'production', integrations: function (intrus) { return intrus.filter(function (itr) { return itr.name !== 'TryCatch' }) } });</script> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KLW9Z3" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <script src="https://hackmd.io/api/i18n.js"></script> <script src="https://assets.hackmd.io/build/font-vendor.eaa8dd82d4e056021b8c.js" defer="defer"></script><script src="https://assets.hackmd.io/build/common-vendor.04da453a2a68f624f4d4.js" defer="defer"></script><script src="https://assets.hackmd.io/build/book-vendor.0d1ed3551b292832ba11.js" defer="defer"></script><script src="https://assets.hackmd.io/build/book-common.0dedbc3c06a61bcdce9e.js" defer="defer"></script><script src="https://assets.hackmd.io/build/book.35a1965729353b95f82f.js" defer="defer"></script>