Java成长之路 —— HTML基础-繁依Fanyi

在这里插入图片描述

1. HTML 概念

HTML,英文全称 Hyper Text Markup Language,翻译过来就是超文本标记语言,这是一种用于创建网页的标准标记语言。

  • 超文本:超文本就是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本

  • 标记语言

    • 标记语言由标签构成的语言,例如 html,xml等,都是标签语言。
      • 标记语言不是编程语言。

HTML 的优点

  • 简易性:HTML版本升级采用超集方式,从而更加灵活方便。
  • 可扩展性:HTML语言的广泛应用带来了加强功能,增加标识符等要求,HTML采取子类元素的方式,为系统扩展带来保证。
  • 平台无关性:DOM为HTML文档定义了一个与平台无关的程序接口,使用该接口不可以控制文档的结构。

学会 HTML 对写博客非常有帮助,比如这篇作业就是使用 markdown 编写的,在markdown中可以内嵌HTML标签,来让自己的文章更好看。例如下面我就使用了 标签来处理了部分文字。
在这里插入图片描述

HTML 是编程语言吗?

不少人初学者可能会认为 HTML 是因为一种编程语言,因为其独特的语法格式。但从本质上来说,HTML 是一种超文本语言,它只是重新定义了文本的格式,并不能进行选择,循环等可以进行逻辑功能的语句。

2. HTML 基础

1. 注意事项:

① HTML 文档后缀名 .html 或者 .htm

② HTML 标签分为:

  1. 围堵标签:有开始标签和结束标签。如
  2. 自闭和标签:开始标签和结束标签在一起。如

③ 标签之间可以嵌套,并且需要正确嵌套,不能你中有我,我中有你

错误
正确

④ 在开始标签中可以定义属性。属性是由键值对构成,值需要用引号(单双都可)引起来

⑤ html的标签不区分大小写,但是建议使用小写。

<html>
		
	<head>
		<title>titletitle>
	head>
	
	<body>
		<FONT color='red'>Hello Worldfont><br/>	
		<font color='green'>Hello Worldfont>
	body>
	
html>

运行结果:
在这里插入图片描述

2. 标签学习:

1. 文件标签:构成html最基本的标签

标签:

标签 说明
html文档的根标签
头标签。用于指定html文档的一些属性。引入外部的资源
</code></td> <td>标题标签。</td> </tr> <tr> <td><code><body></code></td> <td>体标签</td> </tr> <tr> <td><code><!DOCTYPE html></code></td> <td>html5中定义该文档是html文档</td> </tr> </tbody> </table> <h5><a id="2__73"></a>2. 文本标签:和文本有关的标签</h5> <p><strong>标签:</strong></p> <table> <thead> <tr> <th>标签</th> <th>属性</th> <th>属性的属性</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td><code><!-- 注释内容 --></code></td> <td></td> <td></td> <td>注释</td> </tr> <tr> <td><code></p> <h1></code> … <code></p> <h6></code></td> <td></td> <td></td> <td>标题标签,h1~h6:字体大小逐渐递减</td> </tr> <tr> <td><code></p> <p></code></td> <td></td> <td></td> <td>段落标签</td> </tr> <tr> <td><code><br /></code></td> <td></td> <td></td> <td>换行标签</td> </tr> <tr> <td><code></p> <hr> <p></code></td> <td></td> <td></td> <td>展示一条水平线</td> </tr> <tr> <td></td> <td>color</td> <td></td> <td>颜色</td> </tr> <tr> <td></td> <td>width</td> <td></td> <td>宽度</td> </tr> <tr> <td></td> <td>size</td> <td></td> <td>高度</td> </tr> <tr> <td></td> <td>align</td> <td></td> <td>对其方式</td> </tr> <tr> <td></td> <td></td> <td>center</td> <td>居中</td> </tr> <tr> <td></td> <td></td> <td>left</td> <td>左对齐</td> </tr> <tr> <td></td> <td></td> <td>right</td> <td>右对齐</td> </tr> <tr> <td><code><b></code></td> <td></td> <td></td> <td>字体加粗</td> </tr> <tr> <td><code><i></code></td> <td></td> <td></td> <td>字体斜体</td> </tr> <tr> <td><code><font></code></td> <td></td> <td></td> <td>字体标签</td> </tr> <tr> <td><code><center></code></td> <td></td> <td></td> <td>文本居中</td> </tr> </tbody> </table> <h5><a id="3__96"></a>3. 图片标签:</h5> <p><strong>标签:</strong></p> <table> <thead> <tr> <th>标签</th> <th>属性</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td>img</td> <td></td> <td>展示图片</td> </tr> <tr> <td></td> <td>src</td> <td>指定图片的位置</td> </tr> </tbody> </table> <p><strong>示例代码:</strong></p> <pre><code class="prism language-html"><span class="token comment"><!--展示一张图片 img--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>https://tse1-mm.cn.bing.net/th/id/R-C.4d9cd2e53dddfc238a06e750b73cd023?rik=MsMCKPGumufOyQ&riu=http%3a%2f%2fwww.desktx.com%2fd%2ffile%2fwallpaper%2fscenery%2f20170209%2fc2accfe637f86fb6f11949cb8651a09b.jpg&ehk=ia2TVXcow6ygWUVZ1yod5xH4aGd8565SYn6CRpxkNoo%3d&risl=&pid=ImgRaw&r=0<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> </code></pre> <p><strong>结果:</strong><br /> <a href="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-lg.svg" data-src="https://i-blog.csdnimg.cn/blog_migrate/c8aa90c3a14f7486ccb036dd018c001f.png" data-fancybox="images" data-fancybox="images"><img decoding="async" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-lg.svg" data-src="https://i-blog.csdnimg.cn/blog_migrate/c8aa90c3a14f7486ccb036dd018c001f.png" alt="在这里插入图片描述"></a></p> <h5><a id="4__114"></a>4. 列表标签:</h5> <p><strong>标签:</strong></p> <table> <thead> <tr> <th>标签</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td><code></p> <ol></code></td> <td>有序列表</td> </tr> <tr> <td><code></p> <ul></code></td> <td>无序列表</td> </tr> <tr> <td><code></p> <li></code></td> <td>列表的项目</td> </tr> </tbody> </table> <h5><a id="5__121"></a>5. 链接标签:</h5> <p><strong>标签:</strong></p> <table> <thead> <tr> <th>标签</th> <th>属性</th> <th>属性的属性</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td><code><a></code></td> <td></td> <td></td> <td>定义一个超链接</td> </tr> <tr> <td></td> <td>href</td> <td></td> <td>指定访问资源的URL(统一资源定位符)</td> </tr> <tr> <td></td> <td>target</td> <td></td> <td>指定打开资源的方式</td> </tr> <tr> <td></td> <td></td> <td>_self</td> <td>默认值,在当前页面打开</td> </tr> <tr> <td></td> <td></td> <td>_blank</td> <td>在空白页面打开</td> </tr> </tbody> </table> <p><strong>示例代码:</strong></p> <pre><code class="prism language-html"><span class="token comment"><!--点击蓝字打开百度--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">herf</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>https://www.baidu.com/<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>百度<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> </code></pre> <p><strong>效果展示:</strong></p> <p>百度</p> <h5><a id="6_divspan_142"></a>6. div和span:</h5> <table> <thead> <tr> <th>标签</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td><code></p> <div></code></td> <td>每一个div占满一整行。块级标签</td> </tr> <tr> <td><code><span></code></td> <td>文本信息在一行展示,行内标签 内联标签</td> </tr> </tbody> </table> <h5><a id="7_html5_148"></a>7. 语义化标签:html5中为了提高程序的可读性,提供了一些标签。</h5> <p>语义化标签是html5中为了提高程序的可读性,提供了一些标签。</p> <p><strong>标签:</strong></p> <table> <thead> <tr> <th>标签</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td><code></p> <header></code></td> <td>页眉</td> </tr> <tr> <td><code></p> <footer></code></td> <td>页脚</td> </tr> </tbody> </table> <h5><a id="8__159"></a>8. 表格标签:</h5> <table> <thead> <tr> <th>标签</th> <th>属性</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td><code></p> <table></code></td> <td></td> <td>定义表格</td> </tr> <tr> <td></td> <td>width</td> <td>宽度</td> </tr> <tr> <td></td> <td>border</td> <td>边框</td> </tr> <tr> <td></td> <td>cellpadding</td> <td>定义内容和单元格的距离</td> </tr> <tr> <td></td> <td>cellspacing</td> <td>定义单元格之间的距离。如果指定为0,则单元格的线会合为一条、</td> </tr> <tr> <td></td> <td>bgcolor</td> <td>背景色</td> </tr> <tr> <td></td> <td>align</td> <td>对齐方式</td> </tr> <tr> <td><code></p> <tr></code></td> <td></td> <td>定义行</td> </tr> <tr> <td></td> <td>bgcolor</td> <td>背景色</td> </tr> <tr> <td></td> <td>align</td> <td>对齐方式</td> </tr> <tr> <td><code></p> <td></code></td> <td></td> <td>定义单元格</td> </tr> <tr> <td></td> <td>colspan</td> <td>合并列</td> </tr> <tr> <td></td> <td>rowspan</td> <td>合并行</td> </tr> <tr> <td><code></p> <th></code></td> <td></td> <td>定义表头单元格</td> </tr> <tr> <td><code></p> <caption></code></td> <td></td> <td>表格标题</td> </tr> <tr> <td><code></p> <thead></code></td> <td></td> <td>表示表格的头部分</td> </tr> <tr> <td><code></p> <tbody></code></td> <td></td> <td>表示表格的体部分</td> </tr> <tr> <td><code></p> <tfoot></code></td> <td></td> <td>表示表格的脚部分</td> </tr> </tbody> </table> </div> <div class="article-yiyan theme-box text-center radius8 main-shadow yiyan-box"><div data-toggle="tooltip" data-original-title="点击切换一言" class="yiyan"></div></div><div class="em09 muted-3-color"><div><span>©</span> 版权声明</div><div class="posts-copyright">文章版权归作者所有,未经允许请勿转载。</div></div><div class="text-center theme-box muted-3-color box-body separator em09">THE END</div><div class="theme-box article-tags"><a class="but ml6 radius c-blue" title="查看更多分类文章" href="https://www.easyhub.top/category/uncategorized"><i class="fa fa-folder-open-o" aria-hidden="true"></i>未分类</a><br></div> </div> <div class="text-center muted-3-color box-body em09">喜欢就支持一下吧</div><div class="text-center post-actions"><a href="javascript:;" data-action="like" class="action action-like" data-pid="920"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-like"></use></svg><text>点赞</text><count>11</count></a><span class="hover-show dropup action action-share"> <svg class="icon" aria-hidden="true"><use xlink:href="#icon-share"></use></svg><text>分享</text><div class="zib-widget hover-show-con share-button dropdown-menu"><div><a rel="nofollow" class="share-btn qzone" target="_blank" title="QQ空间" href="https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=https://www.easyhub.top/920.html&title=Java成长之路 —— HTML基础-繁依Fanyi-Easy 补给站&pics=https://i-blog.csdnimg.cn/blog_migrate/07e5973f7c98dea7f24b2d42271efe12.png&summary=文章目录 1. HTML 概念2. HTML 基础1. 注意事项:2. 标签学习:1. 文件标签:构成html最基本的标签2. 文本标签:和文本有关的标签3. 图片标签:4. 列表标签:5. 链接标签:6. div和span:7. 语义化标签:html5中为了提高程序的可读性,提供了一些标签。8. 表格标签: 1. HTML 概念 ① HTML,英文全称 Hyper Text Markup Language,翻译过来就是..."><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-qzone-color"></use></svg></icon><text>QQ空间<text></a><a rel="nofollow" class="share-btn weibo" target="_blank" title="微博" href="https://service.weibo.com/share/share.php?url=https://www.easyhub.top/920.html&title=Java成长之路 —— HTML基础-繁依Fanyi-Easy 补给站&pic=https://i-blog.csdnimg.cn/blog_migrate/07e5973f7c98dea7f24b2d42271efe12.png&searchPic=false"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-weibo-color"></use></svg></icon><text>微博<text></a><a rel="nofollow" class="share-btn qq" target="_blank" title="QQ好友" href="https://connect.qq.com/widget/shareqq/index.html?url=https://www.easyhub.top/920.html&title=Java成长之路 —— HTML基础-繁依Fanyi-Easy 补给站&pics=https://i-blog.csdnimg.cn/blog_migrate/07e5973f7c98dea7f24b2d42271efe12.png&desc=文章目录 1. HTML 概念2. HTML 基础1. 注意事项:2. 标签学习:1. 文件标签:构成html最基本的标签2. 文本标签:和文本有关的标签3. 图片标签:4. 列表标签:5. 链接标签:6. div和span:7. 语义化标签:html5中为了提高程序的可读性,提供了一些标签。8. 表格标签: 1. HTML 概念 ① HTML,英文全称 Hyper Text Markup Language,翻译过来就是..."><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-qq-color"></use></svg></icon><text>QQ好友<text></a><a rel="nofollow" class="share-btn poster" poster-share="920" title="海报分享" href="javascript:;"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-poster-color"></use></svg></icon><text>海报分享<text></a><a rel="nofollow" class="share-btn copy" data-clipboard-text="https://www.easyhub.top/920.html" data-clipboard-tag="链接" title="复制链接" href="javascript:;"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-copy-color"></use></svg></icon><text>复制链接<text></a></div></div></span><a href="javascript:;" class="action action-favorite signin-loader" data-pid="920"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-favorite"></use></svg><text>收藏</text><count>45</count></a></div></article><div class="yiyan-box main-bg theme-box text-center box-body radius8 main-shadow"><div data-toggle="tooltip" data-original-title="点击切换一言" class="yiyan"></div></div><div class="user-card zib-widget author"> <div class="card-content mt10 relative"> <div class="user-content"> <div class="user-avatar"><a href="https://www.easyhub.top/author/1"><span class="avatar-img avatar-lg"><img alt="Twilight_Fanyi的头像-Easy 补给站" src="https://www.easyhub.top/wp-content/themes/zibll/img/avatar-default.png" data-src="//www.easyhub.top/wp-content/themes/zibll/img/avatar-default.png" class="lazyload avatar avatar-id-1"></span></a></div> <div class="user-info mt20 mb10"> <div class="user-name flex jc"><name class="flex1 flex ac"><a class="display-name text-ellipsis " href="https://www.easyhub.top/author/1">Twilight_Fanyi</a><img class="lazyload img-icon ml3" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-null.svg" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/user-level-1.png" data-toggle="tooltip" title="LV1" alt="等级-LV1-Easy 补给站"><a href="javascript:;" class="focus-color ml10 follow flex0 signin-loader" data-pid="1"><count><i class="fa fa-heart-o mr3" aria-hidden="true"></i>关注</count></a></name></div> <div class="author-tag mt10 mini-scrollbar"><a class="but c-blue-2 tag-forum-post" data-toggle="tooltip" title="共3篇帖子" href="https://www.easyhub.top/author/1?tab=forum"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-posts"></use></svg>3</a><a class="but c-blue tag-posts" data-toggle="tooltip" title="共3071篇文章" href="https://www.easyhub.top/author/1"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-post"></use></svg>3071</a><a class="but c-green tag-comment" data-toggle="tooltip" title="共0条评论" href="https://www.easyhub.top/author/1?tab=comment"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-comment"></use></svg>0</a><span class="badg c-yellow tag-like" data-toggle="tooltip" title="获得10.6W+个点赞"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-like"></use></svg>10.6W+</span><span class="badg c-red tag-view" data-toggle="tooltip" title="人气值 676W+"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-hot"></use></svg>676W+</span></div> <div class="user-desc mt10 muted-2-color em09">这家伙很懒,什么都没有写...</div> </div> </div> <div class="swiper-container more-posts swiper-scroll"><div class="swiper-wrapper"><div class="swiper-slide mr10"><a href="https://www.easyhub.top/180.html"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="map 方法优化数组遍历指南-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">map 方法优化数组遍历指南-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">map 方法优化数组遍历指南-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>10个月前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6360</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/911.html"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://i-blog.csdnimg.cn/blog_migrate/b9cf918e7494b2b4daaf89b060bcc525.png" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="嵌入式随记 —— 调度器-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">嵌入式随记 —— 调度器-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">嵌入式随记 —— 调度器-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>3年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6360</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/231.html"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://i-blog.csdnimg.cn/blog_migrate/07b0bbc0e75e467a4d39c01fb144ceff.png" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="【问题随记】关于 ElementPlus 样式无法加载完全的问题-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">【问题随记】关于 ElementPlus 样式无法加载完全的问题-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">【问题随记】关于 ElementPlus 样式无法加载完全的问题-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>12个月前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6360</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/170.html"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="Hutool 使用详解-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">Hutool 使用详解-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">Hutool 使用详解-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>10个月前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6358</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/248.html"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="探索RESTful API开发,构建可扩展的Web服务-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">探索RESTful API开发,构建可扩展的Web服务-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">探索RESTful API开发,构建可扩展的Web服务-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>1年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6357</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/283.html"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://i-blog.csdnimg.cn/blog_migrate/168d31eaf9acf4e0ed19c4e16ff66f26.png" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="揭秘Mycat数据库中间件的神奇魔法-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">揭秘Mycat数据库中间件的神奇魔法-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">揭秘Mycat数据库中间件的神奇魔法-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>1年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6357</item></div></div></div></a></div></div><div class="swiper-button-prev"></div><div class="swiper-button-next"></div></div> </div> </div> <div class="theme-box" style="height:99px"> <nav class="article-nav"> <div class="main-bg box-body radius8 main-shadow"> <a href="https://www.easyhub.top/2364.html"> <p class="muted-2-color"><i class="fa fa-angle-left em12"></i><i class="fa fa-angle-left em12 mr6"></i>上一篇</p> <div class="text-ellipsis-2"> 嵌入式随记 —— FreeRTOS 概述-繁依Fanyi </div> </a> </div> <div class="main-bg box-body radius8 main-shadow"> <a href="https://www.easyhub.top/919.html"> <p class="muted-2-color">下一篇<i class="fa fa-angle-right em12 ml6"></i><i class="fa fa-angle-right em12"></i></p> <div class="text-ellipsis-2"> 嵌入式随记 —— RTOS相关概念-繁依Fanyi </div> </a> </div> </nav> </div> <div class="theme-box relates relates-thumb"> <div class="box-body notop"> <div class="title-theme">相关推荐</div> </div><div class="zib-widget"><div class="swiper-container swiper-scroll"><div class="swiper-wrapper"><div class="swiper-slide mr10"><a href="https://www.easyhub.top/911.html"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://i-blog.csdnimg.cn/blog_migrate/b9cf918e7494b2b4daaf89b060bcc525.png" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="嵌入式随记 —— 调度器-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">嵌入式随记 —— 调度器-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">嵌入式随记 —— 调度器-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>3年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6360</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/180.html"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="map 方法优化数组遍历指南-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">map 方法优化数组遍历指南-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">map 方法优化数组遍历指南-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>10个月前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6360</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/231.html"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://i-blog.csdnimg.cn/blog_migrate/07b0bbc0e75e467a4d39c01fb144ceff.png" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="【问题随记】关于 ElementPlus 样式无法加载完全的问题-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">【问题随记】关于 ElementPlus 样式无法加载完全的问题-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">【问题随记】关于 ElementPlus 样式无法加载完全的问题-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>12个月前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6360</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/170.html"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="Hutool 使用详解-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">Hutool 使用详解-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">Hutool 使用详解-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>10个月前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6358</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/283.html"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://i-blog.csdnimg.cn/blog_migrate/168d31eaf9acf4e0ed19c4e16ff66f26.png" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="揭秘Mycat数据库中间件的神奇魔法-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">揭秘Mycat数据库中间件的神奇魔法-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">揭秘Mycat数据库中间件的神奇魔法-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>1年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6357</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.easyhub.top/248.html"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail.svg" alt="探索RESTful API开发,构建可扩展的Web服务-繁依Fanyi-Easy 补给站"><div class="abs-center left-bottom graphic-text text-ellipsis">探索RESTful API开发,构建可扩展的Web服务-繁依Fanyi</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">探索RESTful API开发,构建可扩展的Web服务-繁依Fanyi</div><div class="px12 opacity8 mt6"><item>1年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 6357</item></div></div></div></a></div></div><div class="swiper-button-prev"></div><div class="swiper-button-next"></div></div></div></div><div class="theme-box" id="comments"> <div class="box-body notop"> <div class="title-theme">评论 <small>抢沙发</small></div> </div> <div class="no_webshot main-bg theme-box box-body radius8 main-shadow"> <div class="comment-signarea text-center box-body radius8"> <h3 class="text-muted em12 theme-box muted-3-color">请登录后发表评论</h3> <p> <a href="javascript:;" class="signin-loader but c-blue padding-lg"><i class="fa fa-fw fa-sign-in mr10" aria-hidden="true"></i>登录</a> <a href="javascript:;" class="signup-loader ml10 but c-yellow padding-lg"><svg class="icon mr10" aria-hidden="true"><use xlink:href="#icon-signup"></use></svg>注册</a> </p> <p class="social-separator separator muted-3-color em09">社交账号登录</p><div class="social_loginbar"><a rel="nofollow" title="微信登录" href="https://www.easyhub.top/oauth/weixingzh?rurl=https%3A%2F%2Fwww.easyhub.top%2F920.html" class="social-login-item weixingzh toggle-radius qrcode-signin"><i class="fa fa-weixin" aria-hidden="true"></i></a></div> </div> <div id="postcomments"> <ol class="commentlist list-unstyled"> <div class="text-center comment-null" style="padding:40px 0;"><img class="lazy" style="width:280px;opacity: .7;" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201%201'%3E%3C/svg%3E" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/null.svg"><p style="margin-top:40px;" class="em09 muted-3-color separator">暂无评论内容</p></div><div class="pagenav hide"><div class="next-page ajax-next"><a href="#"></a></div></div> </ol> </div> </div> </div> </div> </div> <div class="sidebar"> </div></main> <div class="container fluid-widget"></div><footer class="footer"> <div class="container-fluid container-footer"> <ul class="list-inline"><li style="max-width: 300px;"><p><a class="footer-logo" href="https://www.easyhub.top" title=""> <img src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-sm.svg" data-src="https://www.easyhub.top/wp-content/uploads/2025/02/下载11.png" switch-src="https://www.easyhub.top/wp-content/uploads/2025/02/下载11.png" alt="Easy 补给站" class="lazyload" style="height: 40px;"> </a></p><div class="footer-muted em09">Zibll 子比主题专为博客、自媒体、资讯类的网站设计开发,简约优雅的设计风格,全面的前端用户功能,简单的模块化配置,欢迎您的体验</div></li><li style="max-width: 550px;"><p class="fcode-links"><a href="https://zibll.com">友链申请</a> <a href="https://zibll.com">免责声明</a> <a href="https://zibll.com">广告合作</a> <a href="https://zibll.com">关于我们</a></p><div class="footer-muted em09">Copyright © 2025 · <a href="https://www.easyhub.top">编程岛</a> · <a target="_blank" href="https://beian.miit.gov.cn/">皖ICP备2022000276号</a></div><div class="footer-contact mt10"><a class="toggle-radius hover-show nowave" href="javascript:;"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-d-wechat"></use></svg><div class="hover-show-con footer-wechat-img"><img style="box-shadow: 0 5px 10px rgba(0,0,0,.2); border-radius:4px;" height="100" class="lazyload" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-sm.svg" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/qrcode.png" alt="扫一扫加微信-Easy 补给站"></div></a><a class="toggle-radius" data-toggle="tooltip" target="_blank" title="QQ联系" href="https://wpa.qq.com/msgrd?v=3&uin=1234567788&site=qq&menu=yes"><svg class="icon" aria-hidden="true" data-viewBox="-50 0 1100 1100" viewBox="-50 0 1100 1100"><use xlink:href="#icon-d-qq"></use></svg></a><a class="toggle-radius" data-toggle="tooltip" title="微博" target="_blank" href="https://weibo.com/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-d-weibo"></use></svg></a><a class="toggle-radius" data-toggle="tooltip" title="发邮件" href="mailto:1234567788@QQ.COM"><svg class="icon" aria-hidden="true" data-viewBox="-20 80 1024 1024" viewBox="-20 80 1024 1024"><use xlink:href="#icon-d-email"></use></svg></a></div></li><li><div class="footer-miniimg" data-toggle="tooltip" title="扫码加QQ群"> <p> <img class="lazyload" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-sm.svg" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/qrcode.png" alt="扫码加QQ群-Easy 补给站"> </p> <span class="opacity8 em09">扫码加QQ群</span> </div><div class="footer-miniimg" data-toggle="tooltip" title="扫码加微信"> <p> <img class="lazyload" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-sm.svg" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/qrcode.png" alt="扫码加微信-Easy 补给站"> </p> <span class="opacity8 em09">扫码加微信</span> </div></li></ul> </div> </footer> <style>::-webkit-scrollbar{width:6px;height:1px}::-webkit-scrollbar-thumb{background-color:#07e6f6;background-image:-webkit-linear-gradient(45deg,rgb(236,174,6)25%,transparent 25%,transparent 50%,rgb(10,77,246)50%,rgb(241,9,28)75%,transparent 75%,transparent)}::-webkit-scrollbar-track{background:white;border-radius:20px}</style> <style> span.float-btn.more-btn.hover-show.nowave { margin-top: 0 } .float-right.round.position-bottom { background: #fff; border-radius: var(--main-radius); transition: 0s; right: 1px; bottom: 170px; border-radius: 20px 0 0 20px; box-shadow: -5px 3px 10px 0 rgb(5 5 5 / 15%) } .float-right.round .float-btn { border-radius: 8px 0 0 17px } .float-right .float-btn { background: #fff } .float-right.round.position-bottom::before { content: ''; width: 30px; height: 60px; background: url(/wp-content/plugins/WaiMaoLa_Diy/img/right/aa1.gif); background-size: cover; display: block; margin: 5px 3px 0 7px; } .dark-theme .float-right.round.position-bottom { background: #414141; border: 1px solid #4a4a4a; transition: 0s } .dark-theme .float-right .float-btn { background: #414141 } .dark-theme .float-right.round.position-bottom a:hover { background: #505255; --this-color: var(--muted-2-color) } .dark-theme .float-right.round.position-bottom span:hover { background: #505255; --this-color: var(--muted-2-color) } span.newadd-btns.hover-show.float-btn.add-btn .hover-show-con.dropdown-menu.drop-newadd>a:hover { background-color: #d8d8d836; border-radius: 8px } a.float-btn.ontop.fade { display: none } </style> <style>#percentageCounter{position:fixed; left:0; top:0; height:3px; z-index:99999; background-image: linear-gradient(to right, #339933,#FF6666);border-radius:5px;}</style> <script>$('head').before('<div id="percentageCounter"></div>');$(window).scroll(function() {var a = $(window).scrollTop(),c = $(document).height(),b = $(window).height();scrollPercent = a / (c - b) * 100;scrollPercent = scrollPercent.toFixed(1);$("#percentageCounter").css({width: scrollPercent + "%"});}).trigger("scroll");</script> <style> /*翻页按钮*/ .pagenav .current { background: linear-gradient(90deg, #7de4d7 0%, #ff89ee 100%); color: #fff !important; } </style> <style> body:after { content: " "; position: fixed; inset: 0; background-color: white; z-index: 999; background-image: url(/wp-content/plugins/WaiMaoLa_Diy/img/index/1154045358.svg); background-repeat: no-repeat; background-position: center; background-size: 30%; animation: fadeOut 3s; animation-fill-mode: forwards; -webkit-transition: fadeOut 3s; transition: fadeOut 3s; pointer-events: none; } @keyframes fadeOut { 50% { opacity: 1; } 100% { opacity: 0; } } </style> <script src="https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//js/fengye.js"></script> <link rel="stylesheet" href="https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//css/yuansufuhao.css" /> <script> $('head').before('<div class="container1"><div class="inner-container1"><div class="shape"></div></div><div class="inner-container1"><div class="shape"></div></div></div>'); </script> <script src="https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//js/yuansufuhao.min.js"></script> <script> $(document).ready(function() { var html = ''; for (var i = 1; i <= 50; i++) { html += '<div class="shape-container--' + i + ' shape-animation"><div class="random-shape"></div></div>' } document.querySelector('.shape').innerHTML += html }); </script> </script> <div class="dimmer"></div> <style> #landlord .landlord-close { opacity: 0; visibility: hidden; width: 20px; height: 20px; line-height: 20px; background: rgb(0, 0, 0); text-align: center; color: #fff; position: absolute; top: 3px; right: 0; border-radius: 50%; font-size: 10px; cursor: pointer; z-index: 1; transition: .2s; } #landlord { user-select: none; position: fixed; left: 30px; bottom: 150px; z-index: 10000; font-size: 0; transition: all .3s ease-in-out; } #landlord .message { opacity: 0; width: 172px; height: auto; margin: auto; padding: 7px; top: -200px; left: -20px; text-align: center; color: #fff; border-radius: 12px; background-color: #0005; box-shadow: 0 3px 15px 2px #eae6e6; font-size: 13px; font-weight: 400; text-overflow: ellipsis; text-transform: uppercase; overflow: hidden; position: absolute; } @media (max-width: 767px) { #landlord .message { display: none; } } </style> <div id="landlord" style="display: block;"> <span class="landlord-close iconfont icon-guanbi" onclick="$('#landlord').hide();$('#flost-landlord').show();"></span> <div class="message" style="opacity: 1;">欢迎访问本站<br>您的访问时本站的荣幸<br>希望您能在本站<br>找到您想要的资源</div> </div> <script type="text/javascript"> jQuery(function () { var text; var now = (new Date()).getHours(); if (now > 24 || now <= 5) { text = '外贸啦提示您 午夜骚年,快睡觉去,妹纸等你太久了会不耐烦的哦!'; } else if (now > 5 && now <= 10) { text = '早上好~今天又是元气满满的一天哦!先去尝尝鲜</a>~'; } else if (now > 10 && now <= 12) { text = '最难的任务适合在上午时段攻克哦,期待您的订单~'; } else if (now > 12 && now <= 14) { text = '中午拿什么填补我空虚的胃和心灵?<br />停下手中的工作,快去吃饭吧,晚了就没的吃了'; } else if (now > 14 && now <= 17) { text = '下午时段外贸啦正在优化细节,力求做一个人见人爱的“细节控”哦~'; } else if (now > 17 && now <= 19) { text = '快要下班了吧?休息会扒根烟喝杯茶~'; } else if (now > 19 && now <= 21) { text = '晚安~音乐、运动、阅读,睡前时间放松一下,灵感也许会悄悄到来!'; } else if (now > 21 && now <= 24) { text = '累了就早点休息~<br />晚间22:00-5:00是最佳睡眠时间哦'; } showMessage(text, 12000); }); function showMessage(text, timeout) { if (Array.isArray(text)) text = text[Math.floor(Math.random() * text.length + 1) - 1]; //console.log('showMessage', text); $('.message').stop(); if (text != undefined) { $('.message').html(text).fadeTo(200, 1); } if (timeout === null) timeout = 6000; hideMessage(timeout); } function hideMessage(timeout) { $('.message').stop().css('opacity', 1); if (timeout === null) timeout = 6000; $('.message').delay(timeout).fadeTo(200, 0); } </script> <style> span.icon-circle { display: none; } </style> <style> .tab-content .posts-item:not(article) { transition: all 0.3s; } .tab-content .posts-item:not(article):hover { transform: translateY(-10px); box-shadow: 0 8px 10px #FFD1D8; } </style> <style> .tab-content .posts-item:not(article):hover { opacity: 1; z-index: 99; border-radius: 20px; transform: translateY(-5px); box-shadow: 0 3px 20px rgba(0, 0, 0, .25); animation: index-link-active 1s cubic-bezier(0.315, 0.605, 0.375, 0.925) forwards; } @keyframes index-link-active { 0% { transform: perspective(2000px) rotateX(0) rotateY(0) translateZ(0); } 16% { transform: perspective(2000px) rotateX(10deg) rotateY(5deg) translateZ(32px); } 100% { transform: perspective(2000px) rotateX(0) rotateY(0) translateZ(65px); } } </style> <style> .theme-pagination .ajax-next a, .theme-pagination .order-ajax-next a { border-radius: 30px; padding: 15px 0; color: var(--muted-color); background-color: var(--main-bg-color); color: #FF0033; display: block; opacity: 1; font-weight: bold; } </style> <style> .item-thumbnail:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0); transition: background .35s; border-radius: 8px; z-index: 2; max-width: 765px; margin: 0 auto; pointer-events: none; } .item-thumbnail:after { content: ''; position: absolute; top: 50%; left: 50%; width: 50px; height: 50px; margin: -25px 0 0 -25px; background: url(/wp-content/plugins/WaiMaoLa_Diy/img/index/st.png); background-repeat: no-repeat; background-size: 100% 100%; z-index: 3; -webkit-transform: scale(2); transform: scale(2); transition: opacity .35s, -webkit-transform .35s; transition: transform .35s, opacity .35s; transition: transform .35s, opacity .35s, -webkit-transform .35s; opacity: 0; pointer-events: none; } .item-thumbnail:hover:before { background: rgba(0, 0, 0, .5) } .item-thumbnail:hover:after { -webkit-transform: scale(1); transform: scale(1); opacity: 1 } </style> <style> .posts-item { position: relative; } .posts-item.card::before { content: ""; display: block; background: #fc625d; top: 10px; left: 15px; border-radius: 50%; width: 10px; height: 10px; box-shadow: 16px 0 #fdbc40, 32px 0 #35cd4b; position: absolute; } .posts-item.card { padding: 26px 10px 10px 10px; } </style> <style> ul.nav { font-weight: 650; } </style> <style> .navbar-nav>li:first-child:before { width: 30px; } .navbar-nav>li:before { width: 60px; top: 23px; background: rgba(0, 0, 0, 0); height: 4px; left: 10px; border-radius: unset; } .navbar-top li.current-menu-item>a, .navbar-top li:hover>a { color: var(--focus-color); } </style> <style>@media screen and (min-width: 1000px){.header-layout-1{position:relative;background-image:url("/wp-content/plugins/WaiMaoLa_Diy/img/navbg/navbg1.gif");background-position:center right;background-size:100% 100%;}}</style> <style> #maomao { position: fixed; bottom: 40px; right: -5px; width: 57px; height: 70px; background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/right/mao.svg); background-position: center; background-size: cover; background-repeat: no-repeat; transition: background .3s; z-index: 99999999999999 } #maomao:hover { background-position: 60px 50%; } </style> <div id="maomao" onmouseout="duoMaomao()" style="bottom: 60vh;"></div> <script> var randomNum = function(minNum, maxNum) { switch (arguments.length) { case 1: return parseInt(Math.random() * minNum + 1, 10); break; case 2: return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10); break; default: return 0; break; }; }; var duoMaomao = function() { var maomao = $('#maomao'); maomao.css('bottom', randomNum(1, 90) + 'vh'); }; </script> <style> #tiaopill { position: fixed; bottom: 40px; right: -5px; width: 57px; height: 70px; background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/right/decorate1.png); background-position: center; background-size: cover; background-repeat: no-repeat; transition: background .3s; z-index: 99999999999999 } #tiaopill:hover { background-position: 60px 50%; } </style> <div id="tiaopill" onmouseout="duoMaomao()" style="bottom: 60vh;"></div> <script> var randomNum = function(minNum, maxNum) { switch (arguments.length) { case 1: return parseInt(Math.random() * minNum + 1, 10); break; case 2: return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10); break; default: return 0; break; }; }; var duoMaomao = function() { var tiaopill = $('#tiaopill'); tiaopill.css('bottom', randomNum(1, 90) + 'vh'); }; </script> <style> /*悬浮按钮渐变颜色*/ .float-right .float-btn { width: 40px; line-height: 40px; display: block; font-size: 1.4em; --this-color: #fff; --this-bg: var(--float-btn-bg); background: linear-gradient(90deg, #fdfffc73 0%, #ff5683 100%); position: relative; color: var(--this-color) !important; } /*悬浮按钮圆形样式*/ .float-right.round .float-btn { margin-top: 5px; border-radius: 20px; } </style> <style> span.float-btn.more-btn.hover-show.nowave { margin-top: 0 } .float-right.round.position-bottom { background: #fff; border-radius: var(--main-radius); transition: 0s; right: 1px; bottom: 170px; border-radius: 20px 0 0 20px; box-shadow: -5px 3px 10px 0 rgb(5 5 5 / 15%) } .float-right.round .float-btn { border-radius: 8px 0 0 17px } .float-right .float-btn { background: #fff } .float-right.round.position-bottom::before { content: ''; width: 30px; height: 60px; background: url(/wp-content/plugins/WaiMaoLa_Diy/img/right/aa1.gif); background-size: cover; display: block; margin: 5px 3px 0 7px; } .dark-theme .float-right.round.position-bottom { background: #414141; border: 1px solid #4a4a4a; transition: 0s } .dark-theme .float-right .float-btn { background: #414141 } .dark-theme .float-right.round.position-bottom a:hover { background: #505255; --this-color: var(--muted-2-color) } .dark-theme .float-right.round.position-bottom span:hover { background: #505255; --this-color: var(--muted-2-color) } span.newadd-btns.hover-show.float-btn.add-btn .hover-show-con.dropdown-menu.drop-newadd>a:hover { background-color: #d8d8d836; border-radius: 8px } a.float-btn.ontop.fade { display: none } </style> <style> .wp-posts-content img:hover { box-shadow: 0px 0px 8px #63B8FF; } </style> <style> .enlighter::before { content: ""; display: block; background: #fc625d; top: 9px; left: 15px; border-radius: 50%; width: 15px; height: 15px; box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b; margin: 0px 2px -7px; z-index: 1; position: absolute; } .enlighter-overflow-scroll.enlighter-v-standard .enlighter { padding: 35px 0 12px 0; } </style> <style> textarea#comment {background-color:transparent;background:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),url("/wp-content/plugins/WaiMaoLa_Diy/img/comments/comment_bg.gif") right 30px bottom 0px no-repeat;-moz-transition:ease-in-out 0.45s;background-size:35%;-webkit-transition:ease-in-out 0.45s;-o-transition:ease-in-out 0.45s;-ms-transition:ease-in-out 0.45s;transition:ease-in-out 0.45s;}textarea#comment:focus {background-position-y:789px;-moz-transition:ease-in-out 0.45s;-webkit-transition:ease-in-out 0.45s;-o-transition:ease-in-out 0.45s;-ms-transition:ease-in-out 0.45s;transition:ease-in-out 0.45s;}';</style> <style> body { --acg-color: #fff8fa; --acg-color2: #f8fdff; } .dark-theme { --acg-color: #323335; --acg-color2: #323335; } #postcomments .commentlist .comment { border-top: 1px solid rgb(50 50 50 / 0%); border-radius: 15px; margin: 0 15px 15px; border: 1px solid; display: flow-root; background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/comments/shading_blue.png); border-color: #71baff80; background-color: var(--acg-color2); } #postcomments .commentlist .comment+.comment { border-top: 1px solid rgb(50 50 50 / 0%); padding: 0 0 15px 0; border-radius: 15px; margin: 0 15px 15px; border: 1px solid; display: flow-root; padding: 10px; } #postcomments .commentlist .comment+.comment:nth-child(odd) { background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/comments/shading_red.png); border-color: #ff8bb5; background-color: var(--acg-color); } #postcomments .commentlist .comment+.comment:nth-child(even) { background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/comments/shading_blue.png); border-color: #71baff80; background-color: var(--acg-color2); } #postcomments .children { background: rgb(116 116 116 / 0%); margin-bottom: 6px; border-radius: 15px; display: flow-root; } #postcomments .children:nth-child(even) { background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/comments/shading_blue.png); border-color: #71baff80; } #postcomments .children:nth-child(odd) { background-image: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/comments/shading_red.png); border-color: #ff8bb5; background-color: var(--acg-color); } </style> <script> var a_idx = 0; jQuery(document).ready(function($) { $("body").click(function(e) { var a = new Array("🍉富强🍉", "🎉虎虎生威🎉", "🍉民主🍉", "🍉文明🍉", "🧧恭喜发财🧧", "🎉金虎送福🎉", "🍉和谐🍉", "🍉自由🍉", "🍉平等🍉", "🎉龙腾虎跃🎉", "关注关注🙈", "🍉公正🍉", "🍉法治🍉", "🍉欢迎光临🍉", "🍉爱国🍉", "🍉诚信🍉", "🍉友善🍉"); var b = new Array("red", "blue", "yellow", "green", "pink", "blue", "orange"); var $i = $("<span/>").text(a[a_idx]); a_idx = (a_idx + 1) % a.length; b_idx = (a_idx + 1) % 7; var x = e.pageX, y = e.pageY; $i.css({ "z-index": 9999, "top": y - 20, "left": x, "position": "absolute", "font-weight": "bold", "color": b[b_idx] }); $("body").append($i); $i.animate({ "top": y - 180, "opacity": 0 }, 1500, function() { $i.remove(); }); }); }); </script> <div class="mouse-cursor cursor-outer"></div> <div class="mouse-cursor cursor-inner"></div> <script src="https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//js/mouse_follow.js"></script> <style> .mouse-cursor { position: fixed; left: 0; top: 0; pointer-events: none; border-radius: 50%; -webkit-transform: translateZ(0); transform: translateZ(0); visibility: hidden; } .cursor-inner { margin-left: -3px; margin-top: -3px; width: 6px; height: 6px; z-index: 10000001; background: #123eed; -webkit-transition: width .3s ease-in-out, height .3s ease-in-out, margin .3s ease-in-out, opacity .3s ease-in-out; transition: width .3s ease-in-out, height .3s ease-in-out, margin .3s ease-in-out, opacity .3s ease-in-out; } .cursor-inner.cursor-hover { margin-left: -18px; margin-top: -18px; width: 36px; height: 36px; background: #123eed !important; opacity: .3; } .cursor-outer { margin-left: -15px; margin-top: -15px; width: 30px; height: 30px; border: 2px solid #123eed !important; -webkit-box-sizing: border-box; box-sizing: border-box; z-index: 10000000; opacity: .5; -webkit-transition: all .08s ease-out; transition: all .08s ease-out; } .cursor-outer.cursor-hover { opacity: 0; } .main-wrapper[data-magic-cursor=hide] .mouse-cursor { display: none; opacity: 0; visibility: hidden; position: absolute; z-index: -1111; } </style> <style> a { text-decoration: none; } div.usercm { background-repeat: no-repeat; background-position: center center; background-size: cover; background-color: #fff; font-size: 13px !important; width: 130px; -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, .3); box-shadow: 0px 0px 15px #333; position: absolute; display: none; z-index: 10000; opacity: 0.9; border-radius: 8px; } div.usercm ul { list-style-type: none; list-style-position: outside; margin: 0px; padding: 0px; display: block } div.usercm ul li { margin: 0px; padding: 0px; line-height: 35px; } div.usercm ul li a { color: #666; padding: 0 15px; display: block } div.usercm ul li a:hover { color: #fff; background: rgba(170, 222, 18, 0.88) } div.usercm ul li a i { margin-right: 10px } a.disabled { color: #c8c8c8 !important; cursor: not-allowed } a.disabled:hover { background-color: rgba(255, 11, 11, 0) !important } div.usercm { background: #fff !important; } </style> <div class="usercm" style="left: 199px; top: 5px; display: none;"> <ul> <li><a href="/"><i class="fa fa-home fa-fw"></i><span>首页</span></a></li> <li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-copy fa-fw"></i><span>复制</span></a> </li> <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span>前进</span></a></li> <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span>后退</span></a></li> <li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i class="fa fa-refresh fa-fw"></i><span>刷新</span></a></li> <li><a href="javascript:void(0);" onclick="baiduSearch();"><i class="fa fa-paw fa-fw"></i><span>百度</span></a> </li> <li><a href="javascript:void(0);" onclick="googleSearch();"><i class="fa fa-google fa-fw"></i><span>谷歌</span></a></li> <li style="border-bottom:1px solid gray"><a target="_blank" href=""><i class="fa fa-refresh fa-fw"></i><span></span></a></li> </ul> </div> <script> (function(a) { a.extend({ mouseMoveShow: function(b) { var d = 0, c = 0, h = 0, k = 0, e = 0, f = 0; a(window).mousemove(function(g) { d = a(window).width(); c = a(window).height(); h = g.clientX; k = g.clientY; e = g.pageX; f = g.pageY; h + a(b).width() >= d && (e = e - a(b).width() - 5); k + a(b).height() >= c && (f = f - a(b).height() - 5); a("html").on({ contextmenu: function(c) { 3 == c.which && a(b).css({ left: e, top: f }).show() }, click: function() { a(b).hide() } }) }) }, disabledContextMenu: function() { window.oncontextmenu = function() { return !1 } } }) })(jQuery); function getSelect() { "" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? layer.msg("请选择需要百度的内容!"): document.execCommand("Copy") } function baiduSearch() { var a = window.getSelection ? window.getSelection() : document.selection.createRange().text; "" == a ? layer.msg("请选择需要百度的内容!") : window.open("https://www.baidu.com/s?wd=" + a) } function googleSearch() { var a = window.getSelection ? window.getSelection() : document.selection.createRange().text; "" == a ? layer.msg("请选择需要谷歌的内容!") : window.open("https://www.google.com/search?q=" + a) } $(function() { for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) { d = !1; break } d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu()) }); </script> <style> body {cursor: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/mouse/mouse1_1.png), default;} a:hover {cursor: url(https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy//img/mouse/mouse1_2.png), pointer;} </style> <style> @font-face {font-family: 'zti';src:url('https://www.easyhub.top/wp-content/plugins/WaiMaoLa_Diy/font/AlimamaDaoLiTi.woff2');} body {font-family: 'zti' !important;} </style> <style> .avatar-img { border-radius: 50%; animation: light 4s ease-in-out infinite; transition: 0.5s; } .avatar-img:hover { transform: scale(1.15) rotate(720deg); } @keyframes light { 0% { box-shadow: 0 0 4px #f00; } 25% { box-shadow: 0 0 16px #0f0; } 50% { box-shadow: 0 0 4px #00f; } 75% { box-shadow: 0 0 16px #0f0; } 100% { box-shadow: 0 0 4px #f00; } } </style> <style> .display-name { background-image: -webkit-linear-gradient(90deg, #07c160, #fb6bea 25%, #3aedff 50%, #fb6bea 75%, #28d079); -webkit-text-fill-color: transparent; -webkit-background-clip: text; background-size: 100% 600%; animation: wzw 10s linear infinite; } @keyframes wzw { 0% { background-position: 0 0; } 100% { background-position: 0 -300%; } } </style> <style> /*小工具头像跳动*/ .user-avatar .avatar-img, .img-ip:hover, .w-a-info img { -webkit-animation: swing 3s .4s ease both; -moz-animation: swing 3s .4s ease both; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center } 20% { -webkit-transform: rotate(15deg) } 40% { -webkit-transform: rotate(-10deg) } 60% { -webkit-transform: rotate(5deg) } 80% { -webkit-transform: rotate(-5deg) } 100% { -webkit-transform: rotate(0deg) } } @-moz-keyframes swing { 20%, 40%, 60%, 80%, 100% { -moz-transform-origin: top center } 20% { -moz-transform: rotate(15deg) } 40% { -moz-transform: rotate(-10deg) } 60% { -moz-transform: rotate(5deg) } 80% { -moz-transform: rotate(-5deg) } 100% { -moz-transform: rotate(0deg) } } </style> <style> .navbar-brand { position: relative; overflow: hidden; margin: 0 0 0 0; } .navbar-brand:before { content: ""; position: absolute; left: -665px; top: -460px; width: 200px; height: 15px; background-color: rgba(255, 255, 255, .5); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation: searchLights 6s ease-in 0s infinite; -o-animation: searchLights 6s ease-in 0s infinite; animation: searchLights 6s ease-in 0s infinite; } @-moz-keyframes searchLights { 50% { left: -100px; top: 0; } 65% { left: 120px; top: 100px; } } @keyframes searchLights { 40% { left: -100px; top: 0; } 60% { left: 120px; top: 100px; } 80% { left: -100px; top: 0; } } </style> <style> .navbar-logo { animation: hue 4s infinite; } @keyframes hue { from { filter: hue-rotate(0deg); } to { filter: hue-rotate(-360deg); } } </style> <style> .navbar-logo { filter: invert(1); } </style> <style> .navbar-logo { filter: drop-shadow(0 0 10px dodgerblue); } </style> <style> .dark-theme .navbar-logo { filter: invert(1); } </style> <script> // 日夜间切换提示 $(".toggle-theme").click(function() { var toggleThemeText = "当前为日间模式"; if (!$("body").hasClass('dark-theme')) { toggleThemeText = "当前为夜间模式"; } layer.msg(toggleThemeText, { time: 2000, anim: 1 }); }); </script> <!--日夜间切换提示--> <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.min.js"></script> <script src="/wp-content/plugins/WaiMaoLa_Diy/js/copy-one.js"></script> <link rel="stylesheet" href="/wp-content/plugins/WaiMaoLa_Diy/css/copy-one.css" /> <script>function copy_remind(){toastr.success("撰文不易,若要转载请务必保留原文链接,谢谢!", "复制成功!"); clear_toastr(1600); function clear_toastr(time){setTimeout(function(){toastr.clear();}, time); }}document.addEventListener("copy",function(e){ if(window.getSelection(0).toString()){ copy_remind();} else{toastr.info("当前未选择复制的内容!", "温馨提示");}});</script> <script> var OriginTitile = document.title, titleTime; document.addEventListener("visibilitychange", function() { if (document.hidden) { document.title = "你别走吖 Σ(っ °Д °;)っ"; clearTimeout(titleTime) } else { document.title = "(/≧▽≦/)你又回来啦!"; titleTime = setTimeout(function() { document.title = OriginTitile }, 2000) } }); </script> <script> console.log("\n %c KEKC博客 %c https://www.kekc.cn \n","color: #fadfa3; background: red; padding:5px 0; font-size:12px;","background: #9FEE00; padding:5px 0; font-size:12px;"); console.log("\n %c 终结网络 %c https://www.dift.cn \n","color: #fadfa3; background: #8371DA; padding:5px 0; font-size:12px;","background: #DA71C9; padding:5px 0; font-size:12px;"); </script> <script type="text/javascript"> window._win = { views: '920', www: 'https://www.easyhub.top', uri: 'https://www.easyhub.top/wp-content/themes/zibll', ver: '8.1', imgbox: '1', imgbox_type: 'group', imgbox_thumbs: '1', imgbox_zoom: '1', imgbox_full: '1', imgbox_play: '1', imgbox_down: '1', sign_type: 'modal', signin_url: 'https://www.easyhub.top/user-sign?tab=signin&redirect_to=https%3A%2F%2Fwww.easyhub.top%2F920.html', signup_url: 'https://www.easyhub.top/user-sign?tab=signup&redirect_to=https%3A%2F%2Fwww.easyhub.top%2F920.html', ajax_url: 'https://www.easyhub.top/wp-admin/admin-ajax.php', ajaxpager: '', ajax_trigger: '<i class="fa fa-angle-right"></i>加载更多', ajax_nomore: '没有更多内容了', qj_loading: '1', highlight_kg: '1', highlight_hh: '', highlight_btn: '1', highlight_zt: 'enlighter', highlight_white_zt: 'enlighter', highlight_dark_zt: 'dracula', upload_img_size: '3', img_upload_multiple: '6', upload_video_size: '30', upload_file_size: '30', upload_ext: 'jpg|jpeg|jpe|gif|png|bmp|tiff|tif|webp|avif|ico|heic|heif|heics|heifs|asf|asx|wmv|wmx|wm|avi|divx|flv|mov|qt|mpeg|mpg|mpe|mp4|m4v|ogv|webm|mkv|3gp|3gpp|3g2|3gp2|txt|asc|c|cc|h|srt|csv|tsv|ics|rtx|css|vtt|dfxp|mp3|m4a|m4b|aac|ra|ram|wav|ogg|oga|flac|mid|midi|wma|wax|mka|rtf|pdf|class|tar|zip|gz|gzip|rar|7z|psd|xcf|doc|pot|pps|ppt|wri|xla|xls|xlt|xlw|mdb|mpp|docx|docm|dotx|dotm|xlsx|xlsm|xlsb|xltx|xltm|xlam|pptx|pptm|ppsx|ppsm|potx|potm|ppam|sldx|sldm|onetoc|onetoc2|onetmp|onepkg|oxps|xps|odt|odp|ods|odg|odc|odb|odf|wp|wpd|key|numbers|pages', user_upload_nonce: '7b44a6fe95', is_split_upload: '1', split_minimum_size: '20', comment_upload_img: '' } </script> <div class="float-right round position-bottom filter"><span style="--this-bg:rgba(255, 111, 6, 0.2);" class="float-btn more-btn hover-show nowave" data-placement="left" title="本站同款主题模板" href="javascript:;"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-gift-color"></use></svg><div style="width:240px;" class="hover-show-con dropdown-menu"><a href="https://www.zibll.com/" target="_blank"> <div class="flex c-red"> <img class="flex0 lazy" alt="zibll子比主题" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201%201'%3E%3C/svg%3E" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/favicon.png" height="30"> <div class="flex1 ml10"> <dt>本站同款主题模板</dt> <div class="px12 mt10 muted-color">zibll子比主题是一款漂亮优雅的网站主题模板,功能强大,配置简单。</div> <div class="but mt10 p2-10 c-blue btn-block px12">查看详情</div> </div> </div> </a></div></span><a style="--this-color:#f2c97d;--this-bg:rgba(62,62,67,0.9);" class="float-btn signin-loader" data-toggle="tooltip" data-placement="left" title="开通会员" href="javascript:;"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-vip_1"></use></svg></a><span class="newadd-btns hover-show float-btn add-btn"> <svg class="icon" aria-hidden="true"><use xlink:href="#icon-add-ring"></use></svg> <div class="hover-show-con dropdown-menu drop-newadd"><a rel="nofollow" class="btn-newadd" href="https://www.easyhub.top/newposts"><icon class="jb-green"><i class="fa fa-pencil-square"></i></icon><text>发布文章</text></a><a class="signin-loader btn-newadd" href="javascript:;"><icon class="jb-pink"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-topic"></use></svg></icon><text>创建话题</text></a><a class="signin-loader plate-add btn-newadd" href="javascript:;"><icon class="jb-yellow"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-plate-fill"></use></svg></icon><text>创建版块</text></a><a rel="nofollow" class="btn-newadd" href="https://www.easyhub.top/posts-edit"><icon class="jb-blue"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-posts"></use></svg></icon><text>发布帖子</text></a></div> </span><a class="float-btn service-wechat hover-show nowave" title="扫码添加微信" href="javascript:;"><i class="fa fa-wechat"></i><div class="hover-show-con dropdown-menu"><img class="radius4 relative" width="100%" class="lazyload" src="https://www.easyhub.top/wp-content/themes/zibll/img/thumbnail-sm.svg" data-src="https://www.easyhub.top/wp-content/themes/zibll/img/qrcode.png" alt="扫码添加微信-Easy 补给站"></div></a><span class="float-btn qrcode-btn hover-show service-wechat"><i class="fa fa-qrcode"></i><div class="hover-show-con dropdown-menu"><div class="qrcode" data-size="100"></div><div class="mt6 px12 muted-color">在手机上浏览此页面</div></div></span><a class="float-btn ontop fade" data-toggle="tooltip" data-placement="left" title="返回顶部" href="javascript:(scrollTopTo());"><i class="fa fa-angle-up em12"></i></a></div><div mini-touch="nav_search" touch-direction="top" class="main-search fixed-body main-bg box-body navbar-search nopw-sm"><div class="container"><div class="mb20"><button class="close" data-toggle-class data-target=".navbar-search" ><svg class="ic-close" aria-hidden="true"><use xlink:href="#icon-close"></use></svg></button></div><div remote-box="https://www.easyhub.top/wp-admin/admin-ajax.php?action=search_box" load-click><div class="search-input"><p><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i></p><p class="placeholder k2"></p> <p class="placeholder t1"></p><p><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i></p><p class="placeholder k1"></p><p class="placeholder t1"></p><p></p> <p class="placeholder k1" style="height: 80px;"></p> </div></div></div></div> <div class="modal fade" id="u_sign" tabindex="-1" role="dialog"> <div class="modal-dialog" role="document"> <div class="sign-content"> <div class="sign zib-widget blur-bg relative"> <button class="close" data-dismiss="modal"> <svg class="ic-close" aria-hidden="true" data-viewBox="0 0 1024 1024" viewBox="0 0 1024 1024"><use xlink:href="#icon-close"></use></svg> </button> <div class="tab-content"><div class="tab-pane fade active in" id="tab-sign-in"><div class="box-body"><div class="title-h-left fa-2x">登录</div><a class="muted-color px12" href="#tab-sign-up" data-toggle="tab">没有账号?立即注册<i class="em12 ml3 fa fa-angle-right"></i></a></div><div id="sign-in"><form><div class="relative line-form mb10"><input type="text" name="username" class="line-form-input" tabindex="1" placeholder=""><i class="line-form-line"></i><div class="scale-placeholder">用户名或邮箱</div></div><div class="relative line-form mb10"><input type="password" name="password" class="line-form-input" tabindex="2" placeholder=""><div class="scale-placeholder">登录密码</div><div class="abs-right passw muted-2-color"><i class="fa-fw fa fa-eye"></i></div><i class="line-form-line"></i></div><input machine-verification="slider" type="hidden" name="captcha_mode" value="slider" slider-id=""><div class="relative line-form mb10 em09"><span class="muted-color form-checkbox"><input type="checkbox" id="remember" checked="checked" tabindex="4" name="remember" value="forever"><label for="remember" class="ml3">记住登录</label></span><span class="pull-right muted-2-color"><a rel="nofollow" class="muted-2-color" href="https://www.easyhub.top/user-sign?tab=resetpassword&redirect_to=https%3A%2F%2Fwww.easyhub.top%2F920.html">找回密码</a></span></div><div class="box-body"><input type="hidden" name="action" value="user_signin"><button type="button" class="but radius jb-blue padding-lg signsubmit-loader btn-block"><i class="fa fa-sign-in mr10"></i>登录</button></div></form><p class="social-separator separator muted-3-color em09">社交账号登录</p><div class="social_loginbar"><a rel="nofollow" title="微信登录" href="https://www.easyhub.top/oauth/weixingzh?rurl=https%3A%2F%2Fwww.easyhub.top%2F920.html" class="social-login-item weixingzh toggle-radius qrcode-signin"><i class="fa fa-weixin" aria-hidden="true"></i></a></div></div></div><div class="tab-pane fade" id="tab-sign-up"><div class="box-body"><div class="title-h-left fa-2x">注册</div><a class="muted-color px12" href="#tab-sign-in" data-toggle="tab">已有账号,立即登录<i class="em12 ml3 fa fa-angle-right"></i></a></div><form id="sign-up"><div class="relative line-form mb10"><input type="text" name="name" class="line-form-input" tabindex="1" placeholder=""><i class="line-form-line"></i><div class="scale-placeholder">设置用户名</div></div><div class="relative line-form mb10"><input type="password" name="password2" class="line-form-input" tabindex="3" placeholder=""><div class="scale-placeholder">设置密码</div><div class="abs-right passw muted-2-color"><i class="fa-fw fa fa-eye"></i></div><i class="line-form-line"></i></div><div class="relative line-form mb10"><input type="password" name="repassword" class="line-form-input" tabindex="4" placeholder=""><div class="scale-placeholder">重复密码</div><div class="abs-right passw muted-2-color"><i class="fa-fw fa fa-eye"></i></div><i class="line-form-line"></i></div><input machine-verification="slider" type="hidden" name="captcha_mode" value="slider" slider-id=""><div class="box-body"><input type="hidden" name="action" value="user_signup"><button type="button" class="but radius jb-green padding-lg signsubmit-loader btn-block"><svg class="icon mr10" aria-hidden="true" data-viewBox="0 0 1024 1024" viewBox="0 0 1024 1024"><use xlink:href="#icon-signup"></use></svg>注册</button></div></form></div><div class="tab-pane fade" id="tab-qrcode-signin"><div class="box-body"><div class="title-h-left fa-2x">扫码登录</div><span class="muted-3-color px12">使用<a class="muted-color" href="#tab-sign-in" data-toggle="tab">其它方式登录</a>或<a class="muted-color" href="#tab-sign-up" data-toggle="tab">注册</a></span><a class="muted-color px12 hide" href="#tab-qrcode-signin" data-toggle="tab">扫码登录</a></div><div class="qrcode-signin-container box-body text-center"><p class="placeholder" style="height:180px;width:180px;margin:auto;"></p><p class="placeholder" style="height:27px;width:200px;margin:15px auto 0;"></p></div></div></div> </div> </div> </div> </div> <div class="modal fade" id="modal-system-notice" tabindex="-1" role="dialog"> <div class="modal-dialog modal-sm" style="" role="document"> <div class="modal-content"> <div class="modal-body"> <div style="padding: 1px;"><div class="modal-colorful-header colorful-bg jb-yellow"><button class="close" data-dismiss="modal"><svg class="ic-close" aria-hidden="true"><use xlink:href="#icon-close"></use></svg></button><div class="colorful-make"></div><div class="text-center"><div class="em2x"><i class="fa fa-heart" aria-hidden="true"></i></div><div class="mt10 em12 padding-w10">主题模板推荐</div></div></div><div><p class="c-yellow">欢迎光临 EasyHub 补给站</p></div></div> </div> <div class="modal-buts box-body notop text-right"><a type="button" class="but c-blue" href="https://www.easyhub.top/">了解本站</a><a type="button" class="but c-green" href="https://www.easyhub.top/wp-admin/admin.php?page=zibll_options#tab=常用功能">立即设置</a></div> </div> </div> </div> <script type="text/javascript">window.onload = function(){ setTimeout(function () {$('#modal-system-notice').modal('show'); $.cookie("showed_system_notice","showed", {path: "/",expires: 1}); }, 500)};</script><script type="text/javascript" src="https://www.easyhub.top/wp-content/themes/zibll/js/libs/bootstrap.min.js?ver=8.1" id="bootstrap-js"></script> <script type="text/javascript" src="https://www.easyhub.top/wp-content/themes/zibll/js/loader.js?ver=8.1" id="_loader-js"></script> <script type="text/javascript" src="https://www.easyhub.top/wp-content/themes/zibll/inc/functions/bbs/assets/js/main.min.js?ver=8.1" id="forums-js"></script> <!--FOOTER_CODE_START--> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?0b2111cd7082eaa10f30353367f96b14"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <!--FOOTER_CODE_END--> <!--baidu_push_js--> <script type="text/javascript"> (function() { var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> <!--baidu_push_js--> <script type="text/javascript"> console.log("数据库查询:8次 | 页面生成耗时:762.174ms"); </script> <script>window.w3tc_lazyload=1,window.lazyLoadOptions={elements_selector:".lazy",callback_loaded:function(t){var e;try{e=new CustomEvent("w3tc_lazyload_loaded",{detail:{e:t}})}catch(a){(e=document.createEvent("CustomEvent")).initCustomEvent("w3tc_lazyload_loaded",!1,!1,{e:t})}window.dispatchEvent(e)}}</script><script async src="https://www.easyhub.top/wp-content/plugins/w3-total-cache/pub/js/lazyload.min.js"></script></body> </html> <!-- Page supported by LiteSpeed Cache 7.0.0.1 on 2025-07-09 11:55:55 --> <!-- Performance optimized by W3 Total Cache. Learn more: https://www.boldgrid.com/w3-total-cache/ 使用页面缓存Disk: Enhanced 延迟加载 Served from: www.easyhub.top @ 2025-07-09 11:55:55 by W3 Total Cache -->