0%

4

自动摘要: New:HTML5新标签 基础&格式 |标签|描述| ||| | 基础 || |[<!DOCTYPE>](https://www.runo ……..

New : HTML5 新标签

基础&格式

标签 描述

基础

| |
| <!DOCTYPE> | 定义文档类型。 |
| | 定义一个 HTML 文档 |
| </a> | 为文档定义一个标题 |<br>| <a href="https://www.runoob.com/tags/tag-body.html"><body></a> | 定义文档的主体 |<br>| <a href="https://www.runoob.com/tags/tag-hn.html"><h1> to <h6></a> | 定义 HTML 标题 |<br>| <a href="https://www.runoob.com/tags/tag-p.html"><p></a> | 定义一个段落 |<br>| <a href="https://www.runoob.com/tags/tag-br.html"><br></a> | 定义简单的折行。 |<br>| <a href="https://www.runoob.com/tags/tag-hr.html"><hr></a> | 定义水平线。 |<br>| <a href="https://www.runoob.com/tags/tag-comment.html"><!--...--></a> | 定义一个注释 |<br>| </p> <h1 id="格式"><a href="#格式" class="headerlink" title="格式"></a>格式</h1><p> | |<br>| <a href="https://www.runoob.com/tags/tag-abbr.html"><abbr></a> | 定义一个缩写。 |<br>| <a href="https://www.runoob.com/tags/tag-address.html"><address></a> | 定义文档作者或拥有者的联系信息。 |<br>| <a href="https://www.runoob.com/tags/tag-b.html"><b></a> | 定义粗体文本。 |<br>| <a href="https://www.runoob.com/tags/tag-bdi.html"><bdi></a><strong>New</strong> | 允许设置一段文本,使其脱离其父元素的文本方向设置。 |<br>| <a href="https://www.runoob.com/tags/tag-bdo.html"><bdo></a> | 定义文本的方向。 |<br>| <a href="https://www.runoob.com/tags/tag-blockquote.html"><blockquote></a> | 定义块引用。 |<br>| <a href="https://www.runoob.com/tags/tag-cite.html"><cite></a> | 定义引用(citation)。 |<br>| <a href="https://www.runoob.com/tags/tag-code.html"><code></a> | 定义计算机代码文本。 |<br>| <a href="https://www.runoob.com/tags/tag-del.html"><del></a> | 定义被删除文本。 |<br>| <a href="https://www.runoob.com/tags/tag-dfn.html"><dfn></a> | 定义定义项目。 |<br>| <a href="https://www.runoob.com/tags/tag-em.html"><em></a> | 定义强调文本。 |<br>| <a href="https://www.runoob.com/tags/tag-i.html"><i></a> | 定义斜体文本。 |<br>| <a href="https://www.runoob.com/tags/tag-ins.html"><ins></a> | 定义被插入文本。 |<br>| <a href="https://www.runoob.com/tags/tag-kbd.html"><kbd></a> | 定义键盘文本。 |<br>| <a href="https://www.runoob.com/tags/tag-mark.html"><mark></a><strong>New</strong> | 定义带有记号的文本。 |<br>| <a href="https://www.runoob.com/tags/tag-meter.html"><meter></a><strong>New</strong> | 定义度量衡。仅用于已知最大和最小值的度量。 |<br>| <a href="https://www.runoob.com/tags/tag-pre.html"><pre></a> | 定义预格式文本 |<br>| <a href="https://www.runoob.com/tags/tag-progress.html"><progress></a><strong>New</strong> | 定义运行中的任务进度(进程)。 |<br>| <a href="https://www.runoob.com/tags/tag-q.html"><q></a> | 定义短的引用。 |<br>| <a href="https://www.runoob.com/tags/tag-rp.html"><rp></a><strong>New</strong> | 定义不支持 ruby 元素的浏览器所显示的内容。 |<br>| <a href="https://www.runoob.com/tags/tag-rt.html"><rt></a><strong>New</strong> | 定义字符(中文注音或字符)的解释或发音。 |<br>| <a href="https://www.runoob.com/tags/tag-ruby.html"><ruby></a><strong>New</strong> | 定义 ruby 注释(中文注音或字符)。 |<br>| <a href="https://www.runoob.com/tags/tag-s.html"><s></a> | 定义加删除线的文本。 |<br>| <a href="https://www.runoob.com/tags/tag-samp.html"><samp></a> | 定义计算机代码样本。 |<br>| <a href="https://www.runoob.com/tags/tag-small.html"><small></a> | 定义小号文本。 |<br>| <a href="https://www.runoob.com/tags/tag-strong.html"><strong></a> | 定义语气更为强烈的强调文本。 |<br>| <a href="https://www.runoob.com/tags/tag-sub.html"><sub></a> | 定义下标文本。 |<br>| <a href="https://www.runoob.com/tags/tag-sup.html"><sup></a> | 定义上标文本。 |<br>| <a href="https://www.runoob.com/tags/tag-time.html"><time></a><strong>New</strong> | 定义一个日期/时间 |<br>| <a href="https://www.runoob.com/tags/tag-u.html"><u></a> | 定义下划线文本。 |<br>| <a href="https://www.runoob.com/tags/tag-var.html"><var></a> | 定义文本的变量部分。 |<br>| <a href="https://www.runoob.com/tags/tag-wbr.html"><wbr></a><strong>New</strong> | 规定在文本中的何处适合添加换行符。 |</p> <h1 id="表单"><a href="#表单" class="headerlink" title="表单"></a>表单</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-form.html"><form></a></td> <td>定义一个 HTML 表单,用于用户输入。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-input.html"><input></a></td> <td>定义一个输入控件</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-textarea.html"><textarea></a></td> <td>定义多行的文本输入控件。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-button.html"><button></a></td> <td>定义按钮。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-select.html"><select></a></td> <td>定义选择列表(下拉列表)。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-optgroup.html"><optgroup></a></td> <td>定义选择列表中相关选项的组合。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-option.html"><option></a></td> <td>定义选择列表中的选项。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-label.html"><label></a></td> <td>定义 input 元素的标注。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-fieldset.html"><fieldset></a></td> <td>定义围绕表单中元素的边框。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-legend.html"><legend></a></td> <td>定义 fieldset 元素的标题。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-datalist.html"><datalist></a><strong>New</strong></td> <td>规定了 input 元素可能的选项列表。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-keygen.html"><keygen></a><strong>New</strong></td> <td>规定用于表单的密钥对生成器字段。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-output.html"><output></a><strong>New</strong></td> <td>定义一个计算的结果</td> </tr> </tbody></table> <h1 id="框架"><a href="#框架" class="headerlink" title="框架"></a>框架</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-iframe.html"><iframe></a></td> <td>定义内联框架。</td> </tr> </tbody></table> <h1 id="图像"><a href="#图像" class="headerlink" title="图像"></a>图像</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-img.html"><img></a></td> <td>定义图像。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-map.html"><map></a></td> <td>定义图像映射。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-area.html"><area></a></td> <td>定义图像地图内部的区域。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-canvas.html"><canvas></a><strong>New</strong></td> <td>通过脚本(通常是 JavaScript)来绘制图形(比如图表和其他图像)。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-figcaption.html"><figcaption></a><strong>New</strong></td> <td>定义一个 caption for a <figure> element</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-figure.html"><figure></a><strong>New</strong></td> <td>figure 标签用于对元素进行组合。</td> </tr> </tbody></table> <h1 id="Audio-Video"><a href="#Audio-Video" class="headerlink" title="Audio/Video"></a>Audio/Video</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-audio.html"><audio></a><strong>New</strong></td> <td>定义声音,比如音乐或其他音频流。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-source.html"><source></a><strong>New</strong></td> <td>定义media元素 (<video> 和 <audio>)的媒体资源。media</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-track.html"><track></a><strong>New</strong></td> <td>为媒体(<video> 和 <audio>)元素定义外部文本轨道。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-video.html"><video></a><strong>New</strong></td> <td>定义一个音频或者视频</td> </tr> </tbody></table> <h1 id="链接"><a href="#链接" class="headerlink" title="链接"></a>链接</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-a.html"><a></a></td> <td>定义一个链接</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-link.html"><link></a></td> <td>定义文档与外部资源的关系。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-main.html"><main></a></td> <td>定义文档的主体部分。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-nav.html"><nav></a><strong>New</strong></td> <td>定义导航链接</td> </tr> </tbody></table> <h1 id="列表"><a href="#列表" class="headerlink" title="列表"></a>列表</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-ul.html"><ul></a></td> <td>定义一个无序列表</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-ol.html"><ol></a></td> <td>定义一个有序列表</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-li.html"><li></a></td> <td>定义一个列表项</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-dl.html"><dl></a></td> <td>定义一个定义列表</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-dt.html"><dt></a></td> <td>定义一个定义定义列表中的项目。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-dd.html"><dd></a></td> <td>定义定义列表中项目的描述。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-menu.html"><menu></a></td> <td>定义菜单列表。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-command.html"><command></a><strong>New</strong></td> <td>定义用户可能调用的命令(比如单选按钮、复选框或按钮)。</td> </tr> </tbody></table> <h1 id="表格"><a href="#表格" class="headerlink" title="表格"></a>表格</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-table.html"><table></a></td> <td>定义一个表格</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-caption.html"><caption></a></td> <td>定义表格标题。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-th.html"><th></a></td> <td>定义表格中的表头单元格。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-tr.html"><tr></a></td> <td>定义表格中的行。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-td.html"><td></a></td> <td>定义表格中的单元。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-thead.html"><thead></a></td> <td>定义表格中的表头内容。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-tbody.html"><tbody></a></td> <td>定义表格中的主体内容。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-tfoot.html"><tfoot></a></td> <td>定义表格中的表注内容(脚注)。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-col.html"><col></a></td> <td>定义表格中一个或多个列的属性值。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-colgroup.html"><colgroup></a></td> <td>定义表格中供格式化的列组。</td> </tr> </tbody></table> <h1 id="样式-节"><a href="#样式-节" class="headerlink" title="样式/节"></a>样式/节</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-style.html"><style></a></td> <td>定义文档的样式信息。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-div.html"><div></a></td> <td>定义文档中的节。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-span.html"><span></a></td> <td>定义文档中的节。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-header.html"><header></a><strong>New</strong></td> <td>定义一个文档头部部分</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-footer.html"><footer></a><strong>New</strong></td> <td>定义一个文档底部</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-section.html"><section></a><strong>New</strong></td> <td>定义了文档的某个区域</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-article.html"><article></a><strong>New</strong></td> <td>定义一个文章内容</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-aside.html"><aside></a><strong>New</strong></td> <td>定义其所处内容之外的内容。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-details.html"><details></a><strong>New</strong></td> <td>定义了用户可见的或者隐藏的需求的补充细节。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-dialog.html"><dialog></a><strong>New</strong></td> <td>定义一个对话框或者窗口</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-summary.html"><summary></a><strong>New</strong></td> <td>定义一个可见的标题。 当用户点击标题时会显示出详细信息。</td> </tr> </tbody></table> <h1 id="元信息"><a href="#元信息" class="headerlink" title="元信息"></a>元信息</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-head.html"><head></a></td> <td>定义关于文档的信息</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-meta.html"><meta></a></td> <td>定义关于 HTML 文档的元信息。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-base.html"><base></a></td> <td>定义页面中所有链接的默认地址或默认目标。</td> </tr> </tbody></table> <h1 id="程序"><a href="#程序" class="headerlink" title="程序"></a>程序</h1><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody><tr> <td><a href="https://www.runoob.com/tags/tag-script.html"><script></a></td> <td>定义客户端脚本。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-noscript.html"><noscript></a></td> <td>定义针对不支持客户端脚本的用户的替代内容。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-embed.html"><embed></a><strong>New</strong></td> <td>定义了一个容器,用来嵌入外部应用或者互动程序(插件)。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-object.html"><object></a></td> <td>定义嵌入的对象。</td> </tr> <tr> <td><a href="https://www.runoob.com/tags/tag-param.html"><param></a></td> <td>定义对象的参数。</td> </tr> </tbody></table> </div> <div class="reward-container"> <div></div> <button onclick="var qr = document.getElementById('qr'); qr.style.display = (qr.style.display === 'none') ? 'block' : 'none';"> 打赏 </button> <div id="qr" style="display: none;"> <div style="display: inline-block;"> <img src="/images/wechatpay.png" alt="SindreYang 微信支付"> <p>微信支付</p> </div> <div style="display: inline-block;"> <img src="/images/alipay.png" alt="SindreYang 支付宝"> <p>支付宝</p> </div> </div> </div> <div> <ul class="post-copyright"> <li class="post-copyright-author"> <strong>本文作者: </strong>SindreYang </li> <li class="post-copyright-link"> <strong>本文链接:</strong> <a href="http://blog.mviai.com/2025/4._%E7%86%9F%E6%82%89_HTML5_%E6%A0%87%E7%AD%BE/" title="4">http://blog.mviai.com/2025/4._熟悉_HTML5_标签/</a> </li> <li class="post-copyright-license"> <strong>版权声明: </strong>本博客所有文章除特别声明外,均采用 <span class="exturl" data-url="aHR0cHM6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL2xpY2Vuc2VzL2J5LW5jLXNhLzQuMC9kZWVkLnpo"><i class="fa fa-fw fa-creative-commons"></i>BY-NC-SA</span> 许可协议。转载请注明出处! </li> </ul> </div> <div class="followme"> <p>欢迎关注我的其它发布渠道</p> <div class="social-list"> <div class="social-item"> <a target="_blank" class="social-link" href="/images/wechat.png"> <span class="icon"> <i class="fa fa-wechat"></i> </span> <span class="label">WeChat</span> </a> </div> </div> </div> <footer class="post-footer"> <div class="post-nav"> <div class="post-nav-item"> <a href="/2025/4._%E7%86%9F%E6%82%89%E7%89%99%E7%A7%91%E5%90%8D%E8%AF%8D/" rel="prev" title="4"> <i class="fa fa-chevron-left"></i> 4 </a></div> <div class="post-nav-item"> <a href="/2025/3D%E5%B5%8C%E4%BD%93%E4%BF%AE%E5%A4%8D-%E5%BD%93%E5%89%8D%E9%97%AE%E9%A2%98%E8%BF%AD%E4%BB%A3/" rel="next" title="3D嵌体修复-当前问题迭代"> 3D嵌体修复-当前问题迭代 <i class="fa fa-chevron-right"></i> </a></div> </div> </footer> </article> </div> <div class="comments"> <div id="SOHUCS"></div> </div> <script> window.addEventListener('tabs:register', () => { let { activeClass } = CONFIG.comments; if (CONFIG.comments.storage) { activeClass = localStorage.getItem('comments_active') || activeClass; } if (activeClass) { let activeTab = document.querySelector(`a[href="#comment-${activeClass}"]`); if (activeTab) { activeTab.click(); } } }); if (CONFIG.comments.storage) { window.addEventListener('tabs:click', event => { if (!event.target.matches('.tabs-comment .tab-content .tab-pane')) return; let commentClass = event.target.classList[1]; localStorage.setItem('comments_active', commentClass); }); } </script> </div> <div class="toggle sidebar-toggle"> <span class="toggle-line toggle-line-first"></span> <span class="toggle-line toggle-line-middle"></span> <span class="toggle-line toggle-line-last"></span> </div> <aside class="sidebar"> <div class="sidebar-inner"> <ul class="sidebar-nav motion-element"> <li class="sidebar-nav-toc"> 文章目录 </li> <li class="sidebar-nav-overview"> 站点概览 </li> </ul> <!--noindex--> <div class="post-toc-wrap sidebar-panel"> <div class="post-toc motion-element"><ol class="nav"><li class="nav-item nav-level-1"><a class="nav-link" href="#%E5%9F%BA%E7%A1%80-%E6%A0%BC%E5%BC%8F"><span class="nav-number">1.</span> <span class="nav-text">基础&格式</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#%E5%9F%BA%E7%A1%80"><span class="nav-number">2.</span> <span class="nav-text">基础</span></a></li></ol></div> </div> <!--/noindex--> <div class="site-overview-wrap sidebar-panel"> <div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person"> <img class="site-author-image" itemprop="image" alt="SindreYang" src="/images/avatar.png"> <p class="site-author-name" itemprop="name">SindreYang</p> <div class="site-description" itemprop="description">沉淀后我愿意做一个温暖的人。有自己的喜好,有自己的原则,有自己的信仰,不急功近利,不浮夸轻薄,宠辱不惊,淡定安逸,心静如水。------不忘初心,方得始终</div> </div> <div class="site-state-wrap motion-element"> <nav class="site-state"> <div class="site-state-item site-state-posts"> <a href="/archives/"> <span class="site-state-item-count">321</span> <span class="site-state-item-name">日志</span> </a> </div> <div class="site-state-item site-state-categories"> <a href="/categories/"> <span class="site-state-item-count">72</span> <span class="site-state-item-name">分类</span></a> </div> </nav> </div> <div class="links-of-author motion-element"> <span class="links-of-author-item"> <span class="exturl" data-url="aHR0cHM6Ly9naXRodWIuY29tL1NpbmRyZVlhbmc=" title="GitHub → https://github.com/SindreYang"><i class="fa fa-fw fa-github"></i>GitHub</span> </span> <span class="links-of-author-item"> <span class="exturl" data-url="bWFpbHRvOnl4QG12aWFpLmNvbQ==" title="E-Mail → mailto:yx@mviai.com"><i class="fa fa-fw fa-envelope"></i>E-Mail</span> </span> </div> <div class="cc-license motion-element" itemprop="license"> <span class="exturl cc-opacity" data-url="aHR0cHM6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL2xpY2Vuc2VzL2J5LW5jLXNhLzQuMC9kZWVkLnpo"><img src="/images/cc-by-nc-sa.svg" alt="Creative Commons"></span> </div> </div> </div> </aside> <div id="sidebar-dimmer"></div> </div> </main> <footer class="footer"> <div class="footer-inner"> <div class="languages"> <label class="lang-select-label"> <i class="fa fa-language"></i> <span>简体中文</span> <i class="fa fa-angle-up" aria-hidden="true"></i> </label> <select class="lang-select" data-canonical=""> <option value="zh-CN" data-href="/2025/4._%E7%86%9F%E6%82%89_HTML5_%E6%A0%87%E7%AD%BE/" selected=""> 简体中文 </option> <option value="en" data-href="/en/2025/4._%E7%86%9F%E6%82%89_HTML5_%E6%A0%87%E7%AD%BE/" selected=""> English </option> </select> </div> <div class="copyright"> © 2018 – <span itemprop="copyrightYear">2025</span> <span class="with-love"> <i class="fa fa-user"></i> </span> <span class="author" itemprop="copyrightHolder">SindreYang</span> </div><!-- 页面点击小红心 --> <script type="text/javascript" src="/js/love.js"></script> <!-- 背景波浪 --> <script color="0,0,255" opacity="0.5" zIndex="-1" count="99" src="https://cdn.jsdelivr.net/npm/canvas-nest.js@1/dist/canvas-nest.js"></script> <!-- 腾讯企业邮箱 --> <style> .bizmail_loginpanel { font-size: 12px; width: 300px; height: auto; background: transparent; margin-left: auto; margin-right: auto; } .bizmail_LoginBox { padding: 10px 15px; } .bizmail_loginpanel form { margin: 0; padding: 0; } .bizmail_loginpanel input.text { font-size: 12px; width: 100px; height: 20px; margin: 0 2px; background-color: transparent; border:1px solid transparent; box-shadow: none; color: black; } .bizmail_loginpanel .bizmail_column { height: 28px; } .bizmail_loginpanel .bizmail_column label { display: block; float: left; width: 30px; height: 24px; line-height: 24px; font-size: 12px; } .bizmail_loginpanel .bizmail_column .bizmail_inputArea { float: left; width: 240px; } .bizmail_loginpanel .bizmail_column span { font-size: 12px; word-wrap: break-word; margin-left: 2px; line-height: 200%; } .bizmail_loginpanel .bizmail_SubmitArea { margin-left: 30px; clear: both; } .bizmail_loginpanel .bizmail_SubmitArea a { font-size: 12px; margin-left: 5px; } .bizmail_loginpanel select { width: 110px; height: 20px; margin: 0 2px; } .bizmail_loginpanel input { background-color: rgba(83, 126, 236, 0.562); } </style> <script type="text/javascript"> function checkInput() { var e = document.form1.uin, i = document.form1.pwd; return 0 == e.value.length ? e.focus() : 0 == i.value.length ? i.focus() : (document.form1.submit(), setTimeout(" document.form1.pwd.value = '' ", 500)), !1 } function writeLoginPanel(e) { if (e && e.domainlist && -1 != e.domainlist.indexOf(".")) { var a = "return checkInput()", t = '<div id="divLoginpanelHor" class="bizmail_loginpanel" style="width:550px;"><div class="bizmail_LoginBox"><form name="form1" action="https://exmail.qq.com/cgi-bin/login" target="_blank" method="post" onsubmit="' + a + '"><input type="hidden" name="firstlogin" value="false" /><input type="hidden" name="errtemplate" value="dm_loginpage" /><input type="hidden" name="aliastype" value="other" /><input type="hidden" name="dmtype" value="bizmail" /><input type="hidden" name="p" value="" /><label>\u8d26\u53f7:</label><input type="text" name="uin" class="text" value="" />@#domainlist#<label>   \u5bc6\u7801:</label><input type="password" name="pwd" class="text" value="" /><input type="submit" class="" name="" value="\u767b\u5f55" /> <a href="https://exmail.qq.com/cgi-bin/readtemplate?check=false&t=biz_rf_portal#recovery" target="_blank">\u5fd8\u8bb0\u5bc6\u7801\uff1f</a></form></div></div>', n = '<div id="divLoginpanelVer" class="bizmail_loginpanel"><div class="bizmail_LoginBox"><form name="form1" action="https://exmail.qq.com/cgi-bin/login" target="_blank" method="post" onsubmit="' + a + '"><input type="hidden" name="firstlogin" value="false" /><input type="hidden" name="errtemplate" value="dm_loginpage" /><input type="hidden" name="aliastype" value="other" /><input type="hidden" name="dmtype" value="bizmail" /><input type="hidden" name="p" value="" /><div class="bizmail_column"><label>\u8d26\u53f7:</label><div class="bizmail_inputArea"><input type="text" name="uin" class="text" value="" />@#domainlist#</div></div><div class="bizmail_column"><label>\u5bc6\u7801:</label><div class="bizmail_inputArea"><input type="password" name="pwd" class="text" value="" /></div></div><div class="bizmail_SubmitArea"><input type="submit" class="" name="" style="width:66px;" value="\u767b\u5f55" /><a href="https://exmail.qq.com/cgi-bin/readtemplate?check=false&t=biz_rf_portal#recovery" target="_blank">\u5fd8\u8bb0\u5bc6\u7801\uff1f</a></div></form></div></div>', l = e.domainlist.split(";"); if (1 == l.length) var m = '<span>#domain#</span><input type="hidden" name="domain" value="#domain#" />'.replace(/#domain#/g, l[0]); else { m = '<select name="domain">'; for (i = 0; i < l.length; i++) m += '<option value="' + l[i] + '">' + l[i] + "</option>"; m += "</select>" } e.mode && "vertical" != e.mode && "both" != e.mode || document.write(n.replace(/#domainlist#/g, m)), "horizontal" != e.mode && "both" != e.mode || document.write(t.replace(/#domainlist#/g, m)) } } </script> <script type="text/javascript"> writeLoginPanel({domainlist:"mviai.com", mode:"horizontal"});</script> </div> </footer> </div> <script size="300" alpha="0.6" zIndex="-1" src="/lib/canvas-ribbon/canvas-ribbon.js"></script> <script src="/lib/anime.min.js"></script> <script src="//cdn.jsdelivr.net/npm/medium-zoom@1/dist/medium-zoom.min.js"></script> <script src="/lib/velocity/velocity.min.js"></script> <script src="/lib/velocity/velocity.ui.min.js"></script> <script src="/js/utils.js"></script> <script src="/js/motion.js"></script> <script src="/js/schemes/pisces.js"></script> <script src="/js/next-boot.js"></script> <script defer src="/lib/three/three.min.js"></script> <script defer src="/lib/three/three-waves.min.js"></script> <script src="/js/local-search.js"></script> <script> document.querySelectorAll('.pdfobject-container').forEach(element => { let url = element.dataset.target; let pdfOpenParams = { navpanes : 0, toolbar : 0, statusbar: 0, pagemode : 'thumbs', view : 'FitH' }; let pdfOpenFragment = '#' + Object.entries(pdfOpenParams).map(([key, value]) => `${key}=${encodeURIComponent(value)}`).join('&'); let fullURL = `/lib/pdf/web/viewer.html?file=${encodeURIComponent(url)}${pdfOpenFragment}`; if (NexT.utils.supportsPDFs()) { element.innerHTML = `<embed class="pdfobject" src="${url + pdfOpenFragment}" type="application/pdf" style="height: ${element.dataset.height};">`; } else { element.innerHTML = `<iframe src="${fullURL}" style="height: ${element.dataset.height};" frameborder="0"></iframe>`; } }); </script> <script> NexT.utils.loadComments(document.querySelector('#SOHUCS'), () => { var appid = 'cyxmItxjS'; var conf = 'e5e71132d9086bb54aeeba6e88e87df9'; var width = window.innerWidth || document.documentElement.clientWidth; if (width < 960) { window.document.write('<script id="changyan_mobile_js" charset="utf-8" type="text/javascript" src="https://cy-cdn.kuaizhan.com/upload/mobile/wap-js/changyan_mobile.js?client_id=' + appid + '&conf=' + conf + '"><\/script>'); } else { var loadJs=function(d,a){var c=document.getElementsByTagName("head")[0]||document.head||document.documentElement;var b=document.createElement("script");b.setAttribute("type","text/javascript");b.setAttribute("charset","UTF-8");b.setAttribute("src",d);if(typeof a==="function"){if(window.attachEvent){b.onreadystatechange=function(){var e=b.readyState;if(e==="loaded"||e==="complete"){b.onreadystatechange=null;a()}}}else{b.onload=a}}c.appendChild(b)};loadJs("https://changyan.sohu.com/upload/changyan.js",function(){window.changyan.api.config({appid:appid,conf:conf})}); } }); </script> <script src="https://cy-cdn.kuaizhan.com/upload/plugins/plugins.count.js"></script> <script src="/live2dw/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({"pluginRootPath":"live2dw/","pluginJsPath":"lib/","pluginModelPath":"assets/","tagMode":false,"debug":false,"model":{"jsonPath":"/live2dw/assets/z16.model.json"},"display":{"position":"left","width":75,"height":150},"mobile":{"show":true},"log":false});</script></body> </html>