曾海沥 / doc-press · 文件

转到一个项目
index.html 21.2 KB
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 
<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>文档写作平台使用入门 | 买买买文档平台</title>
    <meta name="description" content="买买买文档平台">
    <meta name="generator" content="VuePress 1.3.1">
    
    
    <link rel="preload" href="/assets/css/0.styles.fadb700b.css" as="style"><link rel="preload" href="/assets/js/app.d6c5f64b.js" as="script"><link rel="preload" href="/assets/js/2.db0c6dc7.js" as="script"><link rel="preload" href="/assets/js/7.9a01ef99.js" as="script"><link rel="prefetch" href="/assets/js/10.e7825d68.js"><link rel="prefetch" href="/assets/js/11.dc1d1ed5.js"><link rel="prefetch" href="/assets/js/12.5e70fe99.js"><link rel="prefetch" href="/assets/js/13.c8bbc7b5.js"><link rel="prefetch" href="/assets/js/14.6adca5e8.js"><link rel="prefetch" href="/assets/js/15.8f86edff.js"><link rel="prefetch" href="/assets/js/16.a777e61d.js"><link rel="prefetch" href="/assets/js/17.3b0c5f18.js"><link rel="prefetch" href="/assets/js/18.d5abf3da.js"><link rel="prefetch" href="/assets/js/19.41befede.js"><link rel="prefetch" href="/assets/js/20.e1070a8b.js"><link rel="prefetch" href="/assets/js/21.ba46fa39.js"><link rel="prefetch" href="/assets/js/22.cac934f7.js"><link rel="prefetch" href="/assets/js/23.22aa0470.js"><link rel="prefetch" href="/assets/js/24.e2d5dd9a.js"><link rel="prefetch" href="/assets/js/25.6ad8c6e9.js"><link rel="prefetch" href="/assets/js/26.c898ca98.js"><link rel="prefetch" href="/assets/js/3.7f4a682c.js"><link rel="prefetch" href="/assets/js/4.9dcb0336.js"><link rel="prefetch" href="/assets/js/5.9eb2a68c.js"><link rel="prefetch" href="/assets/js/6.a32238cc.js"><link rel="prefetch" href="/assets/js/8.f8404f83.js"><link rel="prefetch" href="/assets/js/9.bec74b06.js">
    <link rel="stylesheet" href="/assets/css/0.styles.fadb700b.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/" class="home-link router-link-active"><img src="/logo.png" alt="买买买文档平台" class="logo"> <span class="site-name can-hide">买买买文档平台</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/" class="nav-link">
  查询导览
</a></div><div class="nav-item"><a href="/product/" class="nav-link">
  项目清单
</a></div><div class="nav-item"><div class="dropdown-wrapper"><button type="button" aria-label="团队文档" class="dropdown-title"><span class="title">团队文档</span> <span class="arrow right"></span></button> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----> <a href="/team/design/" class="nav-link">
  产品设计
</a></li><li class="dropdown-item"><!----> <a href="/team/frontend/" class="nav-link">
  前端
</a></li><li class="dropdown-item"><!----> <a href="/team/ios/" class="nav-link">
  IOS
</a></li><li class="dropdown-item"><!----> <a href="/team/android/" class="nav-link">
  安卓
</a></li><li class="dropdown-item"><!----> <a href="/team/backend/" class="nav-link">
  服务端
</a></li><li class="dropdown-item"><!----> <a href="/team/quality/" class="nav-link">
  测试
</a></li></ul></div></div><div class="nav-item"><a href="/project/" class="nav-link">
  项目管控
</a></div><div class="nav-item"><a href="/adm/" class="nav-link">
  行政管理
</a></div><div class="nav-item"><a href="/util/" class="nav-link">
  协作工具
</a></div><div class="nav-item"><a href="/guide/" class="nav-link router-link-exact-active router-link-active">
  文档写作平台入门介绍
</a></div> <!----></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/" class="nav-link">
  查询导览
</a></div><div class="nav-item"><a href="/product/" class="nav-link">
  项目清单
</a></div><div class="nav-item"><div class="dropdown-wrapper"><button type="button" aria-label="团队文档" class="dropdown-title"><span class="title">团队文档</span> <span class="arrow right"></span></button> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----> <a href="/team/design/" class="nav-link">
  产品设计
</a></li><li class="dropdown-item"><!----> <a href="/team/frontend/" class="nav-link">
  前端
</a></li><li class="dropdown-item"><!----> <a href="/team/ios/" class="nav-link">
  IOS
</a></li><li class="dropdown-item"><!----> <a href="/team/android/" class="nav-link">
  安卓
</a></li><li class="dropdown-item"><!----> <a href="/team/backend/" class="nav-link">
  服务端
</a></li><li class="dropdown-item"><!----> <a href="/team/quality/" class="nav-link">
  测试
</a></li></ul></div></div><div class="nav-item"><a href="/project/" class="nav-link">
  项目管控
</a></div><div class="nav-item"><a href="/adm/" class="nav-link">
  行政管理
</a></div><div class="nav-item"><a href="/util/" class="nav-link">
  协作工具
</a></div><div class="nav-item"><a href="/guide/" class="nav-link router-link-exact-active router-link-active">
  文档写作平台入门介绍
</a></div> <!----></nav>  <ul class="sidebar-links"><li><section class="sidebar-group depth-0"><p class="sidebar-heading open"><span>文档写作平台使用入门</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/guide/#文档写作平台项目地址" class="sidebar-link">文档写作平台项目地址</a><ul class="sidebar-sub-headers"></ul></li><li><a href="/guide/#项目运行方式" class="sidebar-link">项目运行方式</a><ul class="sidebar-sub-headers"></ul></li><li><a href="/guide/#文档写作" class="sidebar-link">文档写作</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/guide/#写作方式" class="sidebar-link">写作方式</a></li><li class="sidebar-sub-header"><a href="/guide/#资源内容添加" class="sidebar-link">资源内容添加</a></li></ul></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="文档写作平台使用入门"><a href="#文档写作平台使用入门" class="header-anchor">#</a> 文档写作平台使用入门</h1> <p>介绍文档写作平台的运行方式，如何编写文档及各方面资源的内容组织</p> <h2 id="文档写作平台项目地址"><a href="#文档写作平台项目地址" class="header-anchor">#</a> 文档写作平台项目地址</h2> <p><a href="http://192.168.100.254:3000/frontend/doc-press" target="_blank" rel="noopener noreferrer">doc-press<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></p> <h2 id="项目运行方式"><a href="#项目运行方式" class="header-anchor">#</a> 项目运行方式</h2> <ol><li>安装 <code>nodejs</code>，在 <a href="http://nodejs.cn/download/" target="_blank" rel="noopener noreferrer">nodejs 官网<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a> 下载并安装<br> <em>windows 下建议下载 <code>Windows 安装包 (.msi) 64 位</code></em></li> <li>安装 <code>yarn</code>，在 <a href="https://www.yarnpkg.com/zh-Hant/docs/install#windows-stable" target="_blank" rel="noopener noreferrer">yarn 官网<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a> 下载并安装</li> <li>安装 <code>git</code>，在 <a href="https://git-scm.com/" target="_blank" rel="noopener noreferrer">git 官网<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a> 下载并安装好</li> <li>下载并安装 git 图形化工具，推荐使用的有 <a href="https://tortoisegit.org/" target="_blank" rel="noopener noreferrer">TortoiseGit<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a>、<a href="https://www.sourcetreeapp.com/" target="_blank" rel="noopener noreferrer">SourceTree<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a>、<a href="https://git-fork.com/windows" target="_blank" rel="noopener noreferrer">Fork<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li>克隆文档写作平台到本地环境</li> <li>使用命令行进入到文档写作平台目录</li> <li>运行命令 <code>yarn install</code> 安装依赖库</li> <li>运行命令 <code>yarn dev</code> 运行本地开发平台</li> <li>运行完成后，命令行界面中会提示访问地址，在浏览器中访问该地址即可开始进行写作，效果如下</li> <li>此时可开始写作，并在网页中实时预览效果</li> <li>写作完成后，将内容提交并推送到项目托管地址</li></ol> <div class="language-bash line-numbers-mode"><pre class="language-bash"><code>success <span class="token punctuation">[</span><span class="token number">16</span>:22:08<span class="token punctuation">]</span> Build 42920d finished <span class="token keyword">in</span> <span class="token number">3668</span> ms<span class="token operator">!</span>
<span class="token operator">&gt;</span> VuePress dev server listening at http://localhost:8080/
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>只进行文档写作，不希望本地运行网站服务的情况，仅需执行 <code>3、4、5、11</code> 步骤</p> <h2 id="文档写作"><a href="#文档写作" class="header-anchor">#</a> 文档写作</h2> <p>Markdown 标记语言语法</p> <ul><li><a href="https://www.w3cschool.cn/markdownyfsm/markdownyfsm-odm6256r.html" target="_blank" rel="noopener noreferrer">https://www.w3cschool.cn<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://www.markdown.cn/" target="_blank" rel="noopener noreferrer">https://www.markdown.cn/<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://markdown-zh.readthedocs.io/en/latest/" target="_blank" rel="noopener noreferrer">https://markdown-zh.readthedocs.io/en/latest/<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="http://wow.kuapp.com/markdown/" target="_blank" rel="noopener noreferrer">http://wow.kuapp.com/markdown/<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul> <p>推荐编辑器</p> <ul><li><a href="https://typora.io/" target="_blank" rel="noopener noreferrer">Typora<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://code.visualstudio.com/" target="_blank" rel="noopener noreferrer">VSCode<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul> <blockquote><p>文档写作平台项目基于 VuePress 构建，具体配置内容请查看 <a href="https://vuepress.vuejs.org/zh/" target="_blank" rel="noopener noreferrer">这里<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></p></blockquote> <h3 id="写作方式"><a href="#写作方式" class="header-anchor">#</a> 写作方式</h3> <p>文档写作平台所有编写的文档均是基于 <strong>Markdown</strong> 标记语言来编写，它的特点是使用简单的符号即可清晰地描述整个文档结构和排版，仅需要普通文本编辑器即可完成，不像 Word、Excel 等格式必须安装 Microsft Office 才可以正常使用；目前 Markdown 标记语言已经被广泛使用于国内、国际各种记事本或笔记平台、知识平台、写作平台，成为一种流行的文档编写格式，且范围不仅仅是软件行业</p> <p>在网站的内容组织上，一个目录或站点的默认访问位置是 <code>index.html</code>，这是整个互联网环境、网页服务平台、网页服务软件等组织共同形成的约定俗成的结果</p> <p>在以 Markdown 标记语言为主要格式和形式的文档平台中，大家约定俗成的默认文档为 <code>README.md</code>（注意大小写），其功能与 <code>index.html</code> 一致，可以将其理解为是一个目录或是一个文档站点的里的 <strong>首页</strong></p> <p><strong>HTML</strong></p> <p>实际上，在文档写作平台中，所有的 Markdown 文档最终会被编译为 HTML 格式的网页作为最终展现，所以在内容的编写上可以放心使用部分 HTML 标签的排版，建议是排版方面的标签，<strong>表单类型的标签请尽可能不要使用</strong>，以免出现不可预期的问题</p> <h3 id="资源内容添加"><a href="#资源内容添加" class="header-anchor">#</a> 资源内容添加</h3> <p>在文档写作过程中，除了文档描述自身，往往需要引用图片、跳转链接和文件下载等需求来丰富文档内容</p> <h4 id="资源内容说明"><a href="#资源内容说明" class="header-anchor">#</a> 资源内容说明</h4> <p>资源可分为以下两类</p> <ul><li>图片</li> <li>文档（Word、Excel、PowerPoint或其它类型文档）</li></ul> <p>其中，图片可在文档中直接显示，而其它类型文件可作为下载附件的方式挂载在文档中</p> <p>所有资源存放位置：</p> <p><code>/.vuepress/public/</code></p> <div class="custom-block danger"><p class="custom-block-title">WARNING</p> <p>注意：所有资源要求必须有序存放，例如根据业务类型、团队类型等形式分目录存放</p></div> <h4 id="资源使用方式"><a href="#资源使用方式" class="header-anchor">#</a> 资源使用方式</h4> <ul><li>图片内容</li></ul> <p>假设有一张图片存放于以下位置</p> <p><code>/.vuepress/public/logo.png</code></p> <p>那么在文档中引用该图片的方式为</p> <p><code>![logo](/logo.png)</code></p> <p>渲染结果</p> <p><img src="/logo.png" alt="logo"></p> <p>可以看到 <code>/</code> 资源引用的根位置指向了 <code>/.vuepress/public/</code></p> <div class="custom-block danger"><p class="custom-block-title">WARNING</p> <p>如果设置的图片是项目 Logo、二维码（App 或 小程序等），必须按照以下格式使用</p> <div class="language-html line-numbers-mode"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">&quot;</span>/xxx.jpg<span class="token punctuation">&quot;</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">&quot;</span>img<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br></div></div><p>图片将以 <code>150 X 150</code> 的统一规格（像素）显示</p></div> <ul><li>文档或其它</li></ul> <p>引用其它资源，区别仅为引用方式上，假设有一个文档存放于以下位置</p> <p><code>/.vuepress/public/design/file.docx</code></p> <p>该文档的引用方式为</p> <p><code>[file](/design/file.docx)</code></p> <p>根据观察可以发现，文件的引用方式与图片的引用方式上的区别仅是一个 <code>!</code>，而在描述一个链接时增加感叹号则是专用于图片显示</p> <blockquote><p>附件类型的在点击后，会直接弹出浏览器下载窗口下载该文件，所以该方式适用于与文档内容相关的附件设置</p></blockquote></div> <footer class="page-edit"><!----> <!----></footer> <!----> </main></div><div class="global-ui"><!----></div></div>
    <script src="/assets/js/app.d6c5f64b.js" defer></script><script src="/assets/js/2.db0c6dc7.js" defer></script><script src="/assets/js/7.9a01ef99.js" defer></script>
  </body>
</html>