社区
学习
工具库
AI工具
休闲
搜索
简体中文
首页 > web前端 > html教程 > HTML常用标签_html/css_WEB-ITnose

HTML常用标签_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
发布： 2016-06-24 11:43:48
原创
1337 人浏览过

常用HTML标签元素结合及简介

创建一个HTML文档

设置文档标题和其它在网页中不显示的信息
设置文档的标题        

最大的标题
登录后复制
 预先格式化文本          
  下划线
  黑体字    
  斜体字    
  打字机风格的字体
  引用,通常是斜体        
  强调文本(通常是斜体加黑体)
  加重文本(通常是斜体加黑体)
  设置字体大小从1到7，颜色使用名字或RGB的十六进制值
  基准字体标记
  字体加大
  字体缩小        
  加删除线
  程式码          
  键盘字
  范例    
  变量
 
 向右缩排
  述语定义
 
 地址标记
  上标字    
  下标字
 ...固定?度字体(在文件中空白、?行、定位功能有效)
 ...</plaintext>固定?度字?(不?行??符?)<br> <listing>...</listing> 固定?度小字?  <br> <font color="00ff00">...</font>字??色<br> <font size="1">...</font>最小字?  <br> <font style="font-size:100 px">...</font>?限增大    <p> </p>   <p><strong>格式标志标签</strong><br> </p>
<p></p> 创建一个段落    <br> <p align=""> 将段落按左、中、右对齐 　<br> <br> 换行 插入换行符  <br> </p>
<blockquote></blockquote> 从两边缩进文本<br> <dl></dl> 定义列表<br> <dt> 放在每个定义术语词前<br> </dt>
<dd> 放在每个定义之前<br> <ol></ol> 创建一个标有数字的列表  <br> <ul></ul> 创建一个标有圆点的列表<br> <li> 放在每个列表项之前,若在<ol></ol>之间则每个列表项加上一个数字,<br>   若在<ul></ul>之间则每个列表项加上一个圆点 　 　<br> <div align=""></div> 用来排版大块HTML段落,也用于格式化表<br> <menu> 选项清单  <br> <dir> 目录清单  <br> <nobr></nobr> 强行不换行<br> <hr size="9" width="80%" color="ff0000">水平?(?定?度)  <br> <center></center> 水平居中     <p><strong>链接标志表格标志</strong><br> <a href="URL"></a> 创建超文本链接  <br> <a href="mailtEMAIL"><br> </a> 创建自动发送电子邮件的链接  <br> <a name="name"></a> 创建位于文档内部的书签<br> <a href="#name"></a> 创建指向位于文档内部书签的链接<br> <base> 文档中不能被该站点辨识的其它所有链接源的URL<br> <link> 定义一个链接和源之间的相互关系 </p>   <p><strong>链接标记注解：</strong></p>   <p>◆target="..."决定链接源在什么地方显示(用户自定义的名字，_blank,_parent,_self,_top<br> ◆rel="..."发送链接的类型  <br> ◆rev="..."保存链接的类型<br> ◆accesskey="..."指定该元素的热键<br> ◆shape="..."允许我们使用已定义的形状定义客户端的图形镜像(default，rect，circle，poly<br> ◆coord="..."使用像素或者长度百分比来定义形状的尺寸<br> ◆tabindex="..."使用定义过的tabindex元素设置在各个元素之间的焦点获取顺序(使用tab键使元素获得焦点)</p>    <p class="sycode"></p>  <p class="sycode"></p>  <p class="sycode">   </p>
<p class="sycode"></p>   <p class="sycode"></p>   <p class="sycode">   </p>   <p class="sycode"></p>   <p class="sycode"></p>   </dir>
</menu>
</li>
</dd>                </div>
            </div>
            <div style="display: flex;">
                                <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=html常用标签" target="_blank">HTML常用标签</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/273732.html" title="div+css实现简单的弹出窗（背景变灰色）_html/css_WEB-ITnose">
                        <span>上一篇：div+css实现简单的弹出窗（背景变灰色）_html/css_WEB-ITnose</span>
                    </a>
                                    <a href="https://www.php.cn/zh/faq/273734.html"  title="[转]响应式web设计之CSS3 Media Queries_html/css_WEB-ITnose">
                        <span>下一篇：[转]响应式web设计之CSS3 Media Queries_html/css_WEB-ITnose</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/1796771332.html">LLM的工作方式：培训前训练，神经网络，幻觉和推理</a>
                            </div>
                            <div>2025-02-26 03:58:14</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771322.html">我将区块链和AI组合在一起以生成艺术。接下来发生了什么。</a>
                            </div>
                            <div>2025-02-26 03:38:10</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771315.html">高级及时工程：思想链（COT）</a>
                            </div>
                            <div>2025-02-26 03:17:10</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771302.html">在Sqlite中检索增强发电</a>
                            </div>
                            <div>2025-02-26 02:49:09</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771274.html">如何使用LLM驱动的样板构建自己的节点。JSAPI</a>
                            </div>
                            <div>2025-02-26 01:08:13</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771258.html">2024年编码的LLM：价格，性能和争取最佳的战斗</a>
                            </div>
                            <div>2025-02-26 00:46:10</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771227.html">提示视觉语言模型</a>
                            </div>
                            <div>2025-02-25 23:42:08</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771219.html">如何衡量大语模型的响应的可靠性</a>
                            </div>
                            <div>2025-02-25 22:50:13</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771209.html">生活的幻想</a>
                            </div>
                            <div>2025-02-25 21:54:11</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796771201.html">科学家对大型语言模型的认真反映了人类思维</a>
                            </div>
                            <div>2025-02-25 20:45:11</div>
                        </li>
                                    </ul>
            </div>
        

        
        
        <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/1796784204.html">如何使用HTML5属性（例如必需，模式，最小，最大）实现自定义表单验证？</a>
                            </div>
                            <div>2025-03-25 12:28:46</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796784203.html">如何使用＆lt; time＆gt; 元素以语义表示日期和时间？</a>
                            </div>
                            <div>2025-03-25 12:21:42</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796784202.html">解释LT;输出的目的和用法＆gt; 元素。</a>
                            </div>
                            <div>2025-03-25 12:10:53</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796784201.html">什么是自定义元素（Web组件）？您如何创建和使用它们扩展HTML？</a>
                            </div>
                            <div>2025-03-25 12:02:42</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/zh/faq/1796784200.html">使用＆gt＆gt; ＆＆lt; figcaption＆gt; 元素？</a>
                            </div>
                            <div>2025-03-25 11:58:42</div>
                        </li>
                                    </ul>
            </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/lxlllslqcwrhj"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072213405043327.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="0xc000409错误如何解决" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/lxlllslqcwrhj" class="title-a-spanl" title="0xc000409错误如何解决"><span>0xc000409错误如何解决</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/wordzrhszymyj"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072214023160775.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Word中如何设置页眉页脚" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/wordzrhszymyj" class="title-a-spanl" title="Word中如何设置页眉页脚"><span>Word中如何设置页眉页脚</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/htmlgshff"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072212264974904.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html格式化方法" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/htmlgshff" class="title-a-spanl" title="html格式化方法"><span>html格式化方法</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/cpuzygg"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072213495391153.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="cpu占用过高怎么办" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/cpuzygg" class="title-a-spanl" title="cpu占用过高怎么办"><span>cpu占用过高怎么办</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/premieressmrj"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072214170357063.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="premiere是什么软件" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/premieressmrj" class="title-a-spanl" title="premiere是什么软件"><span>premiere是什么软件</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/shelljqzfcdff"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072214053389058.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="shell截取字符串的方法" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/shelljqzfcdff" class="title-a-spanl" title="shell截取字符串的方法"><span>shell截取字符串的方法</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/timedout"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072213541558037.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="timed out怎么解决" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/timedout" class="title-a-spanl" title="timed out怎么解决"><span>timed out怎么解决</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/hjfflxjs"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072211502656976.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="焊接方法类型介绍" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/hjfflxjs" class="title-a-spanl" title="焊接方法类型介绍"><span>焊接方法类型介绍</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/zh/faq/tbsqkqxzdxfff"><img class="lazy" src="/static/imghw/default1.png"  data-src="https://img.php.cn/upload/subject/202407/22/2024072212325065399.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="淘宝省钱卡取消自动续费方法" /> </a>
                            <a target="_blank" href="https://www.php.cn/zh/faq/tbsqkqxzdxfff" class="title-a-spanl" title="淘宝省钱卡取消自动续费方法"><span>淘宝省钱卡取消自动续费方法</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="url是什么意思？" href="https://www.php.cn/zh/faq/418772.html">url是什么意思？</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="DOM是什么意思" href="https://www.php.cn/zh/faq/414303.html">DOM是什么意思</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="如何改变图片大小" href="https://www.php.cn/zh/faq/414252.html">如何改变图片大小</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="HTML中如何将字体加粗" href="https://www.php.cn/zh/faq/414520.html">HTML中如何将字体加粗</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="html图片大小如何设置" href="https://www.php.cn/zh/faq/475145.html">html图片大小如何设置</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 class="lazy" src="/static/imghw/default1.png"  data-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>1439849 <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 class="lazy" src="/static/imghw/default1.png"  data-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>4300982 <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 class="lazy" src="/static/imghw/default1.png"  data-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>2685805 <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 class="lazy" src="/static/imghw/default1.png"  data-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>518012 <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 class="lazy" src="/static/imghw/default1.png"  data-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>879653 <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 class="lazy" src="/static/imghw/default1.png"  data-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 >1439849次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >2685805次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >518012次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >217282次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >925402次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >10067次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >8152次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >6907次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >851次学习</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 class="lazy" src="/static/imghw/default1.png"  data-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 >33649次学习</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?1742916067"></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>


<!-- Matomo -->
<script>
  var _paq = window._paq = window._paq || [];
  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
  _paq.push(['trackPageView']);
  _paq.push(['enableLinkTracking']);
  (function() {
    var u="https://tongji.php.cn/";
    _paq.push(['setTrackerUrl', u+'matomo.php']);
    _paq.push(['setSiteId', '9']);
    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
  })();
</script>
<!-- End Matomo Code -->

</body>
</html>