商城首页欢迎来到中国正版软件门户

您的位置:首页 >VSCode快速生成HTML骨架_Emmet语法的高级使用技巧

VSCode快速生成HTML骨架_Emmet语法的高级使用技巧

  发布于2026-04-24 阅读(0)

扫一扫,手机访问

Emmet缩写不生效?检查VSCode的文件关联和触发设置

VSCode快速生成HTML骨架_Emmet语法的高级使用技巧

Emmet缩写不生效?检查VSCode的文件关联和触发设置

很多开发者都遇到过这个情况:在VSCode里敲下经典的!+Tab,却毫无反应。问题出在哪?其实,Emmet默认只对htmlhtmjsxtsx等特定文件类型生效。如果你正在编辑.vue.svelte这类文件,第一步就该看看右下角的状态栏——当前语言模式如果显示“Plain Text”或其他非HTML模式,Emmet自然无法识别。手动点开语言标签,切换成HTML或对应的模板语言,往往就能解决问题。

另一个常见的“拦路虎”是触发键被占用。VSCode默认用Tab键来展开Emmet缩写,但如果你安装了某些插件(比如Auto Rename Tag),或者自定义过keybindings.jsonTab键的功能就可能被覆盖。这时候,可以尝试一个诊断方法:按下Ctrl+Shift+P打开命令面板,输入Emmet: Expand Abbreviation并执行。如果命令能正常展开缩写,那就证明语法本身没问题,只是触发方式需要调整。

  • 确保旧版设置中的"emerald.emmet": true未被禁用(新版本VSCode已内置Emmet,此项通常无需理会)。
  • 检查settings.json中是否存在"emerald.triggerExpansionOnTab": false这类显式关闭Tab触发的配置项。
  • 记住,!+Tab必须在空行或行首使用;如果前面有空格或其他字符,Emmet会直接忽略它。

快速生成带语义结构的HTML骨架:不只是!

说起Emmet,!确实是入门第一课,它能快速生成一个基础的HTML5文档骨架。但你知道吗?!仅仅是html:5这个缩写的别名。真正体现效率的,是组合使用各种操作符来构建复杂结构。比如,你需要一个包含头部导航、主内容区和页脚的页面结构,只需输入:

html:5>head+na v+main+footer

按下回车,一个完整的HTML结构瞬间生成,连里的</code>占位符都准备好了。这里的秘诀在于操作符:<code>></code>用于创建子元素,<code>+</code>用于创建同级元素,<code>^</code>则能让元素跳出当前嵌套层级,回到上一级。</p> <p><span>立即学习</span>“前端免费学习笔记(深入)”;</p> <ul> <li><code>section>h2{标题}+p{段落}*3</code> → 生成一个带标题和3个段落文字的<code>section</code>区块。</li> <li><code>ul>li.item$*5</code> → 生成一个无序列表,包含5个类名依次为<code>item1</code>到<code>item5</code>的列表项,自动编号功能非常省心。</li> <li><code>div.container>(header>h1)+main+footer</code> → 生成一个带<code>container</code>类名的<code>div</code>,内部按顺序包含带<code>h1</code>的<code>header</code>、<code>main</code>和<code>footer</code>。</li> </ul> <h3>动态属性与内容填充:用<code>{}</code>和<code>[]</code>减少手动编辑</h3> <p>厌倦了反复敲打<code>class</code>、<code>id</code>这些属性?Emmet允许你在缩写中直接声明它们。看这个例子:</p> <pre class="brush:php;toolbar:false;">div#app.container[data-id="123"]{Vue App}</pre> <p>展开后,你会得到:<code><div id="app" class="container" data-id="123">Vue App</div></code>。这里有几个关键规则:<code>{}</code>大括号用来包裹元素的文本内容,<code>[]</code>中括号则用来定义属性键值对,键和值之间用等号连接,并且属性值必须加上引号。</p> <ul> <li>当属性值包含空格时,必须使用单引号或双引号包裹,否则解析会失败(例如<code>[data-role=main]</code>可行,但<code>[data-role=main na v]</code>不行)。</li> <li><code>{}</code>里的内容支持简单的变量替换,比如<code>span{Item $}*3</code>会生成<code>Item 1</code>、<code>Item 2</code>、<code>Item 3</code>。</li> <li>需要注意,<code>{}</code>里只适合放置纯文本内容,不要试图在里面写复杂的HTML标签;嵌套结构请务必使用<code>></code>操作符来完成。</li> </ul> <h3>在非HTML文件中启用Emmet:比如Markdown或CSS里的快捷片段</h3> <p>别把Emmet局限在HTML里。它的能力范围要广得多。在<code>.md</code>Markdown文件中,输入<code>ul>li*3</code>并按<code>Tab</code>,它会自动生成Markdown格式的列表(以<code>- </code>开头)。在<code>.css</code>样式文件里,<code>m10</code>会展开为<code>margin: 10px;</code>,<code>bgc#f00</code>则会变成<code>background-color: #f00;</code>。这些功能依赖于VSCode对不同语言文件的Emmet支持配置。</p> <ul> <li>通常,新版VSCode已为常见语言内置了支持,无需额外配置。但如果失效,可以检查<code>settings.json</code>中是否有针对特定语言的变量设置(例如旧版中的<code>"emerald.variables": { "lang": "markdown" }</code>)。</li> <li>CSS中有大量实用缩写:<code>bd1s#000</code> → <code>border: 1px solid #000;</code>,<code>fw700</code> → <code>font-weight: 700;</code>。</li> <li>在Markdown中,<code>a[href=]{link}</code>会展开为<code>[link](href)</code>,但务必注意所有括号和符号都需使用英文半角格式。</li> </ul> <p>最后提醒一个最容易被忽略的细节:Emmet的CSS缩写只在<code><style></code>标签内部或纯粹的<code>.css</code>文件中生效。如果你在<code><script></code>标签里输入<code>dn</code>,它可不会变成<code>display: none</code>——Emmet严格遵循当前光标所在的语言上下文。 </div> <div class="laiyuan"> 本文转载于:https://www.php.cn/faq/2317114.html 如有侵犯,请联系zhengruancom@outlook.com删除。<br/>免责声明:正软商城发布此文仅为传递信息,不代表正软商城认同其观点或证实其描述。 </div> <div class="zrSypBox"> <p>上一篇:<a href="https://www.zhengruan.com/news/629064" title="Linux环境下Golang如何进行代码调试" class="aRed">Linux环境下Golang如何进行代码调试</a></p> <p class="right">下一篇:<a href="https://www.zhengruan.com/news/629066" title="Golang在Linux中如何实现安全性" class="aRed">Golang在Linux中如何实现安全性</a></p> <div class="clear"></div> </div> <div class="zrDtxwBox"> <div class="zrByddTitle"> <span><h2>产品推荐</h2></span> </div> <ul class="zrTxdmList3"> <li class="one"> <div class="zrTxdmCont5"> <div class="zrTxdmImg4 dianji"> <a href="https://www.zhengruan.com/product/69" class="img"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/cd14258f0172a172f8a80798c38c1577.jpg" alt="DAEMON Tools Lite 10"></a> <span class="xianshi"> <p>售后无忧</p> <em><a href="https://www.zhengruan.com/product/69" title="立即购买>">立即购买></a></em> </span> </div> <div class="zrTxdmIn4"> <dl> <dt><a href="https://www.zhengruan.com/product/69" title="DAEMON Tools Lite 10【序列号终身授权 + 中文版 + Win】" class="aBlack">DAEMON Tools Lite 10【序列号终身授权 + 中文版 + Win】</a></dt> <dd> <span>¥150.00</span> <p>office旗舰店</p> </dd> </dl> </div> </div> </li> <li > <div class="zrTxdmCont5"> <div class="zrTxdmImg4 dianji"> <a href="https://www.zhengruan.com/product/67" class="img"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/fbf473d4d30833324962e441c0f18265.jpg" alt="DAEMON Tools Ultra 5"></a> <span class="xianshi"> <p>售后无忧</p> <em><a href="https://www.zhengruan.com/product/67" title="立即购买>">立即购买></a></em> </span> </div> <div class="zrTxdmIn4"> <dl> <dt><a href="https://www.zhengruan.com/product/67" title="DAEMON Tools Ultra 5【序列号终身授权 + 中文版 + Win】" class="aBlack">DAEMON Tools Ultra 5【序列号终身授权 + 中文版 + Win】</a></dt> <dd> <span>¥198.00</span> <p>office旗舰店</p> </dd> </dl> </div> </div> </li> <li > <div class="zrTxdmCont5"> <div class="zrTxdmImg4 dianji"> <a href="https://www.zhengruan.com/product/68" class="img"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/1ae250399abf4ff584d86d52c79b5bb6.jpg" alt="DAEMON Tools Pro 8"></a> <span class="xianshi"> <p>售后无忧</p> <em><a href="https://www.zhengruan.com/product/68" title="立即购买>">立即购买></a></em> </span> </div> <div class="zrTxdmIn4"> <dl> <dt><a href="https://www.zhengruan.com/product/68" title="DAEMON Tools Pro 8【序列号终身授权 + 中文版 + Win】" class="aBlack">DAEMON Tools Pro 8【序列号终身授权 + 中文版 + Win】</a></dt> <dd> <span>¥189.00</span> <p>office旗舰店</p> </dd> </dl> </div> </div> </li> <li > <div class="zrTxdmCont5"> <div class="zrTxdmImg4 dianji"> <a href="https://www.zhengruan.com/product/29" class="img"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/77d3c04866e1b842d9b6ff0e9368bdf8.jpg" alt="CorelDRAW X8 简体中文"></a> <span class="xianshi"> <p>售后无忧</p> <em><a href="https://www.zhengruan.com/product/29" title="立即购买>">立即购买></a></em> </span> </div> <div class="zrTxdmIn4"> <dl> <dt><a href="https://www.zhengruan.com/product/29" title="CorelDRAW X8 简体中文【标准版 + Win】" class="aBlack">CorelDRAW X8 简体中文【标准版 + Win】</a></dt> <dd> <span>¥1788.00</span> <p>office旗舰店</p> </dd> </dl> </div> </div> </li> <div class="clear"></div> </ul> </div> </div> <ul class="zrZbrjList" style="padding-top:10px;"> <li> <a href="https://www.zhengruan.com/news/629232" class="img1" title="CentOS环境下Node.js的日志管理"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20260424/177700107937697.webp" alt="CentOS环境下Node.js的日志管理"> <span>正版软件</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/629232" title="CentOS环境下Node.js的日志管理" class="aBlack">CentOS环境下Node.js的日志管理</a></dt> <dd class="cont1">CentOS环境下Node.js日志管理 在服务器上跑Node.js应用,日志管理这事儿,说大不大,说小不小。处理好了,它是你排查问题的“火眼金睛”;处理不好,它就是一堆散落各处、难以查找的“数据垃圾”。今天,我们就来聊聊在CentOS环境下,如何搭建一套既专业又高效的Node.js日志管理体系。 </dd> <dd class="cont2"> <!--<span class="cont1"><img src="zrimages/example/img10.png"/>山外的鸭子哥</span>--> <span class="cont2"><b></b>5分钟前</span> <span class="cont4"><b></b>0</span> </dd> </dl> </li> <li> <a href="https://www.zhengruan.com/news/629231" class="img1" title="怎样在CentOS上安装多个Python版本"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20260424/177700107367486.webp" alt="怎样在CentOS上安装多个Python版本"> <span>正版软件</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/629231" title="怎样在CentOS上安装多个Python版本" class="aBlack">怎样在CentOS上安装多个Python版本</a></dt> <dd class="cont1">在CentOS上安装多个Python版本:一份实战指南 对于需要在CentOS服务器上同时运行不同Python项目的开发者来说,管理多个Python版本是项必备技能。系统自带的Python版本往往比较陈旧,而新项目又可能依赖更新的特性,这就需要在同一台机器上搭建多版本环境。别担心,这事儿其实没想象中</dd> <dd class="cont2"> <!--<span class="cont1"><img src="zrimages/example/img10.png"/>山外的鸭子哥</span>--> <span class="cont2"><b></b>5分钟前</span> <span class="cont4"><b></b>0</span> </dd> </dl> </li> <li> <a href="https://www.zhengruan.com/news/629230" class="img1" title="Python在CentOS上的安装路径是哪里"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20260424/177700106765950.webp" alt="Python在CentOS上的安装路径是哪里"> <span>正版软件</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/629230" title="Python在CentOS上的安装路径是哪里" class="aBlack">Python在CentOS上的安装路径是哪里</a></dt> <dd class="cont1">在CentOS上,Python的安装路径通常位于以下几个位置 刚接触CentOS的朋友,可能会对Python到底装在哪里感到困惑。别急,其实它就在几个固定的地方,弄清楚版本和安装方式,就能轻松定位。 系统默认Python 首先,得看你的CentOS版本。这事儿挺关键的,因为不同版本的系统,默认带的P</dd> <dd class="cont2"> <!--<span class="cont1"><img src="zrimages/example/img10.png"/>山外的鸭子哥</span>--> <span class="cont2"><b></b>5分钟前</span> <span class="cont4"><b></b>0</span> </dd> </dl> </li> <li> <a href="https://www.zhengruan.com/news/629229" class="img1" title="CentOS中Python依赖库怎么安装"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20260424/177700101239036.webp" alt="CentOS中Python依赖库怎么安装"> <span>正版软件</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/629229" title="CentOS中Python依赖库怎么安装" class="aBlack">CentOS中Python依赖库怎么安装</a></dt> <dd class="cont1">在CentOS系统中安装Python依赖库:两种主流方法详解 在CentOS环境下为Python项目安装依赖库,是每位开发者都会遇到的基础操作。通常,我们会借助系统包管理器yum或Python专属的包管理工具pip来完成。这两种方法各有适用场景,掌握它们能让你在部署和开发时更加游刃有余。下面,我们就</dd> <dd class="cont2"> <!--<span class="cont1"><img src="zrimages/example/img10.png"/>山外的鸭子哥</span>--> <span class="cont2"><b></b>6分钟前</span> <span class="cont4"><b></b>0</span> </dd> </dl> </li> <li> <a href="https://www.zhengruan.com/news/629228" class="img1" title="Python脚本在CentOS上怎么运行"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20260424/177700100630446.webp" alt="Python脚本在CentOS上怎么运行"> <span>正版软件</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/629228" title="Python脚本在CentOS上怎么运行" class="aBlack">Python脚本在CentOS上怎么运行</a></dt> <dd class="cont1">在CentOS上运行Python脚本的完整指南 想在CentOS系统上顺利运行你的Python脚本?其实过程并不复杂,但有几个关键步骤需要留意。下面这份操作指南,会带你一步步走完整个流程。 第一步:确认Python环境 首先,得确保你的系统里已经安装了Python。要知道,CentOS 7及之后的版</dd> <dd class="cont2"> <!--<span class="cont1"><img src="zrimages/example/img10.png"/>山外的鸭子哥</span>--> <span class="cont2"><b></b>6分钟前</span> <span class="cont4"><b></b>0</span> </dd> </dl> </li> </ul> </div> <!--左边 end--> <!--右边--> <div class="zrZuoRight"> <!-- <div class="zrBanner"><a href="#"><img src="zrimages/example/img11.png"/></a></div>--> <div class="zrByddBox"> <div class="zrByddTitle"><span><h2>最新发布</h2></span></div> <ul class="zrByddList"> <li> <a href="https://www.zhengruan.com/news/1561" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/upload/news/20191220/1576825692n90594/2019-12-20-15-08-12-5dfc735c5581a-1.jpg" alt="微软公布全新开源编程语言Bosque:正则化 告别for循环"> <span>1</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/1561" title="微软公布全新开源编程语言Bosque:正则化 告别for循环" class="aBlack">微软公布全新开源编程语言Bosque:正则化 告别for循环</a></dt> <dd><b></b>2317天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/1562" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/upload/news/20191220/1576825776n3925/2019-12-20-15-09-36-5dfc73b032cee-1.jpg" alt="微软推出最新程序语言Bosque 以Functors取代Loop循环"> <span>2</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/1562" title="微软推出最新程序语言Bosque 以Functors取代Loop循环" class="aBlack">微软推出最新程序语言Bosque 以Functors取代Loop循环</a></dt> <dd><b></b>2317天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/467167" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20250908/175730816420885.jpg" alt="C语言中\n是什么意思?换行转义字符详解"> <span>3</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/467167" title="C语言中\n是什么意思?换行转义字符详解" class="aBlack">C语言中\n是什么意思?换行转义字符详解</a></dt> <dd><b></b>228天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/63159" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="" alt="探析Spring Boot框架的优点和特色"> <span>4</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/63159" title="探析Spring Boot框架的优点和特色" class="aBlack">探析Spring Boot框架的优点和特色</a></dt> <dd><b></b>544天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/85739" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="" alt="深入比较PyCharm社区版和专业版的功能"> <span>5</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/85739" title="深入比较PyCharm社区版和专业版的功能" class="aBlack">深入比较PyCharm社区版和专业版的功能</a></dt> <dd><b></b>482天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/89680" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="" alt="专家观点:谷歌是否会继续支持Golang的探讨"> <span>6</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/89680" title="专家观点:谷歌是否会继续支持Golang的探讨" class="aBlack">专家观点:谷歌是否会继续支持Golang的探讨</a></dt> <dd><b></b>458天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/16470" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20230427/168257472829656.jpg" alt="Python实战教程:批量转换多种音乐格式"> <span>7</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/16470" title="Python实战教程:批量转换多种音乐格式" class="aBlack">Python实战教程:批量转换多种音乐格式</a></dt> <dd><b></b>1090天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/41129" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="" alt="如何在在线答题中实现试卷的自动批改和自动评分"> <span>8</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/41129" title="如何在在线答题中实现试卷的自动批改和自动评分" class="aBlack">如何在在线答题中实现试卷的自动批改和自动评分</a></dt> <dd><b></b>917天前</dd> </dl> <div class="clear"></div> </li> <li> <a href="https://www.zhengruan.com/news/87821" class="img"> <img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20240301/170927298835686.jpg" alt="解决Python安装失败的问题"> <span>9</span> </a> <dl> <dt><a href="https://www.zhengruan.com/news/87821" title="解决Python安装失败的问题" class="aBlack">解决Python安装失败的问题</a></dt> <dd><b></b>468天前</dd> </dl> <div class="clear"></div> </li> </ul> </div> <div class="zrRmgzBox" style="margin-top:20px;"> <div class="zrByddTitle"> <span><h2>相关推荐</h2></span> </div> <ul class="zrXwdtList"> <li><a href="https://www.zhengruan.com/news/629235" title="如何通过dmesg查看磁盘状态" class="aBlack">如何通过dmesg查看磁盘状态</a></li> <li><a href="https://www.zhengruan.com/news/629234" title="Ubuntu PHP日志格式怎么修改" class="aBlack">Ubuntu PHP日志格式怎么修改</a></li> <li><a href="https://www.zhengruan.com/news/629233" title="CentOS环境下Node.js的备份与恢复" class="aBlack">CentOS环境下Node.js的备份与恢复</a></li> <li><a href="https://www.zhengruan.com/news/629232" title="CentOS环境下Node.js的日志管理" class="aBlack">CentOS环境下Node.js的日志管理</a></li> <li><a href="https://www.zhengruan.com/news/629231" title="怎样在CentOS上安装多个Python版本" class="aBlack">怎样在CentOS上安装多个Python版本</a></li> <li><a href="https://www.zhengruan.com/news/629230" title="Python在CentOS上的安装路径是哪里" class="aBlack">Python在CentOS上的安装路径是哪里</a></li> <li><a href="https://www.zhengruan.com/news/629229" title="CentOS中Python依赖库怎么安装" class="aBlack">CentOS中Python依赖库怎么安装</a></li> <li><a href="https://www.zhengruan.com/news/629228" title="Python脚本在CentOS上怎么运行" class="aBlack">Python脚本在CentOS上怎么运行</a></li> <li><a href="https://www.zhengruan.com/news/629227" title="怎样在CentOS上避免Java编译错误" class="aBlack">怎样在CentOS上避免Java编译错误</a></li> </ul> </div> <div class="zrRmgzBox" style="margin-top:30px;"> <div class="zrByddTitle"> <span><h2>热门关注</h2></span> </div> <ul class="zrRmgzList"> <li> <span><a href="https://www.zhengruan.com/product/19" title="Xshell 6 简体中文"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/3c06ff5d8d3a8b234a536d602bcc0477.jpg" alt="Xshell 6 简体中文"></a></span> <dl> <dt><a href="https://www.zhengruan.com/product/19" title="Xshell 6 简体中文" class="aBlack">Xshell 6 简体中文</a></dt> <dd class="unstar unstar5"></dd> <dd class="cont1">¥899.00-¥1149.00</dd> </dl> <div class="clear"></div> </li> <li> <span><a href="https://www.zhengruan.com/product/48" title="DaVinci Resolve Studio 16 简体中文"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/60b5be77e7fc0ffb073d36675dc61585.jpg" alt="DaVinci Resolve Studio 16 简体中文"></a></span> <dl> <dt><a href="https://www.zhengruan.com/product/48" title="DaVinci Resolve Studio 16 简体中文" class="aBlack">DaVinci Resolve Studio 16 简体中文</a></dt> <dd class="unstar unstar5"></dd> <dd class="cont1">¥2550.00-¥2550.00</dd> </dl> <div class="clear"></div> </li> <li> <span><a href="https://www.zhengruan.com/product/47" title="Camtasia 2019 简体中文"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/537cf14c8ab78e3bca0cfe8e91c8b683.jpg" alt="Camtasia 2019 简体中文"></a></span> <dl> <dt><a href="https://www.zhengruan.com/product/47" title="Camtasia 2019 简体中文" class="aBlack">Camtasia 2019 简体中文</a></dt> <dd class="unstar unstar5"></dd> <dd class="cont1">¥689.00-¥689.00</dd> </dl> <div class="clear"></div> </li> <li> <span><a href="https://www.zhengruan.com/product/35" title="Luminar 3 简体中文"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/d253cca5f121bda501d04debdf3a4fa2.jpg" alt="Luminar 3 简体中文"></a></span> <dl> <dt><a href="https://www.zhengruan.com/product/35" title="Luminar 3 简体中文" class="aBlack">Luminar 3 简体中文</a></dt> <dd class="unstar unstar5"></dd> <dd class="cont1">¥288.00-¥288.00</dd> </dl> <div class="clear"></div> </li> <li> <span><a href="https://www.zhengruan.com/product/49" title="Apowersoft 录屏王 简体中文"><img onerror="this.src='https://www.zhengruan.com/statics/www/zrimages/404_bg.png'" src="https://www.zhengruan.com/uploads/20200428/c61fdff8f15649063e6b2617c8aa96fb.jpg" alt="Apowersoft 录屏王 简体中文"></a></span> <dl> <dt><a href="https://www.zhengruan.com/product/49" title="Apowersoft 录屏王 简体中文" class="aBlack">Apowersoft 录屏王 简体中文</a></dt> <dd class="unstar unstar5"></dd> <dd class="cont1">¥129.00-¥339.00</dd> </dl> <div class="clear"></div> </li> </ul> </div> </div> <!--右边 end--> <div class="clear"></div> </div> <!--主体 end--> <!--底部--> <!--底部--> <div class="zrFoot"> <div class="zrFootIn"> <div class="zrFootMsg">网站备案号: <a href="https://beian.miit.gov.cn/" target="" style="text-decoration: none;"> <font color="#9b9db0">苏ICP备2026018738号-1 联系邮箱:zhengruancom@outlook.com<br> Copyright ©2018-2020</font> </a> </div> </div> </div> <!--底部 end--> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?2f243b178fc8c70f194fc14781f06522"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <!--底部 end--> <script> function countView(){ $.ajax({ type: "post", url: "/countView?&time="+new Date().getTime(), data:{'type':'news','id':"629065"}, async:false, dataType: "json", success: function(result){ console.log(result) }, error:function(){ } }); } function code_highlight() { SyntaxHighlighter.all() } $(function(){ code_highlight(); countView(); $("#qrcode").qrcode({width:150,height:150,text:"https://m.zhengruan.com/news/629065"}) }) </script> </body> </html>