首页 > web前端 > H5教程 > html5 常用标签汇总详情

html5 常用标签汇总详情

黄舟
发布: 2017-03-20 16:13:36
原创
2322 人浏览过

一、主体结构

header 页面头部,不同与
aside 边栏
nav 外部链接集合
section 章节或段落
article 类似文章、摘要或留言POST等形式的记录(一般搭配内嵌头部、尾部、底部结构使用)
hggroup 类似子标题,标题信息、可选标题、TAG标签这样的数据,还是英文更好理解一些,heading of a section
address 联系信息,一般用在article或body锚元素周围
footer 页脚

二、HTML 5元素标记汇总表

文档类型宣告
根元素元素 html
META元素 head、 title、base、link、meta、style
部件元素 body、section、nav、article、aside、h1、 h2、 h3、h4、 h5、 h6、hgroup、header、footer、address
分组内容元素 p、hr、br、pre、blockquote、ol、ul、li、dl、dt、dd、figure、figcaption、p
文本层次语义元素 a、em、strong、small、cite、q、dfn、abbr、time、code、var、samp、kbd、sub、sups、i、b、mark、ruby、rt、rp、bdo、span
编辑元素 ins、del
嵌入内容元素 img、iframe、embed、object、param、video、audio、source、canvasmap、area
表格元素 table、caption、colgroup、col、tbody、thread、tfoot、tr、td、th
表单元素 form、fieldset、legend、label、button、select、datalist、optgroup、option、textarea、keygen、output、progress、meter
互动元素 details、summary、command、menu
脚本元素 script、noscript

三、HTML 5元素通用属性和事件句柄

HTML5元素通用属性表 accesskey、class、contenteditable、contextmenu、dir、 draggable、hidden、id、lang、spellcheck、style、tabindex、title
HTML5元素事件句柄属性 onabort、onblur*、oncanplay、oncanplaythrough、onchange、 onclick、 oncontextmenu、ondblclick、ondrag、ondragend、ondragenter、ondragleave、 ondragover、ondragstart、ondrop、ondurationchange、onemptied、onended、 onerror*、onfocus*、onformchange、onforminput、oninput、oninvalid、onkeydown、 onkeypress、onkeyup、onload*、onloadeddata、onloadedmetadata、onloadstart、 onmousedown、onmousemove、onmouseout、onmouseover、onmouseup、onmousewheel、 onpause、onplay、onplaying、onprogress、onratechange、onreadystatechange、 onscroll、onseeked、onseeking、onselect、onshow、onstalled、onsubmit、 onsuspend、ontimeupdate、onvolumechange、onwaiting。

四、HTML5元素标记释义

标记 类型 意义 介绍
文件标记
根文件标记 让浏览器知道这是HTML 文件
META标记
开头 提供文件整体信息
</td> <td>●</td> <td>标题</td> <td>定义文件标题,显示于浏览器顶端</td> </tr> <tr> <td><base></td> <td>o</td> <td>基准标记</td> <td>可将相对URL转绝对及指定链接</td> </tr> <tr> <td><link></td> <td>o</td> <td>外部资源连接</td> <td>必须带rel属性描述</td> </tr> <tr> <td><meta></td> <td>o</td> <td> <a href="http://www.php.cn/html5/html5-3-mip-normal.html" target="_blank">其它</a>META数据</td> <td>不能被title, base, link, style, 和script元素描述的META数据</td> </tr> <tr> <td><style></td> <td>●</td> <td>嵌入文档风格信息</td> <td> </td> </tr> <tr><td colspan="4"><strong>部件标记</strong></td></tr> <tr> <td><body></td> <td>●</td> <td>文档主体开始</td> <td>文档内容容器</td> </tr> <tr> <td><section></td> <td>●</td> <td>代表通用文档或应用部件</td> <td> </td> </tr> <tr> <td><nav></td> <td>●</td> <td> <a href="http://www.php.cn/code/9303.html" target="_blank">导航</a>链接</td> <td>外部链接或文档内部链接</td> </tr> <tr> <td><article></td> <td>●</td> <td>页面模块</td> <td>类似文章、摘要或留言POST等形式的记录</td> </tr> <tr> <td><aside></td> <td>●</td> <td>孤立模块</td> <td>一般作为边栏广告、说明、<a href="http://www.php.cn/wiki/231.html" target="_blank">引用</a>、导航等,aside围堵部分一般与正文耦合较小</td> </tr> <tr> <td><h1></td> <td>●</td> <td>标题标记</td> <td>此外还有h2, h3, h4, h5, h6</td> </tr> <tr> <td><hgroup></td> <td>●</td> <td>群组标题</td> <td>用在一组h1-h6这样的元素集合时使用,用来区分主副标题??</td> </tr> <tr> <td><header></td> <td>●</td> <td>组说明或组导航</td> <td>也可叫页头标题</td> </tr> <tr> <td><footer></td> <td>●</td> <td>页脚标题</td> <td>作用范围跟最近部件元素有关</td> </tr> <tr> <td><address></td> <td>●</td> <td>地址或联系信息</td> <td> </td> </tr> <tr> <td><strong>分组内容标记</strong></td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td><p></td> <td>●</td> <td>段落标记</td> <td> </td> </tr> <tr> <td><hr></td> <td>o</td> <td>水平分割线</td> <td> </td> </tr> <tr> <td><br></td> <td>o</td> <td>换行</td> <td> </td> </tr> <tr> <td><pre class="brush:php;toolbar:false"></td> <td>●</td> <td>预格式化分本块</td> <td> </td> </tr> <tr> <td><blockquote></td> <td>●</td> <td>块引用</td> <td> </td> </tr> <tr> <td><ol></td> <td>●</td> <td>编号列表</td> <td> </td> </tr> <tr> <td><ul></td> <td>●</td> <td>项目列表</td> <td> </td> </tr> <tr> <td><li></td> <td>●</td> <td>列表项</td> <td> </td> </tr> <tr> <td><dl></td> <td>●</td> <td>定义列表</td> <td> </td> </tr> <tr> <td><dt></td> <td>●</td> <td>定义名称</td> <td> </td> </tr> <tr> <td><dd></td> <td>●</td> <td>定义说明</td> <td> </td> </tr> <tr> <td><figure></td> <td>●</td> <td>流内容区块说明</td> <td>多结合figcaption使用</td> </tr> <tr> <td><figcaption></td> <td>●</td> <td>figure内容属性</td> <td> </td> </tr> <tr> <td><p></td> <td>●</td> <td>定位标记</td> <td>无实际意义</td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>文本层次语义标记</strong></td></tr> <tr> <td><a></td> <td>●</td> <td>链接标记</td> <td> </td> </tr> <tr> <td><em></td> <td>●</td> <td>强调标记</td> <td> </td> </tr> <tr> <td><strong></td> <td>●</td> <td>加重标记</td> <td> </td> </tr> <tr> <td><small></td> <td>●</td> <td>字体缩小</td> <td> </td> </tr> <tr> <td><cite></td> <td>●</td> <td>斜体标记</td> <td> </td> </tr> <tr> <td><q></td> <td>●</td> <td>引用标记内容</td> <td>原文是phrasing content,暂不清楚如何翻译</td> </tr> <tr> <td><dfn></td> <td>●</td> <td>术语定义</td> <td> </td> </tr> <tr> <td><abbr></td> <td>●</td> <td>缩略语</td> <td> </td> </tr> <tr> <td><time></td> <td>●</td> <td>日期时间</td> <td> </td> </tr> <tr> <td><code></td> <td>●</td> <td>程序代码</td> <td> </td> </tr> <tr> <td><var></td> <td>●</td> <td><a href="http://www.php.cn/wiki/70.html" target="_blank">变量</a></td> <td> </td> </tr> <tr> <td><samp></td> <td>●</td> <td>范例</td> <td> </td> </tr> <tr> <td><kbd></td> <td>●</td> <td>键盘字</td> <td> </td> </tr> <tr> <td><sub><sups></td> <td>●</td> <td>上标字/下标字</td> <td> </td> </tr> <tr> <td><i></td> <td>●</td> <td>斜体标记</td> <td> </td> </tr> <tr> <td><b></td> <td>●</td> <td>粗体标记</td> <td> </td> </tr> <tr> <td><mark></td> <td>●</td> <td>标记或高亮</td> <td> </td> </tr> <tr> <td><ruby></td> <td>●</td> <td>注解标记</td> <td> </td> </tr> <tr> <td><rt></td> <td>●</td> <td>ruby子元素</td> <td>结合ruby使用,比如:<ruby>天<rt>Tian</rt>缘<rt>Yuan</rt></ruby></td> </tr> <tr> <td><rp></td> <td>●</td> <td>ruby子元素</td> <td>一般做rt元素<a href="http://www.php.cn/code/8105.html" target="_blank">注释</a>使用</td> </tr> <tr> <td><bdo></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><span></td> <td>●</td> <td>自定义标记</td> <td> </td> </tr> <tr><td colspan="4"><strong>编辑标记</strong></td></tr> <tr> <td><ins></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><del></td> <td>●</td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>嵌入内容标记</strong></td></tr> <tr> <td><img></td> <td>●</td> <td> <a href="http://www.php.cn/css/css-rwd-images.html" target="_blank">图片</a>标记</td> <td> </td> </tr> <tr> <td><iframe></td> <td>●</td> <td> <a href="http://www.php.cn/css/css-rwd-frameworks.html" target="_blank">框架</a>标记</td> <td> </td> </tr> <tr> <td><embed></td> <td>●</td> <td>嵌入标记</td> <td> </td> </tr> <tr> <td><object></td> <td>●</td> <td> <a href="http://www.php.cn/wiki/60.html" target="_blank">对象</a>标记</td> <td> </td> </tr> <tr> <td><param></td> <td>●</td> <td>参数标记</td> <td> </td> </tr> <tr> <td><video></td> <td>●</td> <td> <a href="http://www.php.cn/code/6707.html" target="_blank">视频</a>标记</td> <td> </td> </tr> <tr> <td><audio></td> <td>●</td> <td> <a href="http://www.php.cn/code/6093.html" target="_blank">音频</a>标记</td> <td> </td> </tr> <tr> <td><source></td> <td>●</td> <td>来源标记</td> <td> </td> </tr> <tr> <td><canvas></td> <td>●</td> <td>制图标记</td> <td> </td> </tr> <tr> <td><map></td> <td>●</td> <td> <a href="http://www.php.cn/code/7891.html" target="_blank">地图</a>标记</td> <td> </td> </tr> <tr> <td><area></td> <td>●</td> <td>区域标记</td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>表格标记</strong></td></tr> <tr> <td><table></td> <td>●</td> <td>表格标记</td> <td>设定该表格的各项参数</td> </tr> <tr> <td><caption></td> <td>●</td> <td>表格标题</td> <td>做成一打通列以填入表格标题</td> </tr> <tr> <td><colgroup></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><col></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><tbody></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><thread></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><tfoot></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><tr></td> <td>●</td> <td>表格列</td> <td>设定该表格的列</td> </tr> <tr> <td><td></td> <td>●</td> <td>表格栏</td> <td>设定该表格的栏</td> </tr> <tr> <td><th></td> <td>●</td> <td>表格标头</td> <td>相等于<TD>,但其内文字字体会变粗</td> </tr> <tr><td colspan="4"><strong>表单标记</strong></td></tr> <tr> <td><form></td> <td>●</td> <td>表单标记</td> <td>决定该表单的运作模式</td> </tr> <tr> <td><fieldset></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><legend></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><input></td> <td>●</td> <td>输入标记</td> <td> </td> </tr> <tr> <td><label></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><button></td> <td>●</td> <td><a href="http://www.php.cn/code/5991.html" target="_blank">按钮</a></td> <td> </td> </tr> <tr> <td><select></td> <td>●</td> <td>选择标记</td> <td> </td> </tr> <tr> <td><datalist></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><optgroup></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><option></td> <td>●</td> <td>选项</td> <td> </td> </tr> <tr> <td><textarea></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><keygen></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><output></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><progress></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><meter></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><p><strong>互动元素</strong></p></td></tr> <tr> <td><details></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><summary></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><command></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><menu></td> <td>●</td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>其他标记</strong></td></tr> <tr> <td><script></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><noscript></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </tbody></table> <p><strong>备注: </strong></p> <p>1、● 表示该标记属于围堵标记,需要结束标记</标记>。</p> <p>2、o 表示该标记属空标记,不需要结束标记。</p><p>以上是html5 常用标签汇总详情的详细内容。更多信息请关注PHP中文网其他相关文章!</p> </div> </div> <div style="height: 25px;"> <div class="wzconBq" style="display: inline-flex;"> <span>相关标签:</span> <div class="wzcbqd"> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/zh/search?word=html5,常用标签" target="_blank">html5 ,常用标签</a> </div> </div> <div style="display: inline-flex;float: right; color:#333333;">来源:php.cn</div> </div> <div class="wzconOtherwz"> <a href="https://www.php.cn/zh/faq/357701.html" title="html5 WebWorkers防止浏览器假死的示例代码分享"> <span>上一篇:html5 WebWorkers防止浏览器假死的示例代码分享</span> </a> <a href="https://www.php.cn/zh/faq/357705.html" title="HTML5 Placeholder属性的详情介绍"> <span>下一篇:HTML5 Placeholder属性的详情介绍</span> </a> </div> <div class="wzconShengming"> <div class="bzsmdiv">本站声明</div> <div>本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn</div> </div> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="2507867629"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div class="wzconZzwz"> <div class="wzconZzwztitle">作者最新文章</div> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/377601.html">从零开始打造自己的PHP框架的视频资料</a> </div> <div>2023-03-15 16:54:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/377137.html">PHPMailer如何利用QQ邮箱完成邮件发送功能的实例分析</a> </div> <div>2023-03-15 12:26:02</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/376186.html">php中关于IMAP如何收取邮件的方法介绍</a> </div> <div>2023-03-14 18:58:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/375194.html">php如何快速实现数组去重的实例</a> </div> <div>2023-03-14 11:30:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/369412.html">html中关于<a>标签的全部属性的使用总结</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/379971.html">php基础知识总结(新手入门必备)</a> </div> <div>2023-03-16 15:20:01</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/381607.html">JavaScript中typeof的使用方法介绍</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/382066.html">JavaScript中confirm()方法的使用介绍</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/357705.html">HTML5 Placeholder属性的详情介绍</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh/faq/380149.html">ReactJS中表单的单选多选与反选的实现方法</a> </div> <div>1970-01-01 08:00:00</div> </li> </ul> </div> <div class="wzconZzwz"> <div class="wzconZzwztitle">最新问题</div> <div class="wdsyContent"> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176380.html" target="_blank" title="SQL Count() 也需要 0" class="wdcdcTitle">SQL Count() 也需要 0</a> <a href="https://www.php.cn/zh/wenda/176380.html" class="wdcdcCons">我只有一张表,我想计算起始为0的标签的每个条目现在我尝试这样:SELECT标签,COUNT(start)ASAnzahl,user_idFROMdatensammlung其中(st...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-06 19:48:53</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>449</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176344.html" target="_blank" title="如何让我的图像显示在页面的主显示屏上?" class="wdcdcTitle">如何让我的图像显示在页面的主显示屏上?</a> <a href="https://www.php.cn/zh/wenda/176344.html" class="wdcdcCons">我想做的是使用NASAAPI接收一些照片。然后在我的网页的缩略图和主显示屏上显示这些照片。我只是弄清楚为什么代码不从缩略图中获取图像并将其显示在页面上。我还使用HTML5及以上版本...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-06 15:33:12</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>433</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176317.html" target="_blank" title="父级的填充被粘性定位的子级忽略" class="wdcdcTitle">父级的填充被粘性定位的子级忽略</a> <a href="https://www.php.cn/zh/wenda/176317.html" class="wdcdcCons">如何防止粘性元素进入标题后面?当前代码片段在父级上使用填充顶部,我也尝试在额外的子级上使用margin-top或透明50px边框,但它似乎不起作用。我知道在这种情况下我可以轻松地在...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-06 11:42:51</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>338</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176275.html" target="_blank" title="NumberInput 鼠标滚轮处理忽略捕获阶段的事件过滤" class="wdcdcTitle">NumberInput 鼠标滚轮处理忽略捕获阶段的事件过滤</a> <a href="https://www.php.cn/zh/wenda/176275.html" class="wdcdcCons">非常简短的版本:我有点卡住了,不太明白为什么这段代码确实可以拦截和防止鼠标滚轮事件被数字编辑解释以更改数字。我想了解为什么拦截捕获和过滤事件不起作用:HTML代码:<pid=...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-05 12:21:04</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>1387</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh/wenda/176273.html" target="_blank" title="Firebase FCM 批量个性化推送" class="wdcdcTitle">Firebase FCM 批量个性化推送</a> <a href="https://www.php.cn/zh/wenda/176273.html" class="wdcdcCons">是否可以发送大量推送,但每条消息都是个性化的,例如带有名称,目标是仅向API发出一个请求,而不是每个用户1个请求这可能吗?如果是的话,我该怎么做?我使用的是纯cURL(php),因...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 来自于 2024-04-05 11:46:20</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>1361</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> </div> </div> <div class="wzconZt" > <div class="wzczt-title"> <div>相关专题</div> <a href="https://www.php.cn/zh/faq/zt" target="_blank">更多> </a> </div> <div class="wzcttlist"> <ul> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/html5dhzzynxz"><img src="https://img.php.cn/upload/subject/202407/22/2024072213560284279.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html5动画制作有哪些制作方法" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/html5dhzzynxz" class="title-a-spanl" title="html5动画制作有哪些制作方法"><span>html5动画制作有哪些制作方法</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/htmlyhtmldeqb"><img src="https://img.php.cn/upload/subject/202407/22/2024072212284445490.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="HTML与HTML5的区别" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/htmlyhtmldeqb" class="title-a-spanl" title="HTML与HTML5的区别"><span>HTML与HTML5的区别</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/nohupmlyxhgbf"><img src="https://img.php.cn/upload/subject/202407/22/2024072212220325348.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="nohup命令运行后关闭方法" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/nohupmlyxhgbf" class="title-a-spanl" title="nohup命令运行后关闭方法"><span>nohup命令运行后关闭方法</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/keypresskeydo"><img src="https://img.php.cn/upload/subject/202407/22/2024072213442195476.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="keypress和keydown的区别" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/keypresskeydo" class="title-a-spanl" title="keypress和keydown的区别"><span>keypress和keydown的区别</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/bapkrjgmc"><img src="https://img.php.cn/upload/subject/202407/22/2024072213384078719.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="把apk软件改名称" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/bapkrjgmc" class="title-a-spanl" title="把apk软件改名称"><span>把apk软件改名称</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/mysqlybdsyff"><img src="https://img.php.cn/upload/subject/202407/22/2024072214040994042.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="mysql游标的使用方法" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/mysqlybdsyff" class="title-a-spanl" title="mysql游标的使用方法"><span>mysql游标的使用方法</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/aspljaccess"><img src="https://img.php.cn/upload/subject/202407/22/2024072213574377274.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="asp连接access数据库的方法" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/aspljaccess" class="title-a-spanl" title="asp连接access数据库的方法"><span>asp连接access数据库的方法</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh/faq/chatgptgnkbky"><img src="https://img.php.cn/upload/subject/202407/22/2024072212295272893.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="chatgpt国内可不可以使用" /> </a> <a target="_blank" href="https://www.php.cn/zh/faq/chatgptgnkbky" class="title-a-spanl" title="chatgpt国内可不可以使用"><span>chatgpt国内可不可以使用</span> </a> </li> </ul> </div> </div> </div> </div> <div class="phpwzright"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3653428331" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div class="wzrOne"> <div class="wzroTitle">热门推荐</div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="h5是什么" href="https://www.php.cn/zh/faq/414835.html">h5是什么</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="不懂代码怎么制作h5页面?H5页面制作平台推荐" href="https://www.php.cn/zh/faq/417718.html">不懂代码怎么制作h5页面?H5页面制作平台推荐</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="html5的新特性有哪些" href="https://www.php.cn/zh/faq/473125.html">html5的新特性有哪些</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="什么是h5页面制作" href="https://www.php.cn/zh/faq/468382.html">什么是h5页面制作</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="h5和小程序有什么区别" href="https://www.php.cn/zh/faq/463311.html">h5和小程序有什么区别</a> </div> </li> </ul> </div> </div> <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script> <div class="wzrThree"> <div class="wzrthree-title"> <div>热门教程</div> <a target="_blank" href="https://www.php.cn/zh/course.html">更多> </a> </div> <div class="wzrthreelist swiper2"> <div class="wzrthreeTab swiper-wrapper"> <div class="check tabdiv swiper-slide" data-id="one">相关教程 <div></div></div> <div class="tabdiv swiper-slide" data-id="two">热门推荐<div></div></div> <div class="tabdiv swiper-slide" data-id="three">最新课程<div></div></div> </div> <ul class="one"> <li> <a target="_blank" href="https://www.php.cn/zh/course/812.html" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" href="https://www.php.cn/zh/course/812.html">最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)</a> <div class="wzrthreerb"> <div>1422761 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/74.html" title="php入门教程之一周学会PHP" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253d1e28ef5c345.png" alt="php入门教程之一周学会PHP"/> </a> <div class="wzrthree-right"> <a target="_blank" title="php入门教程之一周学会PHP" href="https://www.php.cn/zh/course/74.html">php入门教程之一周学会PHP</a> <div class="wzrthreerb"> <div>4267818 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="74"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/286.html" title="JAVA 初级入门视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初级入门视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初级入门视频教程" href="https://www.php.cn/zh/course/286.html">JAVA 初级入门视频教程</a> <div class="wzrthreerb"> <div>2531828 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/504.html" title="小甲鱼零基础入门学习Python视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲鱼零基础入门学习Python视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="小甲鱼零基础入门学习Python视频教程" href="https://www.php.cn/zh/course/504.html">小甲鱼零基础入门学习Python视频教程</a> <div class="wzrthreerb"> <div>507152 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/2.html" title="PHP 零基础入门教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253de27bc161468.png" alt="PHP 零基础入门教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP 零基础入门教程" href="https://www.php.cn/zh/course/2.html">PHP 零基础入门教程</a> <div class="wzrthreerb"> <div>862251 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="2"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> <ul class="two" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/zh/course/812.html" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" href="https://www.php.cn/zh/course/812.html">最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)</a> <div class="wzrthreerb"> <div >1422761次学习</div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/286.html" title="JAVA 初级入门视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初级入门视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初级入门视频教程" href="https://www.php.cn/zh/course/286.html">JAVA 初级入门视频教程</a> <div class="wzrthreerb"> <div >2531828次学习</div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/504.html" title="小甲鱼零基础入门学习Python视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲鱼零基础入门学习Python视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="小甲鱼零基础入门学习Python视频教程" href="https://www.php.cn/zh/course/504.html">小甲鱼零基础入门学习Python视频教程</a> <div class="wzrthreerb"> <div >507152次学习</div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/901.html" title="Web前端开发极速入门" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Web前端开发极速入门"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Web前端开发极速入门" href="https://www.php.cn/zh/course/901.html">Web前端开发极速入门</a> <div class="wzrthreerb"> <div >215768次学习</div> <div class="courseICollection" data-id="901"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/234.html" title="零基础精通 PS 视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="零基础精通 PS 视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" title="零基础精通 PS 视频教程" href="https://www.php.cn/zh/course/234.html">零基础精通 PS 视频教程</a> <div class="wzrthreerb"> <div >889497次学习</div> <div class="courseICollection" data-id="234"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> <ul class="three" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/zh/course/1648.html" title="【web前端】Node.js快速入门" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="【web前端】Node.js快速入门"/> </a> <div class="wzrthree-right"> <a target="_blank" title="【web前端】Node.js快速入门" href="https://www.php.cn/zh/course/1648.html">【web前端】Node.js快速入门</a> <div class="wzrthreerb"> <div >7412次学习</div> <div class="courseICollection" data-id="1648"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1647.html" title="国外Web开发全栈课程全集" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="国外Web开发全栈课程全集"/> </a> <div class="wzrthree-right"> <a target="_blank" title="国外Web开发全栈课程全集" href="https://www.php.cn/zh/course/1647.html">国外Web开发全栈课程全集</a> <div class="wzrthreerb"> <div >5815次学习</div> <div class="courseICollection" data-id="1647"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1646.html" title="Go语言实战之 GraphQL" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Go语言实战之 GraphQL"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Go语言实战之 GraphQL" href="https://www.php.cn/zh/course/1646.html">Go语言实战之 GraphQL</a> <div class="wzrthreerb"> <div >4900次学习</div> <div class="courseICollection" data-id="1646"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1645.html" title="550W粉丝大佬手把手从零学JavaScript" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="550W粉丝大佬手把手从零学JavaScript"/> </a> <div class="wzrthree-right"> <a target="_blank" title="550W粉丝大佬手把手从零学JavaScript" href="https://www.php.cn/zh/course/1645.html">550W粉丝大佬手把手从零学JavaScript</a> <div class="wzrthreerb"> <div >691次学习</div> <div class="courseICollection" data-id="1645"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh/course/1644.html" title="python大神Mosh,零基础小白6小时完全入门" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="python大神Mosh,零基础小白6小时完全入门"/> </a> <div class="wzrthree-right"> <a target="_blank" title="python大神Mosh,零基础小白6小时完全入门" href="https://www.php.cn/zh/course/1644.html">python大神Mosh,零基础小白6小时完全入门</a> <div class="wzrthreerb"> <div >24533次学习</div> <div class="courseICollection" data-id="1644"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper2', { autoplay: false,//可选选项,自动滑动 slidesPerView : 'auto', }) $('.wzrthreeTab>div').click(function(e){ $('.wzrthreeTab>div').removeClass('check') $(this).addClass('check') $('.wzrthreelist>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> <div class="wzrFour"> <div class="wzrfour-title"> <div>最新下载</div> <a href="https://www.php.cn/zh/xiazai">更多> </a> </div> <script> $(document).ready(function(){ var sjyx_banSwiper = new Swiper(".sjyx_banSwiperwz",{ speed:1000, autoplay:{ delay:3500, disableOnInteraction: false, }, pagination:{ el:'.sjyx_banSwiperwz .swiper-pagination', clickable :false, }, loop:true }) }) </script> <div class="wzrfourList swiper3"> <div class="wzrfourlTab swiper-wrapper"> <div class="check swiper-slide" data-id="onef">网站特效 <div></div></div> <div class="swiper-slide" data-id="twof">网站源码<div></div></div> <div class="swiper-slide" data-id="threef">网站素材<div></div></div> <div class="swiper-slide" data-id="fourf">前端模板<div></div></div> </div> <ul class="onef"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery企业留言表单联系代码" href="https://www.php.cn/zh/toolset/js-special-effects/8071">[表单按钮] jQuery企业留言表单联系代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5 MP3音乐盒播放特效" href="https://www.php.cn/zh/toolset/js-special-effects/8070">[播放器特效] HTML5 MP3音乐盒播放特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5炫酷粒子动画导航菜单特效" href="https://www.php.cn/zh/toolset/js-special-effects/8069">[菜单导航] HTML5炫酷粒子动画导航菜单特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery可视化表单拖拽编辑代码" href="https://www.php.cn/zh/toolset/js-special-effects/8068">[表单按钮] jQuery可视化表单拖拽编辑代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="VUE.JS仿酷狗音乐播放器代码" href="https://www.php.cn/zh/toolset/js-special-effects/8067">[播放器特效] VUE.JS仿酷狗音乐播放器代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="经典html5推箱子小游戏" href="https://www.php.cn/zh/toolset/js-special-effects/8066">[html5特效] 经典html5推箱子小游戏</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery滚动添加或减少图片特效" href="https://www.php.cn/zh/toolset/js-special-effects/8065">[图片特效] jQuery滚动添加或减少图片特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="CSS3个人相册封面悬停放大特效" href="https://www.php.cn/zh/toolset/js-special-effects/8064">[相册特效] CSS3个人相册封面悬停放大特效</a> </div> </li> </ul> <ul class="twof" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8328" title="家居装潢清洁维修服务公司网站模板" target="_blank">[前端模板] 家居装潢清洁维修服务公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8327" title="清新配色个人求职简历引导页模板" target="_blank">[前端模板] 清新配色个人求职简历引导页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8326" title="设计师创意求职简历网页模板" target="_blank">[前端模板] 设计师创意求职简历网页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8325" title="现代工程建筑公司网站模板" target="_blank">[前端模板] 现代工程建筑公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8324" title="教育服务机构响应式HTML5模板" target="_blank">[前端模板] 教育服务机构响应式HTML5模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8323" title="网上电子书店商城网站模板" target="_blank">[前端模板] 网上电子书店商城网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8322" title="IT技术解决互联网公司网站模板" target="_blank">[前端模板] IT技术解决互联网公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8321" title="紫色风格外汇交易服务网站模板" target="_blank">[前端模板] 紫色风格外汇交易服务网站模板</a> </div> </li> </ul> <ul class="threef" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3078" target="_blank" title="可爱的夏天元素矢量素材(EPS+PNG)">[PNG素材] 可爱的夏天元素矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3077" target="_blank" title="四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)">[PNG素材] 四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3076" target="_blank" title="唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)">[banner图] 唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3075" target="_blank" title="金色的毕业帽矢量素材(EPS+PNG)">[PNG素材] 金色的毕业帽矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3074" target="_blank" title="黑白风格的山脉图标矢量素材(EPS+PNG)">[PNG素材] 黑白风格的山脉图标矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3073" target="_blank" title="不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)">[PNG素材] 不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3072" target="_blank" title="扁平风格的植树节banner矢量素材(AI+EPS)">[banner图] 扁平风格的植树节banner矢量素材(AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-materials/3071" target="_blank" title="九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)">[PNG素材] 九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)</a> </div> </li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8328" target="_blank" title="家居装潢清洁维修服务公司网站模板">[前端模板] 家居装潢清洁维修服务公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8327" target="_blank" title="清新配色个人求职简历引导页模板">[前端模板] 清新配色个人求职简历引导页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8326" target="_blank" title="设计师创意求职简历网页模板">[前端模板] 设计师创意求职简历网页模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8325" target="_blank" title="现代工程建筑公司网站模板">[前端模板] 现代工程建筑公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8324" target="_blank" title="教育服务机构响应式HTML5模板">[前端模板] 教育服务机构响应式HTML5模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8323" target="_blank" title="网上电子书店商城网站模板">[前端模板] 网上电子书店商城网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8322" target="_blank" title="IT技术解决互联网公司网站模板">[前端模板] IT技术解决互联网公司网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh/toolset/website-source-code/8321" target="_blank" title="紫色风格外汇交易服务网站模板">[前端模板] 紫色风格外汇交易服务网站模板</a> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper3', { autoplay: false,//可选选项,自动滑动 slidesPerView : 'auto', }) $('.wzrfourlTab>div').click(function(e){ $('.wzrfourlTab>div').removeClass('check') $(this).addClass('check') $('.wzrfourList>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> </div> </div> <footer> <div class="footer"> <div class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>公益在线PHP培训,帮助PHP学习者快速成长!</p> </div> <div class="footermid"> <a href="https://www.php.cn/zh/about/us.html">关于我们</a> <a href="https://www.php.cn/zh/about/disclaimer.html">免责声明</a> <a href="https://www.php.cn/zh/update/article_0_1.html">Sitemap</a> </div> <div class="footerbottom"> <p> © php.cn All rights reserved </p> </div> </div> </footer> <input type="hidden" id="verifycode" value="/captcha.html"> <script>layui.use(['element', 'carousel'], function () {var element = layui.element;$ = layui.jquery;var carousel = layui.carousel;carousel.render({elem: '#test1', width: '100%', height: '330px', arrow: 'always'});$.getScript('/static/js/jquery.lazyload.min.js', function () {$("img").lazyload({placeholder: "/static/images/load.jpg", effect: "fadeIn", threshold: 200, skip_invisible: false});});});</script> <script src="/static/js/common_new.js"></script> <script type="text/javascript" src="/static/js/jquery.cookie.js?1734166493"></script> <script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all'/> <script type='text/javascript' src='/static/js/viewer.min.js?1'></script> <script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script> <script type="text/javascript" src="/static/js/global.min.js?5.5.53"></script> </body> </html>