HTML 邮件模板生成器

开发人员文本

输入

自动处理

主题行

用于电子邮件的标签和预览渲染。 </small> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailPreheader">预览文本</label> <div class="input-group"> <input type="text" name="ioEmailPreheader" id="ioEmailPreheader" class="form-control" placeholder="快速入门指南以及接下来要做的事项。" aria-label="快速入门指南以及接下来要做的事项。" value="Here is everything you need to get started." > </div> <small class="form-text form__help-text text-muted"> 在大多数邮箱中，主题行之后显示的简短摘要。 </small> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailFont">字体系列</label> <div class="input-group"> <select class="custom-select" id="ioEmailFont" name="ioEmailFont"> <option value="system" selected>系统/无衬线字体</option> <option value="helvetica" >Helvetica / Arial</option> <option value="georgia" >Georgia / 衬线字体</option> <option value="courier" >Courier / 等宽字体</option> </select> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailBrandColor">品牌颜色</label> <div class="input-group"> <input type="color" name="ioEmailBrandColor" id="ioEmailBrandColor" class="form-control" data-coloris value="#464aff" > </div> <small class="form-text form__help-text text-muted"> 用于按钮和强调部分。 </small> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailBgColor">背景颜色</label> <div class="input-group"> <input type="color" name="ioEmailBgColor" id="ioEmailBgColor" class="form-control" data-coloris value="#f4f4f7" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailTextColor">文本颜色</label> <div class="input-group"> <input type="color" name="ioEmailTextColor" id="ioEmailTextColor" class="form-control" data-coloris value="#333333" > </div> </div> <p class="h5 blue mb-3">标题区块</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailHeaderEnabled" name="ioEmailHeaderEnabled" checked > <label class="custom-control-label" for="ioEmailHeaderEnabled">包含标题区块</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailHeaderLogo">标志文字</label> <div class="input-group"> <input type="text" name="ioEmailHeaderLogo" id="ioEmailHeaderLogo" class="form-control" placeholder="您的品牌或产品名称" aria-label="您的品牌或产品名称" value="Acme" data-rules="[{"name":"ioEmailHeaderEnabled","value":["on"]}]" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailHeaderTagline">标语</label> <div class="input-group"> <input type="text" name="ioEmailHeaderTagline" id="ioEmailHeaderTagline" class="form-control" placeholder="可选的简短标语" aria-label="可选的简短标语" value="Build things that matter" data-rules="[{"name":"ioEmailHeaderEnabled","value":["on"]}]" > </div> </div> <p class="h5 blue mb-3">英雄区块</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailHeroEnabled" name="ioEmailHeroEnabled" checked > <label class="custom-control-label" for="ioEmailHeroEnabled">包含英雄区块</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailHeroTitle">英雄标题</label> <div class="input-group"> <input type="text" name="ioEmailHeroTitle" id="ioEmailHeroTitle" class="form-control" value="Welcome aboard, friend!" data-rules="[{"name":"ioEmailHeroEnabled","value":["on"]}]" > </div> </div> <div class="form-group"> <label for="ioEmailHeroSubtitle">英雄副标题</label> <div class="input-group"> <textarea class="form-control" name="ioEmailHeroSubtitle" id="ioEmailHeroSubtitle" rows="2" data-rules="[{"name":"ioEmailHeroEnabled","value":["on"]}]" >Thanks for signing up. Your account is ready and we have a few things to help you get the most out of it.</textarea> </div> </div> <p class="h5 blue mb-3">图片区块</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailImageEnabled" name="ioEmailImageEnabled" > <label class="custom-control-label" for="ioEmailImageEnabled">包含图片区块</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailImageUrl">图片网址</label> <div class="input-group"> <input type="url" name="ioEmailImageUrl" id="ioEmailImageUrl" class="form-control" placeholder="https://example.com/hero.png" aria-label="https://example.com/hero.png" value="https://placehold.co/560x280/png?text=Hero+Image" data-rules="[{"name":"ioEmailImageEnabled","value":["on"]}]" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailImageAlt">图片替代文本</label> <div class="input-group"> <input type="text" name="ioEmailImageAlt" id="ioEmailImageAlt" class="form-control" value="Product screenshot" data-rules="[{"name":"ioEmailImageEnabled","value":["on"]}]" > </div> </div> <p class="h5 blue mb-3">正文文本区块</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailBodyEnabled" name="ioEmailBodyEnabled" checked > <label class="custom-control-label" for="ioEmailBodyEnabled">包含正文文本区块</label> </div> </div> <div class="form-group"> <label for="ioEmailBodyText">正文文本</label> <div class="input-group"> <textarea class="form-control" name="ioEmailBodyText" id="ioEmailBodyText" rows="4" data-rules="[{"name":"ioEmailBodyEnabled","value":["on"]}]" >Click the button below to finish setting up your account. It only takes a couple of minutes and you will be up and running in no time. If you have any questions, reply to this email and someone on our team will get back to you.</textarea> </div> <small class="form-text form__help-text text-muted"> 每行空白行开始一个新的段落。 </small> </div> <p class="h5 blue mb-3">按钮区块</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailButtonEnabled" name="ioEmailButtonEnabled" checked > <label class="custom-control-label" for="ioEmailButtonEnabled">包含行动号召按钮</label> </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailButtonLabel">按钮标签</label> <div class="input-group"> <input type="text" name="ioEmailButtonLabel" id="ioEmailButtonLabel" class="form-control" value="Get Started" data-rules="[{"name":"ioEmailButtonEnabled","value":["on"]}]" > </div> </div> <div class="form-group form-group--horizontal form-group--horizontal-3"> <label for="ioEmailButtonUrl">按钮网址</label> <div class="input-group"> <input type="url" name="ioEmailButtonUrl" id="ioEmailButtonUrl" class="form-control" value="https://example.com/getting-started" data-rules="[{"name":"ioEmailButtonEnabled","value":["on"]}]" > </div> </div> <p class="h5 blue mb-3">分隔线与页脚</p> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailDividerEnabled" name="ioEmailDividerEnabled" checked > <label class="custom-control-label" for="ioEmailDividerEnabled">在正文和页脚之间包含分隔线</label> </div> </div> <div class="form-group"> <div class="custom-control custom-switch"> <input type="checkbox" class="custom-control-input" id="ioEmailFooterEnabled" name="ioEmailFooterEnabled" checked > <label class="custom-control-label" for="ioEmailFooterEnabled">包含页脚区块</label> </div> </div> <div class="form-group"> <label for="ioEmailFooterText">页脚文本</label> <div class="input-group"> <textarea class="form-control" name="ioEmailFooterText" id="ioEmailFooterText" rows="2" data-rules="[{"name":"ioEmailFooterEnabled","value":["on"]}]" >You are receiving this email because you signed up at example.com.</textarea> </div> </div> <div class="form-group"> <label for="ioEmailFooterAddress">页脚地址</label> <div class="input-group"> <textarea class="form-control" name="ioEmailFooterAddress" id="ioEmailFooterAddress" rows="2" data-rules="[{"name":"ioEmailFooterEnabled","value":["on"]}]" >Acme Inc. - 123 Market Street, Suite 100, San Francisco, CA 94105</textarea> </div> </div> <input type="hidden" name="trp-form-language" value="zh"/></form> </div> <div class="card-footer"> <form action="#" id="html-email-template-generator-in_footer" autocomplete="off" onsubmit="return false;" class="html-email-template-generator d-flex flex--rtl gap-2" data-trp-original-action="#"> <button class="btn btn-default" data-toggle="tooltip" title="清除输入并重置所有选项" data-name="ioClearInputs" onclick="IOTools.resetForm('form.form-in'); return false;" > <span class="btn__icons"> <i class="ti ti-refresh" data-no-translation=""></i> </span> 重置 </button> <input type="hidden" name="trp-form-language" value="zh"/></form> </div> </div> </div> <div class="col-md-6" data-cols="6"> <div class="card sticky-top"> <div class="card-header"> <div class="h3 card-title font-weight-bold">输出</div> <div class="card-tools"> <span data-toggle="tooltip" data-placement="left" title="此工具可直接在您的设备或浏览器上运行。请放心，它不会通过互联网发送您的任何输入数据，也不会在我们的服务器上保留任何内容。" class="badge badge-pill badge-success"><i class="ti ti-device-desktop" data-no-translation=""></i> 客户端</span> <div class="dropdown d-inline-block ml-1"> <a href="#" role="button" data-toggle="dropdown" aria-expanded="false" aria-label="工具设置"> <i class="ti ti-settings" data-no-translation=""><i class="ti ti-chevron-down small" data-no-translation=""></i></i> </a> <div class="dropdown-menu"><a href="#" class="dropdown-item" onclick="IOTools.toggleFullwidth();return false;"><i class="ti ti-arrow-autofit-width" data-no-translation=""></i> <span>切换宽度</span></a><a href="#" class="dropdown-item" data-card-widget="maximize"><i class="ti ti-maximize" data-no-translation=""></i> <span>进入/退出全屏</span></a></div> </div> </div> </div> <div class="card-body"> <form action="#" id="html-email-template-generator-out" autocomplete="off" onsubmit="return false;" class="html-email-template-generator form-out" data-trp-original-action="#"> <div class="form-group" id="ioEmailPreview" data-name="ioEmailPreview"> <div class="email-preview-empty">配置左侧区块以查看实时预览。</div> </div> <div class="form-group"> <label for="ioEmailHtml">内联CSS电子邮件HTML</label> <div class="input-group"> <pre class="form-control" ><code data-name="ioEmailHtml" id="ioEmailHtml" class="language-html" data-no-translation="" ></code></pre> <div class="input-group-append"> <button class="btn btn-primary" type="button" onclick="IOTools.copyCode('#ioEmailHtml'); return false;" data-toggle="tooltip" title="复制 HTML" aria-label="复制 HTML" > <i class="ti ti-copy" data-no-translation=""></i> </button> <button class="btn btn-primary" type="button" onclick="IOTools.downloadEmailHtml(); return false;" data-toggle="tooltip" title="下载 .html" aria-label="下载 .html" > <i class="ti ti-download" data-no-translation=""></i> </button> </div> </div> <small class="form-text form__help-text text-muted"> 为电子邮件客户端准备的HTML，包含MSO条件语句和内联样式。 </small> </div> <input type="hidden" name="trp-form-language" value="zh"/></form> </div> </div> </div> </div> <script defer> setTimeout(() => { const highlight = () => document.querySelectorAll('pre code').forEach(el => hljs.highlightElement(el)); document.readyState === 'complete' ? highlight() : document.addEventListener('DOMContentLoaded', highlight); }, 1000); </script> <div class="aw aw-below_tool text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">广告 <a tabindex="-1" target="_blank" href="https://iotools.cloud/zh/pricing/" title="无广告" style="text-decoration: underline;color: #9f9f9f;">移除？</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741343828950-4_123456"] { min-width: 300px; min-height: 50px; } } @media only screen and (min-width: 900px) and (min-height: 0px) { div[id^="bsa-zone_1741343828950-4_123456"] { min-width: 468px; min-height: 90px; } } </style> <div id="bsa-zone_1741343828950-4_123456"></div> </div> <div class="card card--related card--has-list"> <div class="card-header card-header--heading"> <h2 class="card-title" data-card-widget="collapse"><i class="ti ti-circles-relation" data-no-translation=""></i> 相关工具</h2> <div class="card-tools"> <button type="button" class="btn btn-tool" data-card-widget="collapse" aria-label="切换标题" title="切换"> <i class="fas fa-minus"></i> </button> </div> </div> <div class="card-body pb-md-3 pt-0"> <p>其他一些类似的工具 <b>HTML 邮件模板生成器</b> 你可能会觉得有用。</p> <div class="row"> <div class="col col-lg-4"> <div class="card card--tool card--tool-compact elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/css-nesting-converter/" class="card-image card-image--icon" aria-label="CSS Nesting Converter"> <i class="ti blue" style="--icon-hex:'\ebcc'" data-no-translation=""></i> </a> <a class="card-body" href="https://iotools.cloud/zh/tool/css-nesting-converter/"> <h3 class="h5 mb-0 black">CSS Nesting Converter<span class="io-badge io-badge--new" style="background-color: #f59e0b30;color:#f59e0b" data-toggle="tooltip" title="新的" data-content="New"></span></h3> </a> <div class="card-footer text-muted text-xs"> <div class="d-flex"> <span data-tag-slug="developer" class="badge badge-pill mr-2 tag-ico tag-ico--orange"><i class="ti ti-tag" data-no-translation=""></i>开发人员</span><span data-tag-slug="text" class="badge badge-pill mr-2 tag-ico tag-ico--green"><i class="ti ti-tag" data-no-translation=""></i>文本</span> </div> <span class="io-compact-bookmark ml-auto position-relative" title="书签"> <span class="io-compact-bookmark__count" data-favorites-post-count-id="337280" data-siteid></span> <button class="io-favorite-button" aria-label="书签" data-toggle="modal" data-target="#io-modal-login"><i class="sf-icon-bookmark"></i></button> </span> </div> </div> </div> <div class="col col-lg-4"> <div class="card card--tool card--tool-compact elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/api-secret-scanner-redactor/" class="card-image card-image--icon" aria-label="API Secret Scanner & Redactor"> <i class="ti blue" style="--icon-hex:'\ed58'" data-no-translation=""></i> </a> <a class="card-body" href="https://iotools.cloud/zh/tool/api-secret-scanner-redactor/"> <h3 class="h5 mb-0 black">API Secret Scanner & Redactor<span class="io-badge io-badge--new" style="background-color: #f59e0b30;color:#f59e0b" data-toggle="tooltip" title="新的" data-content="New"></span></h3> </a> <div class="card-footer text-muted text-xs"> <div class="d-flex"> <span data-tag-slug="developer" class="badge badge-pill mr-2 tag-ico tag-ico--orange"><i class="ti ti-tag" data-no-translation=""></i>开发人员</span><span data-tag-slug="security" class="badge badge-pill mr-2 tag-ico tag-ico--yellow"><i class="ti ti-tag" data-no-translation=""></i>安全</span> </div> <span class="io-compact-bookmark ml-auto position-relative" title="书签"> <span class="io-compact-bookmark__count" data-favorites-post-count-id="334040" data-siteid></span> <button class="io-favorite-button" aria-label="书签" data-toggle="modal" data-target="#io-modal-login"><i class="sf-icon-bookmark"></i></button> </span> </div> </div> </div> <div class="col col-lg-4"> <div class="card card--tool card--tool-compact elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/xml-to-yaml-converter/" class="card-image card-image--icon" aria-label="XML to YAML Converter"> <i class="ti blue" style="--icon-hex:'\f1f4'" data-no-translation=""></i> </a> <a class="card-body" href="https://iotools.cloud/zh/tool/xml-to-yaml-converter/"> <h3 class="h5 mb-0 black">XML to YAML Converter<span class="io-badge io-badge--new" style="background-color: #f59e0b30;color:#f59e0b" data-toggle="tooltip" title="新的" data-content="New"></span></h3> </a> <div class="card-footer text-muted text-xs"> <div class="d-flex"> <span data-tag-slug="data" class="badge badge-pill mr-2 tag-ico tag-ico--gray"><i class="ti ti-tag" data-no-translation=""></i>数据</span><span data-tag-slug="developer" class="badge badge-pill mr-2 tag-ico tag-ico--orange"><i class="ti ti-tag" data-no-translation=""></i>开发人员</span> </div> <span class="io-compact-bookmark ml-auto position-relative" title="书签"> <span class="io-compact-bookmark__count" data-favorites-post-count-id="333132" data-siteid></span> <button class="io-favorite-button" aria-label="书签" data-toggle="modal" data-target="#io-modal-login"><i class="sf-icon-bookmark"></i></button> </span> </div> </div> </div> </div> </div> </div> <div class="card generic-content" id="tool-doc"> <div class="card-header card-header--heading"> <h2 class="card-title" data-card-widget="collapse"><i class="ti ti-book" data-no-translation=""></i> 指导</h2> <div class="card-tools"> <button type="button" class="btn btn-tool" data-card-widget="collapse" aria-label="切换标题" title="切换"> <i class="fas fa-minus"></i> </button> </div> </div> <div class="card-body pt-0"> <div class="toc-wrapper position-relative" style="overflow: hidden;border-radius: 10px"> <div class="position-absolute toc-image"> <img decoding="async" class="exclude--lazy-load" src="https://iotools.cloud/wp-content/uploads/2026/06/html-email-template-generator-featured-400x512.jpg" alt="HTML邮件模板生成器" title="HTML邮件模板生成器 1"> </div> <div class="toc-content position-relative" style="z-index: 1"> </div> </div> <h3 class="wp-block-heading">HTML 邮件模板生成器</h3> <p>通过组合模块化区块——标题、主视觉、图片、正文、按钮、分隔线和页脚——构建响应式、内联CSS的电子邮件HTML，配备实时的桌面和移动端预览。输出采用基于表格的布局和MSO条件语句，确保在Outlook、Gmail、Apple Mail及其他邮件客户端中一致渲染。</p> <h3 class="wp-block-heading">如何使用</h3> <ul class="wp-block-list"> <li>在表单顶部设置主题行、预览文本、字体家族和品牌、背景色和文字颜色。</li> <li>切换您希望包含的区块，并填写每个区块的内容——标志和标语、主视觉标题和副标题、图片URL、正文段落、行动号召按钮、分隔线和页脚。</li> <li>查看右侧实时预览的更新情况。在桌面和移动端宽度之间切换，以验证两种布局。</li> <li>点击 <strong>复制 HTML</strong> 获取内联CSS HTML，或 <strong>下载 .html</strong> 以可直接粘贴到您的邮件服务提供商、交易发送者或活动工具中的文件形式保存。</li> </ul> <h3 class="wp-block-heading">特征</h3> <ul class="wp-block-list"> <li><strong>模块化区块</strong> ——可以独立地开启或关闭标题、主视觉、图片、正文、按钮、分隔线和页脚。</li> <li><strong>内联CSS输出</strong> ——所有样式均内联且基于表格，因此无需外部样式表，也不会在Outlook或Gmail中出现渲染问题。</li> <li><strong>MSO条件语句</strong> ——包含专为Windows Outlook设计的标记，以确保在Outlook中的宽度和间距正确。</li> <li><strong>实时预览</strong> ——在隔离的iframe中渲染桌面（600px）和移动端（360px）预览。</li> <li><strong>品牌自定义</strong> ——提供品牌主色调、背景色和文字颜色的配色器，以及四个字体堆叠预设。</li> <li><strong>一键导出</strong> ——将HTML复制到剪贴板，或下载可直接发送的版本 <code data-no-translation="">.html</code> 文件。</li> <li><strong>在浏览器中运行</strong> ——没有任何内容被上传或存储。所有生成过程均在客户端完成。</li> </ul> </p> </div> </div> <div class="card generic-content" id="tool-faq"> <div class="card-header card-header--heading"> <h3 class="card-title" data-card-widget="collapse"><i class="ti" data-no-translation=""></i> 常问问题</h3> <div class="card-tools"> <button type="button" class="btn btn-tool" data-card-widget="collapse" aria-label="切换标题" title="切换"> <i class="fas fa-minus"></i> </button> </div> </div> <div class="card-body pt-0"> <div id="rank-math-faq" class="rank-math-block"> <ol class="rank-math-list"> <li id="faq-question-1780668428000" class="rank-math-list-item"> <h4 class="rank-math-question">为什么电子邮件HTML使用表格而不是现代的flexbox或网格布局？</h4> <div class="rank-math-answer"> <p>许多邮件客户端——特别是Windows上的Microsoft Outlook——使用Word引擎来渲染消息，该引擎对CSS的支持非常有限，会忽略flexbox、网格以及大多数定位规则。嵌套的HTML表格仍然是唯一能在所有客户端中稳定渲染的布局系统，包括Gmail、Outlook、Apple Mail、Yahoo和移动网页邮箱。因此，生产级电子邮件HTML仍然看起来像2003年的网页代码：它是所有渲染引擎中最低的共同分母。</p> </div> </li> <li id="faq-question-1780668428001" class="rank-math-list-item"> <h4 class="rank-math-question">什么是MSO条件语句，为什么邮件需要它们？</h4> <div class="rank-math-answer"> <p>MSO条件语句是HTML注释，仅被Microsoft Outlook（Word引擎）解析。它们看起来像 <code data-no-translation=""></code> 并允许您专门针对Outlook发送标记或样式，而不会影响其他客户端。它们常用于设置固定容器宽度（使用虚表）、修复按钮和背景的VML，以及禁用Outlook渲染错误的功能。如果没有它们，布局在Outlook中常常会塌陷或异常拉伸，即使在其他地方看起来完美。</p> </div> </li> <li id="faq-question-1780668428002" class="rank-math-list-item"> <h4 class="rank-math-question">为什么邮件CSS必须内联而不是声明在样式标签中？</h4> <div class="rank-math-answer"> <p>多个主要邮件客户端——历史上Gmail尤其如此——会移除 <code data-no-translation=""><style></code> 块或不一致地应用这些块，尤其是在移动设备和转发消息中。内联将每个规则直接附加到目标元素上，通过 <code data-no-translation="">style</code> 属性，所有客户端都会尊重这一设置。这种做法的代价是代码冗长和维护困难，因此需要工具——包括本生成器——自动将样式内联到更高层级的模板中。</p> </div> </li> <li id="faq-question-1780668428003" class="rank-math-list-item"> <h4 class="rank-math-question">什么是预览文本，它如何影响邮件打开率？</h4> <div class="rank-math-answer"> <p>预览文本是大多数收件箱预览中主题行之后显示的简短文本片段。默认情况下，它会从邮件正文中的第一个可见文本中提取，这通常是问候语或模板内容，浪费了这个位置。在HTML顶部添加一个隐藏的预览文本元素，可以精确控制其内容。一个精心撰写的预览文本能与主题行相辅相成，并在各大邮件服务提供商进行的A/B测试中与更高的打开率相关。</p> </div> </li> </ol> </div> </div> </div> </div> <div class="col aw--col-300 side-content"> <a href="https://iotools.cloud/zh/pricing/" class="info-box mb-3" style="background-color: var(--io-color-blue, #464aff);letter-spacing:0;min-height:70px;padding-top:5px;"> <div class="info-box-content"> <span class="info-box-text text-sm white">想要享受无广告的体验吗？</span> <span class="info-box-number white" style="font-weight: 500;"> <span class="white"><u>立即无广告</u></span> </span> </div> <span class="info-box-icon white" style="width:50px"> <i class="ti" data-no-translation=""></i> </span> </a> <div class="card card-body pb-0"> <h2 class="h5 blue mb-1"> <i class="ti" data-no-translation=""></i> 安装我们的扩展 </h2> <p class="mb-2"> 将 IO 工具添加到您最喜欢的浏览器，以便即时访问和更快地搜索 </p> <div class="text-center pt-1 pb-3"> <div id="io-browser-extension-d41d8cd9" class="d-none d-lg-block"> <div class="io-browser-extension-container d-flex justify-content-center"> <a href="https://chromewebstore.google.com/detail/io-tools-quick-access/ngfigjoligkblljadlbojinhoiofkdld" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="添加到 Chrome" style="cursor: pointer;"> 添加 <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/chrome.svg" width="18" height="18" alt="Chrome 扩展程序" class="img-fluid"> </a> <a href="https://microsoftedge.microsoft.com/addons/detail/io-tools-quick-access/daapkanhnnjodjpobfmkopolagbkcccb" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="添加到边缘" style="cursor: pointer;"> 添加 <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/edge.svg" width="18" height="18" alt="边缘延伸" class="img-fluid"> </a> <a href="https://addons.mozilla.org/en-US/firefox/addon/iotools-quick-access/" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="添加到 Firefox" style="cursor: pointer;"> 添加 <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/firefox.svg" width="18" height="18" alt="Firefox 扩展" class="img-fluid"> </a> <a href="https://addons.opera.com/en/extensions/details/io-tools-quick-access/" target="_blank" rel="noopener" class="io-browser-extension-btn" data-toggle="tooltip" data-placement="top" title="添加到 Opera" style="cursor: pointer;"> 添加 <img src="https://iotools.cloud/wp-content/themes/iotools/assets/images/browsers/opera.svg" width="18" height="18" alt="Opera 扩展" class="img-fluid"> </a> <style> #io-browser-extension-d41d8cd9 .io-browser-extension-container { gap: 10px; margin-left: -1px; } #io-browser-extension-d41d8cd9 .io-browser-extension-btn { display: flex; padding: 3px 5px 1px 6px;; background-color: white; border: 1px solid #dee2e6; border-radius: 12px; text-decoration: none; transition: all 0.2s ease; font-size: 12px;; color: #000!important; align-items: center; justify-content: center; gap: 2px; flex-grow: 1;; } #io-browser-extension-d41d8cd9 .io-browser-extension-btn img { transform: translateY(-1px); } #io-browser-extension-d41d8cd9 .io-browser-extension-btn:hover { background-color: #f8f9fa; border-color: #ced4da; color: #333; text-decoration: none; } </style> </div> </div> </div> </div> <div class="card card-body pb-0"> <h2 class="h5 blue mb-1"> <i class="ti" data-no-translation="">恵</i><a href="https://scoreboard.iotools.cloud/" target="_blank" rel="noopener"> 记分板已到达！</a> </h2> <p class="mb-2"> <a href="https://scoreboard.iotools.cloud/" target="_blank" rel="noopener">记分板</a> 是一种有趣的跟踪您游戏的方式，所有数据都存储在您的浏览器中。更多功能即将推出！ </p> </div> <div class="aw aw-side_content_1_desktop text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">广告 <a tabindex="-1" target="_blank" href="https://iotools.cloud/zh/pricing/" title="无广告" style="text-decoration: underline;color: #9f9f9f;">移除？</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741342473519-9_123456"] { min-width: 0px; min-height: 0px; } } @media only screen and (min-width: 1370px) and (min-height: 0px) { div[id^="bsa-zone_1741342473519-9_123456"] { min-width: 200px; min-height: 250px; } } </style> <div id="bsa-zone_1741342473519-9_123456"></div> </div> <div class="card card-body pb-0"> <div class="d-flex justify-content-between align-items-center mb-3"> <h2 class="h5 blue mb-0"><i class="ti" data-no-translation=""></i> 必试工具</h2> <a class="text-muted small blue" href="https://iotools.cloud/zh/tags/must-try/"><u>查看全部</u></a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/imagekit/background-remover/" class="card-image card-image--icon" aria-label="背景去除器"> <i class="ti blue" style="--icon-hex:'\f360'" data-no-translation=""></i> </a> <span class="card-image card-image--icon" data-toggle="tooltip" title="工具集：ImageKit" ><i class="ti blue" style="--icon-hex:'\f360'" data-no-translation=""></i></span> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/imagekit/background-remover/"> 背景去除器 </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/ai-image-editor/" class="card-image card-image--icon" aria-label="人工智能图像编辑器"> <i class="ti blue" style="--icon-hex:'\fa32'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/ai-image-editor/"> 人工智能图像编辑器<span class="io-badge io-badge--toolset" style="background-color: #92ff9580;color:#10a581" data-toggle="tooltip" title="工具集" data-content="Toolset"></span> </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/ai-image-generator/" class="card-image card-image--icon" aria-label="AI 图像生成器"> <i class="ti blue" style="--icon-hex:'\ffb0'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/ai-image-generator/"> AI 图像生成器 </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/imagekit/" class="card-image card-image--icon" aria-label="ImageKit"> <i class="ti blue" style="--icon-hex:'\f360'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/imagekit/"> ImageKit<span class="io-badge io-badge--toolset" style="background-color: #92ff9580;color:#10a581" data-toggle="tooltip" title="工具集" data-content="Toolset"></span> </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/pdf-converter/compress-pdf/" class="card-image card-image--icon" aria-label="PDF 压缩器"> <i class="ti blue" style="--icon-hex:'\ed44'" data-no-translation=""></i> </a> <span class="card-image card-image--icon" data-toggle="tooltip" title="工具集：PDF 转换器" ><i class="ti blue" style="--icon-hex:'\f7ac'" data-no-translation=""></i></span> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/pdf-converter/compress-pdf/"> PDF 压缩器 </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/image-converter/" class="card-image card-image--icon" aria-label="图像转换器"> <i class="ti blue" style="--icon-hex:'\fd9f'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/image-converter/"> 图像转换器<span class="io-badge io-badge--toolset" style="background-color: #92ff9580;color:#10a581" data-toggle="tooltip" title="工具集" data-content="Toolset"></span> </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/one-time-link/" class="card-image card-image--icon" aria-label="一次性链接"> <i class="ti blue" style="--icon-hex:'\f7bd'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/one-time-link/"> 一次性链接 </a> </div> </div> <div class="aw aw-side_content_2_desktop text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">广告 <a tabindex="-1" target="_blank" href="https://iotools.cloud/zh/pricing/" title="无广告" style="text-decoration: underline;color: #9f9f9f;">移除？</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741342696932-0_123456"] { min-width: 0px; min-height: 0px; } } @media only screen and (min-width: 1370px) and (min-height: 0px) { div[id^="bsa-zone_1741342696932-0_123456"] { min-width: 200px; min-height: 250px; } } </style> <div id="bsa-zone_1741342696932-0_123456"></div> </div> <div class="card card-body pb-0"> <div class="d-flex justify-content-between align-items-center mb-3"> <h2 class="h5 blue mb-0"> <i class="ti" data-no-translation=""></i> 新品上市 </h2> <a class="text-muted small blue" href="https://iotools.cloud/zh/tools/"><u>查看全部</u></a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/certificate-transparency-log-lookup/" class="card-image card-image--icon" aria-label="Certificate Transparency Log Lookup"> <i class="ti blue" style="--icon-hex:'\ed76'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/certificate-transparency-log-lookup/"> Certificate Transparency Log Lookup </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/hsts-preload-header-generator/" class="card-image card-image--icon" aria-label="HSTS Preload Header Generator"> <i class="ti blue" style="--icon-hex:'\ed58'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/hsts-preload-header-generator/"> HSTS Preload Header Generator </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/argon2-hash-generator/" class="card-image card-image--icon" aria-label="Argon2 Hash Generator"> <i class="ti blue" style="--icon-hex:'\eac7'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/argon2-hash-generator/"> Argon2 Hash Generator </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/cidr-overlap-checker/" class="card-image card-image--icon" aria-label="CIDR Overlap / Subnet Conflict Checker"> <i class="ti blue" style="--icon-hex:'\edff'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/cidr-overlap-checker/"> CIDR Overlap / Subnet Conflict Checker </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/css-nesting-converter/" class="card-image card-image--icon" aria-label="CSS Nesting Converter"> <i class="ti blue" style="--icon-hex:'\ebcc'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/css-nesting-converter/"> CSS Nesting Converter </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/oauth-authorization-url-builder/" class="card-image card-image--icon" aria-label="OAuth 2.0 Authorization URL Builder"> <i class="ti blue" style="--icon-hex:'\eade'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/oauth-authorization-url-builder/"> OAuth 2.0 Authorization URL Builder </a> </div> <div class="card card--tool card--tool-compact card--tool-compact--mini elevation-0 border card--tool-has-icon"> <a href="https://iotools.cloud/zh/tool/har-to-curl-extractor/" class="card-image card-image--icon" aria-label="HAR to cURL Commands Extractor"> <i class="ti blue" style="--icon-hex:'\ebef'" data-no-translation=""></i> </a> <a class="card-body flex-row align-items-center h6 mb-0 black" href="https://iotools.cloud/zh/tool/har-to-curl-extractor/"> HAR to cURL Commands Extractor </a> </div> <p class="small text-muted mb-3 text-center"><b>更新：</b> 我们的 <a href="https://iotools.cloud/zh/tool/certificate-transparency-log-lookup/" class="text-muted"><u>最新工具</u></a> was added on 6 月 26, 2026</p> </div> <div class="aw aw-dashboard_sidebar text-center mb-4"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">广告 <a tabindex="-1" target="_blank" href="https://iotools.cloud/zh/pricing/" title="无广告" style="text-decoration: underline;color: #9f9f9f;">移除？</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741781122639-0_123456"] { min-width: 300px; min-height: 50px; } } @media only screen and (min-width: 900px) and (min-height: 0px) { div[id^="bsa-zone_1741781122639-0_123456"] { min-width: 200px; min-height: 200px; } } </style> <div id="bsa-zone_1741781122639-0_123456"></div> </div> <div class="card card-body io-no-scrollbar" style="max-height:700px;"> <h2 class="h5 blue mb-3"><i class="ti" data-no-translation=""></i> 新闻角 <small class="black">包含技术亮点</small></h2> <div data-load-more-id="side-news" class="exclude--translation" data-no-translation=""> <div class="io-loading mb-3"> <div class="io-loading__item title"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> </div> <div class="io-loading mb-3"> <div class="io-loading__item title"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> </div> <div class="io-loading mb-3"> <div class="io-loading__item title"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> <div class="io-loading__item"></div> </div> </div> <script class="exclude--lazy-load" async> // Immediately load news from session storage document.querySelectorAll('[data-load-more-id="side-news"]').forEach(function(element) { const dailyNewsHtml = sessionStorage.getItem(`dailyNewsHtml`); if (dailyNewsHtml) { element.innerHTML = dailyNewsHtml; } }); </script> <p class="text-center"> <button class="btn--load-more" data-load-more="{"target":"side-news","postType":"wprss_feed_item","offset":3}">展示更多！</button> </p> </div> <h2 class="h5 blue text-right mt-5"><i class="ti ti-heart-handshake" data-no-translation=""></i> 参与其中</h2> <div class="text-right mb-4"> <p>帮助我们继续提供有价值的免费工具</p> <div class="d-lg-flex justify-content-end"> <a href="https://buymeacoffee.com/iotools" target="_blank" rel="noopener"><img width="180" height="50" src="https://iotools.cloud/wp-content/themes/iotools/assets/images/yellow-button.png" alt="给我买杯咖啡" class="img-fluid"></a> </div> </div> <div class="aw aw-side_content_sticky_desktop sticky-top text-center"><div style="text-align: center;color: #9f9f9f;font-size: 9px;letter-spacing: 1px;line-height: 25px;height: 25px;width: 100%;">广告 <a tabindex="-1" target="_blank" href="https://iotools.cloud/zh/pricing/" title="无广告" style="text-decoration: underline;color: #9f9f9f;">移除？</a></div>  <style> @media only screen and (min-width: 0px) and (min-height: 0px) { div[id^="bsa-zone_1741342751312-1_123456"] { min-width: 0px; min-height: 0px; } } @media only screen and (min-width: 1370px) and (min-height: 0px) { div[id^="bsa-zone_1741342751312-1_123456"] { min-width: 120px; min-height: 600px; } } </style> <div id="bsa-zone_1741342751312-1_123456"></div> </div> </div> </div> </div> </main>  <footer class="main-footer text-sm text-center text-xl-left d-flex flex-xl-nowrap flex-column-reverse flex-xl-row"> <span>Copyright © 2026 <a href="https://iotools.cloud/zh/" class="exclude--translation" data-no-translation=""><u>iotools.cloud</u></a>。版权所有。</span>  <ul class="navbar-nav d-flex flex-row ml-xl-auto justify-content-center flex-wrap"> <li class="nav-item"> <a href="https://iotools.cloud/zh/" class="text-muted">家</a> </li> <li class="nav-item"> <a href="https://iotools.cloud/zh/about/" class="text-muted">关于</a> </li> <li class="nav-item"> <a href="https://iotools.cloud/zh/contact/" class="text-muted">接触</a> </li> <li class="nav-item"> <a href="https://iotools.cloud/zh/pricing/" class="text-muted">价格</a> </li> <li class="nav-item blue mb-2 mb-xl-0"> • </li> <li class="nav-item"><a href="https://iotools.cloud/zh/community-tools/" rel="nofollow" class="text-muted">社区工具</a></li> <li class="nav-item"><a href="https://iotools.cloud/zh/journal/" class="text-muted">期刊中心</a></li> <li class="nav-item blue mb-2 mb-xl-0"> • </li> <li class="nav-item"><a href="https://iotools.cloud/zh/privacy-policy/" class="text-muted">隐私政策</a></li> <li class="nav-item"><a href="https://iotools.cloud/zh/terms-of-service/" class="text-muted">服务条款</a></li> <li class="nav-item"><a href="https://iotools.statuspage.io/" target="_blank" rel="noopener" class="text-muted">系统状态</a></li> <li class="nav-item"><a href="https://iotools.cloud/zh/sitemap/" class="text-muted">网站地图</a></li> <li class="nav-item blue mb-2 mb-xl-0 d-none d-lg-block"> • </li> <li class="d-block w-100 d-lg-none"></li> <li class="nav-item"><a href="https://x.com/io_tools" target="_blank" rel="noopener" class="text-muted" aria-label="X"><i class="ti ti-brand-x" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.facebook.com/iotools.cloud" target="_blank" rel="noopener" class="text-muted" aria-label="Facebook"><i class="ti" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.youtube.com/@io-tools" target="_blank" rel="noopener" class="text-muted" aria-label="YouTube"><i class="ti" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.tiktok.com/@iotools" target="_blank" rel="noopener" class="text-muted" aria-label="抖音"><i class="ti" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.linkedin.com/company/io-tools/" target="_blank" rel="noopener" class="text-muted" aria-label="领英"><i class="ti ti-brand-linkedin" data-no-translation=""></i></a></li> <li class="nav-item"><a href="https://www.producthunt.com/products/io-tools" target="_blank" rel="noopener" class="text-muted" aria-label="产品搜寻"><i class="ti ti-brand-producthunt" data-no-translation=""></i></a></li> </ul> </footer> <div class="bsa-gap d-none d-xl-block" style="height: 110px;"> </div> <div class="bsa-gap d-xl-none" style="height: 60px;"> </div> <style> body:has(>.bsa_fixed-leaderboard[style*="display: none"]) .bsa-gap { display: none !important; } </style> </div> <template id="tp-language" data-tp-language="zh_CN"></template><script type="speculationrules"> {"prerender":[{"source":"document","where":{"and":[{"href_matches":"/zh/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/iotools/*","/zh/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prerender, .no-prerender a"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"moderate"}]} </script> <style> #ioEmailHtml { font-size: 12px; line-height: 1.5; max-height: 320px; overflow: auto; } #ioEmailPreview { margin-bottom: 14px; border: 1px solid #ced4da; border-radius: 12px; background-color: #fff; overflow: hidden; min-height: 360px; } #ioEmailPreview .email-preview-empty { color: #6c757d; font-style: italic; padding: 24px 18px; text-align: center; font-family: var(--bs-font-sans-serif), sans-serif; } #ioEmailPreview .email-preview-header { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background-color: #f8f9fa; border-bottom: 1px solid #e9ecef; font-family: var(--bs-font-sans-serif), sans-serif; font-size: 0.8rem; color: #495057; } #ioEmailPreview .email-preview-header strong { font-weight: 600; color: #212529; } #ioEmailPreview .email-preview-toolbar { margin-left: auto; display: flex; gap: 4px; } #ioEmailPreview .email-preview-btn { font-size: 0.75rem; padding: 2px 8px; border: 1px solid #adb5bd; background-color: #fff; border-radius: 4px; cursor: pointer; color: #212529; } #ioEmailPreview .email-preview-btn:hover { background-color: #f1f3f5; } #ioEmailPreview .email-preview-btn.is-active { background-color: #464aff; border-color: #464aff; color: #fff; } #ioEmailPreview iframe { display: block; width: 100%; border: 0; background-color: #fff; transition: max-width 0.15s ease; } #ioEmailPreview .email-preview-stage { background-color: #eef0f3; padding: 12px; } #ioEmailPreview .email-preview-stage iframe { margin: 0 auto; background-color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.08); } </style> <script type="text/javascript" src="https://iotools.cloud/wp-content/plugins/duracelltomi-google-tag-manager/dist/js/gtm4wp-form-move-tracker.js?ver=1.22.3" id="gtm4wp-form-move-tracker-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-content/plugins/translatepress-multilingual/assets/js/trp-clickable-ls.js?ver=2.9.12" id="trp-clickable-ls-js-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-includes/js/underscore.min.js?ver=1.13.7" id="underscore-js"></script> <script type="text/javascript" id="theme-js-js-extra"> /* <![CDATA[ */ var IOTools = {"ajaxUrl":"https://iotools.cloud/wp-admin/admin-ajax.php","assetsUrl":"https://iotools.cloud/wp-content/themes/iotools/assets/","homeUrl":"https://iotools.cloud/zh/","isMobile":"","currentPostId":"314379","turnstileSiteKey":"0x4AAAAAABroE5_aI0mWeJ_q","algoliaAppId":"1P44EFZA6Z","algoliaApiKey":"430f43bbda2ef03c2d61fbdf33bae284","urlRequests":"/requests/","creditsCap":"10","pondUploader":null,"tagColors":{"Accessibility":"indigo","AI":"red","arithmetic":"blue","Art":"orange","Backend":"red","base conversion":"blue","Base64":"blue","Beta":"red","Binary":"blue","Calculator":"blue","Character Classes":"blue","Color":"yellow","Couple":"blue","Creator":"blue","Cryptography":"yellow","CSS":"indigo","CSV":"green","Data":"gray","decimal":"blue","Decode":"yellow","Decrypt":"red","Designer":"cyan","Developer":"orange","devops":"blue","DnD":"blue","Education":"lime","Encode":"indigo","Encoding":"blue","Encryption":"blue","evaluation":"blue","Fantasy":"lime","Fiction":"blue","Finance":"green","Frontend":"red","Fun":"violet","Gaming":"blue","Generator":"blue","Git":"blue","Graphics":"red","Health":"orange","hex":"blue","History":"green","HTML":"green","Ideas":"orange","Identity":"lime","Image":"orange","instant calculation":"blue","integer":"blue","IPv6":"blue","Javascript":"orange","JPG":"blue","JSON":"yellow","logarithm":"blue","Lookup":"gray","MAC address":"blue","Magic":"yellow","Markdown":"blue","Marketing":"orange","mask":"blue","Match":"blue","Math":"yellow","MD5":"indigo","Minecraft":"blue","Music":"blue","Must Try":"red","Mythical":"blue","Networking":"blue","number systems":"blue","obfuscate":"blue","octal":"blue","PDF":"yellow","Performance":"green","Planning":"yellow","PNG":"blue","privacy":"blue","Productivity":"green","programming":"blue","Random":"red","Scheduling":"blue","Science":"blue","Security":"yellow","SEO":"orange","Social":"indigo","Sports":"blue","Statistics":"green","string":"blue","SVG":"orange","sysadmin":"blue","Testing":"orange","Text":"green","Time":"blue","trigonometry":"blue","ULA":"blue","Utilities":"blue","Video":"indigo","Wellness":"orange","Wizard":"blue","World":"blue","XML":"orange","YAML":"blue"},"translations":{"copiedDeepLink":"\u5df2\u5c06\u6df1\u5c42\u94fe\u63a5\u590d\u5236\u5230\u526a\u8d34\u677f\uff01","copiedText":"\u5df2\u590d\u5236\u5230\u526a\u8d34\u677f\uff01","copiedImage":"\u5df2\u5c06\u56fe\u50cf\u590d\u5236\u5230\u526a\u8d34\u677f\uff01","generatedContentAppearsHere":"\u7ed3\u679c\u5c06\u663e\u793a\u5728\u8fd9\u91cc...","confirmOverwriteContent":"\u5f53\u524d\u5185\u5bb9\u5c06\u88ab\u66ff\u6362\u5417\uff1f","invalidBase64String":"\u65e0\u6548\u7684 base64 \u5b57\u7b26\u4e32","timeoutReached":"\u627e\u5230\u54c8\u5e0c\u4e4b\u524d\u5df2\u8d85\u65f6\u3002","allCombinationsTried":"\u5df2\u5c1d\u8bd5\u6240\u6709\u7ec4\u5408\uff0c\u4f46\u672a\u627e\u5230\u54c8\u5e0c\u503c\u3002\u8c03\u6574\u8bbe\u7f6e\u5e76\u91cd\u8bd5\u3002","useThisFont":"\u4f7f\u7528\u6b64\u5b57\u4f53","noFileTypesDetected":"\u672a\u68c0\u6d4b\u5230\u6587\u4ef6\u7c7b\u578b\u3002\u539f\u59cb\u5185\u5bb9\u53ef\u80fd\u53ea\u662f\u6587\u672c\u6587\u4ef6\u6216\u5b57\u7b26\u4e32\u3002","noResults":"\u672a\u627e\u5230\u7ed3\u679c","loadMore":"\u88c5\u8f7d\u66f4\u591a","decodedString":"\u89e3\u7801\u540e\u7684\u5b57\u7b26\u4e32","yes":"\u662f\u7684","no":"\u4e0d","team":"\u56e2\u961f","detectedFile":"\u68c0\u6d4b\u5230\u7684\u6587\u4ef6","download":"\u4e0b\u8f7d","converting":"\u6b63\u5728\u8f6c\u6362...","compressing":"\u6b63\u5728\u538b\u7f29\u2026","tapToRemove":"\u70b9\u6309\u5373\u53ef\u79fb\u9664","serverUploaded":"\u5df2\u4e0a\u4f20\u81f3\u670d\u52a1\u5668","validationPassed":"\u5df2\u901a\u8fc7\u9a8c\u8bc1","validationFailed":"\u9a8c\u8bc1\u5931\u8d25","validationIndependently":"\u751f\u6210\u7684\u4ee3\u7801\u7ecf\u8fc7\u72ec\u7acb\u9a8c\u8bc1","pokemon":{"generation":"\u4e00\u4ee3","hp":"\u60e0\u666e","speed":"\u901f\u5ea6","attack":"\u653b\u51fb","defense":"\u9632\u5fa1","spAttack":"\u7279\u6b8a\u653b\u51fb","spDefense":"\u7279\u6b8a\u9632\u536b"},"browserInfo":{"userAgent":"\u7528\u6237\u4ee3\u7406","language":"\u8bed\u8a00","windowSize":"\u7a97\u53e3\u5927\u5c0f","pdfViewerEnabled":"\u5df2\u542f\u7528 PDF \u67e5\u770b\u5668","javascriptEnabled":"\u5df2\u542f\u7528 JavaScript","cookiesEnabled":"\u5df2\u542f\u7528 Cookie","browser":"\u6d4f\u89c8\u5668","browserMajorVersion":"\u6d4f\u89c8\u5668\u4e3b\u7248\u672c","browserVersion":"\u6d4f\u89c8\u5668\u7248\u672c","layoutEngine":"\u5e03\u5c40\u5f15\u64ce","deviceMemory":"\u8bbe\u5907\u5185\u5b58","maxTouchPoints":"\u6700\u5927\u63a5\u89e6\u70b9\u6570","screenSize":"\u5c4f\u5e55\u5c3a\u5bf8","orientation":"\u65b9\u5411","colorDepth":"\u989c\u8272\u6df1\u5ea6","pixelRatio":"\u50cf\u7d20\u6bd4\u4f8b","os":"\u64cd\u4f5c\u7cfb\u7edf","osVersion":"\u64cd\u4f5c\u7cfb\u7edf\u7248\u672c","deviceType":"\u8bbe\u5907\u7c7b\u578b","deviceVendor":"\u8bbe\u5907\u4f9b\u5e94\u5546","deviceModel":"\u8bbe\u5907\u578b\u53f7"},"splits":"\u5206\u88c2","noImagesSelected":"\u8bf7\u4e0a\u4f20\u81f3\u5c11\u4e00\u4e2a\u6587\u4ef6\u3002","errorOccurredAI":"\u65e0\u6cd5\u83b7\u53d6 AI \u5185\u5bb9\u3002\u8bf7\u91cd\u8bd5\u3002","errorOccurredExtractText":"\u65e0\u6cd5\u63d0\u53d6\u6587\u4ef6\u5185\u5bb9\u3002\u8bf7\u91cd\u8bd5\u3002","errorOccurredPokemon":"\u672a\u627e\u5230\u7b26\u5408\u6307\u5b9a\u6807\u51c6\u7684\u795e\u5947\u5b9d\u8d1d\u3002","errorCannotConvert":"\u65e0\u6cd5\u8f6c\u6362","autoComplete":{"Tools":"\u5de5\u5177","Modules":"\u6a21\u5757","SearchForATool":"\u641c\u7d22\u5de5\u5177\u3001\u7c7b\u522b\u6216\u6807\u7b7e...","NoToolsFoundForThisQuery":"\u672a\u627e\u5230\u9488\u5bf9\u8be5\u67e5\u8be2\u7684\u5de5\u5177\u3002","SubmitARequest":"\u63d0\u4ea4\u8bf7\u6c42","WeWillMakeIt":"\u6211\u4eec\u4f1a\u6210\u529f\u7684\uff01","CategoriesFilter":"\u5206\u7c7b\u8fc7\u6ee4\u5668","NoCategoriesFoundForThisQuery":"\u672a\u627e\u5230\u4e0e\u8be5\u67e5\u8be2\u5bf9\u5e94\u7684\u7c7b\u522b\u3002","TagsFilter":"\u6807\u7b7e\u8fc7\u6ee4\u5668","NoTagsFoundForThisQuery":"\u672a\u627e\u5230\u4e0e\u8be5\u67e5\u8be2\u5bf9\u5e94\u7684\u6807\u7b7e\u3002","ToNavigate":"\u5bfc\u822a","ToSelect":"\u9009\u62e9","ToClose":"\u5173\u95ed","ToCancel":"\u53d6\u6d88"}},"defaultSwatches":["#264653","#2a9d8f","#e9c46a","rgb(244,162,97)","#e76f51","#d62828","navy","#07b","#0096c7","#00b4d880","rgba(0,119,182,0.8)"]}; //# sourceURL=theme-js-js-extra /* ]]> */ </script> <script type="text/javascript" src="https://iotools.cloud/wp-content/themes/iotools/dist/main.min.js?ver=eee286b8e098df42c396cba29264f11c" id="theme-js-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-content/themes/iotools/dist/modules/61ea48838d56c794fb1748cfb9bebdfd.min.js?ver=fc3340d2aa99d4f53093da055aeb58b0" id="theme-js-61ea48838d56c794fb1748cfb9bebdfd-js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js?ver=eee286b8e098df42c396cba29264f11c" id="highlight-js-js"></script> <script type="text/javascript" src="https://iotools.cloud/wp-content/themes/iotools/assets/libraries/Coloris-0.24.0/dist/coloris.min.js?ver=eee286b8e098df42c396cba29264f11c" id="coloris-js-js"></script> <script id="wp-emoji-settings" type="application/json"> {"baseUrl":"https://s.w.org/images/core/emoji/17.0.2/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/17.0.2/svg/","svgExt":".svg","source":{"concatemoji":"https://iotools.cloud/wp-includes/js/wp-emoji-release.min.js?ver=6.9.1"}} </script> <script type="module"> /* <![CDATA[ */ /*! This file is auto-generated */ const a=JSON.parse(document.getElementById("wp-emoji-settings").textContent),o=(window._wpemojiSettings=a,"wpEmojiSettingsSupports"),s=["flag","emoji"];function i(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function c(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0);const a=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);return t.every((e,t)=>e===a[t])}function p(e,t){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var n=e.getImageData(16,16,1,1);for(let e=0;e<n.data.length;e++)if(0!==n.data[e])return!1;return!0}function u(e,t,n,a){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\udde8\ud83c\uddf6","\ud83c\udde8\u200b\ud83c\uddf6")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!a(e,"\ud83e\u1fac8")}return!1}function f(e,t,n,a){let r;const o=(r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):document.createElement("canvas")).getContext("2d",{willReadFrequently:!0}),s=(o.textBaseline="top",o.font="600 32px Arial",{});return e.forEach(e=>{s[e]=t(o,e,n,a)}),s}function r(e){var t=document.createElement("script");t.src=e,t.defer=!0,document.head.appendChild(t)}a.supports={everything:!0,everythingExceptFlag:!0},new Promise(t=>{let n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),c.toString(),p.toString()].join(",")+"));",a=new Blob([e],{type:"text/javascript"});const r=new Worker(URL.createObjectURL(a),{name:"wpTestEmojiSupports"});return void(r.onmessage=e=>{i(n=e.data),r.terminate(),t(n)})}catch(e){}i(n=f(s,u,c,p))}t(n)}).then(e=>{for(const n in e)a.supports[n]=e[n],a.supports.everything=a.supports.everything&&a.supports[n],"flag"!==n&&(a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&a.supports[n]);var t;a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&!a.supports.flag,a.supports.everything||((t=a.source||{}).concatemoji?r(t.concatemoji):t.wpemoji&&t.twemoji&&(r(t.twemoji),r(t.wpemoji)))}); //# sourceURL=https://iotools.cloud/wp-includes/js/wp-emoji-loader.min.js /* ]]> */ </script> <script type="text/javascript">(function (undefined) {let scriptOptions={"_localizedStrings":{"redirect_overlay_title":"Hold On","redirect_overlay_text":"You are being redirected to another page,<br>it may take a few seconds.","webview_notification_text":"The selected provider doesn't support embedded browsers!"},"_targetWindow":"prefer-popup","_redirectOverlay":"overlay-with-spinner-and-message","_unsupportedWebviewBehavior":""}; /** * Used when Cross-Origin-Opener-Policy blocked the access to the opener. We can't have a reference of the opened windows, so we should attempt to refresh only the windows that has opened popups. */ window._nslHasOpenedPopup = false; window._nslWebViewNoticeElement = null; window.NSLPopup = function (url, title, w, h) { /** * Cross-Origin-Opener-Policy blocked the access to the opener */ if (typeof BroadcastChannel === "function") { const _nslLoginBroadCastChannel = new BroadcastChannel('nsl_login_broadcast_channel'); _nslLoginBroadCastChannel.onmessage = (event) => { if (window?._nslHasOpenedPopup && event.data?.action === 'redirect') { window._nslHasOpenedPopup = false; const url = event.data?.href; _nslLoginBroadCastChannel.close(); if (typeof window.nslRedirect === 'function') { window.nslRedirect(url); } else { window.opener.location = url; } } }; } const userAgent = navigator.userAgent, mobile = function () { return /\b(iPhone|iP[ao]d)/.test(userAgent) || /\b(iP[ao]d)/.test(userAgent) || /Android/i.test(userAgent) || /Mobile/i.test(userAgent); }, screenX = window.screenX !== undefined ? window.screenX : window.screenLeft, screenY = window.screenY !== undefined ? window.screenY : window.screenTop, outerWidth = window.outerWidth !== undefined ? window.outerWidth : document.documentElement.clientWidth, outerHeight = window.outerHeight !== undefined ? window.outerHeight : document.documentElement.clientHeight - 22, targetWidth = mobile() ? null : w, targetHeight = mobile() ? null : h, left = parseInt(screenX + (outerWidth - targetWidth) / 2, 10), right = parseInt(screenY + (outerHeight - targetHeight) / 2.5, 10), features = []; if (targetWidth !== null) { features.push('width=' + targetWidth); } if (targetHeight !== null) { features.push('height=' + targetHeight); } features.push('left=' + left); features.push('top=' + right); features.push('scrollbars=1'); const newWindow = window.open(url, title, features.join(',')); if (window.focus) { newWindow.focus(); } window._nslHasOpenedPopup = true; return newWindow; }; let isWebView = null; function checkWebView() { if (isWebView === null) { function _detectOS(ua) { if (/Android/.test(ua)) { return "Android"; } else if (/iPhone|iPad|iPod/.test(ua)) { return "iOS"; } else if (/Windows/.test(ua)) { return "Windows"; } else if (/Mac OS X/.test(ua)) { return "Mac"; } else if (/CrOS/.test(ua)) { return "Chrome OS"; } else if (/Firefox/.test(ua)) { return "Firefox OS"; } return ""; } function _detectBrowser(ua) { let android = /Android/.test(ua); if (/Opera Mini/.test(ua) || / OPR/.test(ua) || / OPT/.test(ua)) { return "Opera"; } else if (/CriOS/.test(ua)) { return "Chrome for iOS"; } else if (/Edge/.test(ua)) { return "Edge"; } else if (android && /Silk\//.test(ua)) { return "Silk"; } else if (/Chrome/.test(ua)) { return "Chrome"; } else if (/Firefox/.test(ua)) { return "Firefox"; } else if (android) { return "AOSP"; } else if (/MSIE|Trident/.test(ua)) { return "IE"; } else if (/Safari\//.test(ua)) { return "Safari"; } else if (/AppleWebKit/.test(ua)) { return "WebKit"; } return ""; } function _detectBrowserVersion(ua, browser) { if (browser === "Opera") { return /Opera Mini/.test(ua) ? _getVersion(ua, "Opera Mini/") : / OPR/.test(ua) ? _getVersion(ua, " OPR/") : _getVersion(ua, " OPT/"); } else if (browser === "Chrome for iOS") { return _getVersion(ua, "CriOS/"); } else if (browser === "Edge") { return _getVersion(ua, "Edge/"); } else if (browser === "Chrome") { return _getVersion(ua, "Chrome/"); } else if (browser === "Firefox") { return _getVersion(ua, "Firefox/"); } else if (browser === "Silk") { return _getVersion(ua, "Silk/"); } else if (browser === "AOSP") { return _getVersion(ua, "Version/"); } else if (browser === "IE") { return /IEMobile/.test(ua) ? _getVersion(ua, "IEMobile/") : /MSIE/.test(ua) ? _getVersion(ua, "MSIE ") : _getVersion(ua, "rv:"); } else if (browser === "Safari") { return _getVersion(ua, "Version/"); } else if (browser === "WebKit") { return _getVersion(ua, "WebKit/"); } return "0.0.0"; } function _getVersion(ua, token) { try { return _normalizeSemverString(ua.split(token)[1].trim().split(/[^\w\.]/)[0]); } catch (o_O) { } return "0.0.0"; } function _normalizeSemverString(version) { const ary = version.split(/[\._]/); return (parseInt(ary[0], 10) || 0) + "." + (parseInt(ary[1], 10) || 0) + "." + (parseInt(ary[2], 10) || 0); } function _isWebView(ua, os, browser, version, options) { switch (os + browser) { case "iOSSafari": return false; case "iOSWebKit": return _isWebView_iOS(options); case "AndroidAOSP": return false; case "AndroidChrome": return parseFloat(version) >= 42 ? /; wv/.test(ua) : /\d{2}\.0\.0/.test(version) ? true : _isWebView_Android(options); } return false; } function _isWebView_iOS(options) { const document = (window["document"] || {}); if ("WEB_VIEW" in options) { return options["WEB_VIEW"]; } return !("fullscreenEnabled" in document || "webkitFullscreenEnabled" in document || false); } function _isWebView_Android(options) { if ("WEB_VIEW" in options) { return options["WEB_VIEW"]; } return !("requestFileSystem" in window || "webkitRequestFileSystem" in window || false); } const options = {}, nav = window.navigator || {}, ua = nav.userAgent || "", os = _detectOS(ua), browser = _detectBrowser(ua), browserVersion = _detectBrowserVersion(ua, browser); isWebView = _isWebView(ua, os, browser, browserVersion, options); } return isWebView; } function isAllowedWebViewForUserAgent(provider) { const facebookAllowedWebViews = [ 'Instagram', 'FBAV', 'FBAN' ]; let whitelist = []; if (provider && provider === 'facebook') { whitelist = facebookAllowedWebViews; } const nav = window.navigator || {}, ua = nav.userAgent || ""; if (whitelist.length && ua.match(new RegExp(whitelist.join('|')))) { return true; } return false; } function disableButtonInWebView(providerButtonElement) { if (providerButtonElement) { providerButtonElement.classList.add('nsl-disabled-provider'); providerButtonElement.setAttribute('href', '#'); providerButtonElement.addEventListener('pointerdown', (e) => { if (!window._nslWebViewNoticeElement) { window._nslWebViewNoticeElement = document.createElement('div'); window._nslWebViewNoticeElement.id = "nsl-notices-fallback"; window._nslWebViewNoticeElement.addEventListener('pointerdown', function (e) { this.parentNode.removeChild(this); window._nslWebViewNoticeElement = null; }); const webviewNoticeHTML = '<div class="error"><p>' + scriptOptions._localizedStrings.webview_notification_text + '</p></div>'; window._nslWebViewNoticeElement.insertAdjacentHTML("afterbegin", webviewNoticeHTML); document.body.appendChild(window._nslWebViewNoticeElement); } }); } } window._nslDOMReady(function () { window.nslRedirect = function (url) { if (scriptOptions._redirectOverlay) { const overlay = document.createElement('div'); overlay.id = "nsl-redirect-overlay"; let overlayHTML = ''; const overlayContainer = "<div id='nsl-redirect-overlay-container'>", overlayContainerClose = "</div>", overlaySpinner = "<div id='nsl-redirect-overlay-spinner'></div>", overlayTitle = "<p id='nsl-redirect-overlay-title'>" + scriptOptions._localizedStrings.redirect_overlay_title + "</p>", overlayText = "<p id='nsl-redirect-overlay-text'>" + scriptOptions._localizedStrings.redirect_overlay_text + "</p>"; switch (scriptOptions._redirectOverlay) { case "overlay-only": break; case "overlay-with-spinner": overlayHTML = overlayContainer + overlaySpinner + overlayContainerClose; break; default: overlayHTML = overlayContainer + overlaySpinner + overlayTitle + overlayText + overlayContainerClose; break; } overlay.insertAdjacentHTML("afterbegin", overlayHTML); document.body.appendChild(overlay); } window.location = url; }; let targetWindow = scriptOptions._targetWindow || 'prefer-popup', lastPopup = false; document.addEventListener('click', function (e) { if (e.target) { const buttonLinkElement = e.target.closest('a[data-plugin="nsl"][data-action="connect"]') || e.target.closest('a[data-plugin="nsl"][data-action="link"]'); if (buttonLinkElement) { if (lastPopup && !lastPopup.closed) { e.preventDefault(); lastPopup.focus(); } else { let href = buttonLinkElement.href, success = false; if (href.indexOf('?') !== -1) { href += '&'; } else { href += '?'; } const redirectTo = buttonLinkElement.dataset.redirect; if (redirectTo === 'current') { href += 'redirect=' + encodeURIComponent(window.location.href) + '&'; } else if (redirectTo && redirectTo !== '') { href += 'redirect=' + encodeURIComponent(redirectTo) + '&'; } if (targetWindow !== 'prefer-same-window' && checkWebView()) { targetWindow = 'prefer-same-window'; } if (targetWindow === 'prefer-popup') { lastPopup = NSLPopup(href + 'display=popup', 'nsl-social-connect', buttonLinkElement.dataset.popupwidth, buttonLinkElement.dataset.popupheight); if (lastPopup) { success = true; e.preventDefault(); } } else if (targetWindow === 'prefer-new-tab') { const newTab = window.open(href + 'display=popup', '_blank'); if (newTab) { if (window.focus) { newTab.focus(); } success = true; window._nslHasOpenedPopup = true; e.preventDefault(); } } if (!success) { window.location = href; e.preventDefault(); } } } } }); let buttonCountChanged = false; const googleLoginButtons = document.querySelectorAll(' a[data-plugin="nsl"][data-provider="google"]'); if (googleLoginButtons.length && checkWebView()) { googleLoginButtons.forEach(function (googleLoginButton) { if (scriptOptions._unsupportedWebviewBehavior === 'disable-button') { disableButtonInWebView(googleLoginButton); } else { googleLoginButton.remove(); buttonCountChanged = true; } }); } const facebookLoginButtons = document.querySelectorAll(' a[data-plugin="nsl"][data-provider="facebook"]'); if (facebookLoginButtons.length && checkWebView() && /Android/.test(window.navigator.userAgent) && !isAllowedWebViewForUserAgent('facebook')) { facebookLoginButtons.forEach(function (facebookLoginButton) { if (scriptOptions._unsupportedWebviewBehavior === 'disable-button') { disableButtonInWebView(facebookLoginButton); } else { facebookLoginButton.remove(); buttonCountChanged = true; } }); } const separators = document.querySelectorAll('div.nsl-separator'); if (buttonCountChanged && separators.length) { separators.forEach(function (separator) { const separatorParentNode = separator.parentNode; if (separatorParentNode) { const separatorButtonContainer = separatorParentNode.querySelector('div.nsl-container-buttons'); if (separatorButtonContainer && !separatorButtonContainer.hasChildNodes()) { separator.remove(); } } }) } });})();</script> <div id="io-modal-login" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-dialog-scrollable modal-md" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">需要登录</h5> <button type="button" class="close" data-dismiss="modal" aria-label="关闭"> <i class="ti ti-x" aria-hidden="true" data-no-translation=""></i> </button> </div> <div class="modal-body"> 请 <a class="white bg-blue rounded p-1 pl-1 pr-2" rel="nofollow" href="https://iotools.cloud/zh/account/"><i class="ti ti-user-circle" data-no-translation=""></i> 登入</a> 或 <a rel="nofollow" href="https://iotools.cloud/zh/register/"><u>登记</u></a> 管理您的书签。免费！ </div> </div> </div> </div> <div id="io-modal-request" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-dialog-scrollable modal-md" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">需要登录</h5> <button type="button" class="close" data-dismiss="modal" aria-label="关闭"> <i class="ti ti-x" aria-hidden="true" data-no-translation=""></i> </button> </div> <div class="modal-body"> 请 <a class="white bg-blue rounded p-1 pl-1 pr-2" rel="nofollow" href="https://iotools.cloud/zh/account/?redirect_to=https://iotools.cloud/zh/account/request-tool/"><i class="ti ti-user-circle" data-no-translation=""></i> 登入</a> 或 <a rel="nofollow" href="https://iotools.cloud/zh/register/?redirect_to=https://iotools.cloud/zh/account/request-tool/"><u>登记</u></a> 提交工具请求。免费！ </div> </div> </div> </div> <div id="io-modal-community" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-dialog-scrollable modal-md" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">需要登录</h5> <button type="button" class="close" data-dismiss="modal" aria-label="关闭"> <i class="ti ti-x" aria-hidden="true" data-no-translation=""></i> </button> </div> <div class="modal-body"> 请 <a class="white bg-blue rounded p-1 pl-1 pr-2" rel="nofollow" href="https://iotools.cloud/zh/account/?redirect_to=https://iotools.cloud/zh/account/byo/"><i class="ti ti-user-circle" data-no-translation=""></i> 登入</a> 或 <a rel="nofollow" href="https://iotools.cloud/zh/register/?redirect_to=https://iotools.cloud/zh/account/byo/"><u>登记</u></a> 构建您自己的工具。它是免费的！ <div class="card mt-4 mb-0"> <div class="card-body"> <h5><i class="ti ti-info-circle" data-no-translation=""></i> 关于自建 (BYO) 建造者</h5> <p>我们的 BYO Builder 功能让您无需任何编码知识即可创建自定义工具。您可以：</p> <ul> <li>使用我们简单的界面创建人工智能工具</li> <li>与社区分享您的工具</li> <li>获取反馈并改进您的工具</li> <li>利用你的创作帮助他人解决问题</li> </ul> <p class="mb-0">加入我们 <a href="https://iotools.cloud/zh/community-tools/"><u>社区</u></a> 今天就开始构建能够带来改变的工具吧！</p> </div> </div> </div> </div> </div> </div> <div id="cf-turnstile" data-sitekey="0x4AAAAAABroE5_aI0mWeJ_q" data-appearance="execute"></div> </body> </html>