php - 怎么解决统一header，引用不同css问题？-PHP中文网问答

做网站页面时，总是会把header部分做成一个统一的，然后在不同的页面引入。但是，不同的页面可能会有自己不同的样式，不同的js，当然还有不同的等信息。<br> 这些本来该通用的部分，因为这些而变的不同，大家是怎么解决的呢？<br> 我能想到的是两种解决方案<br> + 在header中做判断<br> + 把header在做细，只做通用的一部分，剩下的部分，还是让各个页面，自己来写。</p> </div> <div class="share flexRow"> <div class="shareReply flexColumn shareDiv"> <a href="javascript:;"><img class="sharerImg" src="/static/images/images/icon50.png" data-id="1"></a> <span class="sharerSpan">7</span> </div> <div class="shareLike flexColumn shareDiv" onclick="ask_comment_good(16499)"> <a href="javascript:;" > <img class="sharerImg" src="/static/images/images/icon52.png" data-id="2"> </a> <span class="sharerSpan">0</span> </div> <div class="shareLDz flexColumn shareDiv dzdiv dzdiv1 aiaskgoodICollection" data-id=""> <a href="javascript:;" > <img class="sharerImg " src="/static/images/images/icon37.png" data-id="5"> </a> <span class="sharerSpan">0</span> </div> </div> <script> $('.jbtitleimg').on('click',function(){ $("#layuitc").hide() var layer = layui.layer; layer.closeAll(); }) $('.jbbtn').on('click',function(){ $("#layuitc").hide() var layer = layui.layer; layer.closeAll(); }) $('.sharerImg').mouseenter(function(e){ var dataId = e.currentTarget.dataset.id if(dataId == 1){ // $('.shareReply').find('img').attr('src','/static/images/images/icon51.png') }else if(dataId == 2){ // $('.shareLike').find('img').attr('src','/static/images/images/icon53.png') }else if(dataId == 4){ $('.shareShare').find('img').attr('src','/static/images/images/icon55.png') }else{ } }) $('.sharerImg').mouseleave(function(e){ var dataId = e.currentTarget.dataset.id if(dataId == 1){ // $('.shareReply').find('img').attr('src','/static/images/images/icon50.png') }else if(dataId == 2){ // $('.shareLike').find('img').attr('src','/static/images/images/icon52.png') }else if(dataId == 4){ $('.shareShare').find('img').attr('src','/static/images/images/icon54.png') } }) </script>             <div id="commentinput" class="info detail-comment-input layui-hide-sm"> <div class="detail-ci-avator"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" alt="迷茫"/> <div class="detail-r"> <span class="detail-name">迷茫</span> <p class="detail-signal">业精于勤，荒于嬉;行成于思，毁于随。</p> </div> </div> <div id="js-reply-wrap"> <div id="js-reply-editor-box" class="wd-comment-box js-ci-inner edui-imooc"></div> <div class="qa-ci-footer"> <div class="qa-ci-footright"> <button id="js-wenda-ci-submit" class="detail-btn" data-qid="16499">回答</button> </div> </div> </div> </div> <div id="pinglundeplace" class="allReply ask-reply-all-list comments-content"> <div class="arTop flexRow"> <div class="artLeft flexRow fontBold fontColor1">全部回复<b class="artlb colorGrey">(7)</b></div> <button class="artBtn ask-comment-answer">我来回复</button> </div> <div class="allReplayLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="https://img.php.cn/upload/avatar/000/000/008/585b8851bdbdb211.jpg" alt="伊谢尔伦" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/8.html" target="_blank" class="wdcdcName">伊谢尔伦<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">7楼</span> </div> <div class="wdcdcCons"><p>在需要引用header的页面：</p> <pre class='brush:php;toolbar:false;'><code class="lang-php"><?php $page_title = 'default page name'; $page_css = ''; $page_script = ''; require_once('header.php'); ?> </code></pre> <p>header.php:</p> <pre class='brush:php;toolbar:false;'><code class="lang-php"><header> <title><?=$page_title?></title> <link rel="stylesheet" href="global.css"> <?=$page_css?> <script src="jquery.js"></script> <?=$page_script?> </header> </code></pre></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12019)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12019">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="https://img.php.cn/upload/avatar/000/000/003/619af4a6bc197237.jpg" alt="ringa_lee" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/3.html" target="_blank" class="wdcdcName">ringa_lee<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">6楼</span> </div> <div class="wdcdcCons"><p>感觉这道题是在论模板存在的重要性啊。一般来说<code>title</code>往往就是显示文章名（变量）和网站标题（变量）这种，所以用<code>if</code>判断是比较方便的，各种博客主题（我接触这个比较多就单说这个了）也基本都是这样做的，类似于：</p> <pre class='brush:php;toolbar:false;'><code><title><?php if(isset($post['title'])) echo $post['title'].' - '; ?><?php echo $sitename; ?></title> </code></pre> <p>至于CSS的话一般来说基本都是各个页面变化不大的，在这种情况下可以试着用条件判断为不同的页面增加一些不一样的<code>id</code>或者<code>class</code>属性，同时在<code>style.css</code>文件中分别描述修饰内容就好了，类似于下面这种：</p> <pre class='brush:php;toolbar:false;'><code><p id="column" class="<?php echo odd($post['id']) ? 'odd' : 'even' ?>"> </p> </code></pre> <p>当然你也可以考虑在不公用的部分单独加上不同的样式的代码，正如你第二种方法所说。如果说是页面的样式区别太大的话，建议还是重新用一个模板页面（例如<code>head.index.html</code>和<code>head.page.html</code>诸如此类的）吧，因为模板本身就是布局样式差不多的放一个模板里头，如果是两个样子不一样的页面引用的而是同一个模板文件，到后面你自己也会搞晕的是么。</p></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12020)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12020">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="https://img.php.cn/upload/avatar/000/000/003/619af4a6bc197237.jpg" alt="ringa_lee" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/3.html" target="_blank" class="wdcdcName">ringa_lee<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">5楼</span> </div> <div class="wdcdcCons"><p>这个问题，可以简单的回答一下，参考Zend Framework的Layout的实现方式，简单而言就是：</p> <p>1、将Header这样的东西模板化；<br> 2、最终页面通过拼装生成；<br> 3、使用多种Helper来控制需要参数化的部分的内容。</p> <p>很多PHP框架都有类似的组件了，去选择一个参考一下具体的实现吧。</p></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12021)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12021">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="https://img.php.cn/upload/avatar/000/000/009/582a8a4e51c78729.jpg" alt="阿神" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/9.html" target="_blank" class="wdcdcName">阿神<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">4楼</span> </div> <div class="wdcdcCons"><p>saejs好像可以就是为这类问题而生的吧？？</p></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12022)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12022">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="/static/images/user_avatar.jpg" alt="巴扎黑" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/7.html" target="_blank" class="wdcdcName">巴扎黑<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">3楼</span> </div> <div class="wdcdcCons"><p>在控制器层把css的文件名以数组的形式赋值到模板，在header文件通过foreach加载css</p></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12023)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12023">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="https://img.php.cn/upload/avatar/000/000/006/5858d2cd2dae7264.jpg" alt="怪我咯" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/6.html" target="_blank" class="wdcdcName">怪我咯<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">2楼</span> </div> <div class="wdcdcCons"><p>用模板用模板用模板</p></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12024)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12024">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div class="wdsyConDiv flexRow ask_top_ul"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" alt="迷茫" class="wdcdImg"> <div class="wdcdContent flexColumn"> <div class="wdcdContentReply"> <div class="wdxqrcTop flexRow"> <a href="/member/10.html" target="_blank" class="wdcdcName">迷茫<b class="wdxqRcT colorGrey">2017-04-10 14:38:20</b></a> <span class="wdxqrcTopspan colorGrey">1楼</span> </div> <div class="wdcdcCons"><p>模板引擎layout你直得拥有</p></div> <div class="wdcdcInfo flexRow"> <a href="javascript:ask_reply_good(12025)"> <img class="wdxqindz" src="/static/images/images/icon27.png"></a> <span class="wdxqindzspan">赞 <b>+0</b></span> <div class="wdcdcileft"> <a href="javascript:;" class="wdcdciSpan reply">添加回复</a> </div> </div> <div class="wdcdContentReplyss" style="display: none;"> <div class="reply textarea-con"> <div class="replyTop flexRow"> <div class="retLeft flexRow"> <img src="https://img.php.cn/upload/avatar/000/000/010/582a97e6f29d6307.jpg" class="retlAvatar" > <span class="retlName">迷茫</span> </div>  </div> <textarea class="replaytext colorGrey" id="release-reply" placeholder="写下你的回复"></textarea> <button type="button" class="replayBtn do-reply-btn" data-id="12025">回复</button> </div> </div> <div class="wdcdContentReplyss"> <ul class="replyssul"> </ul> </div> </div> </div> </div> <div class="wdsyCondivLine"></div> <div></div> </div> </div>  <div class="phpwzright wdxq"> <a href="javascript:void(0);" onclick="publish_ask('发布话题',1)"><img src="/static/images/images/needtiwen.png" class="wdxqrImg"></a> <div class="wzrTwo"> <div class="wzrt-title"> <div>专题推荐</div> <a href="/faq/zt">更多> </a> </div> <div class="wzrtlist"> <ul> <li> <a target="_blank" href="/faq/ypdjklxjs"><img src="https://img.php.cn/upload/subject/202403/13/2024031310394619991.jpg?x-oss-process=image/resize,m_fill,h_96,w_156" /> </a> <a target="_blank" href="/faq/ypdjklxjs" class="title-a-spanl"><span>硬盘的接口类型介绍</span> </a> </li> <li> <a target="_blank" href="/faq/mongodbqdml"><img src="https://img.php.cn/upload/subject/202308/08/2023080815254794714.jpg?x-oss-process=image/resize,m_fill,h_96,w_156" /> </a> <a target="_blank" href="/faq/mongodbqdml" class="title-a-spanl"><span>mongodb启动命令</span> </a> </li> <li> <a target="_blank" href="/faq/dyjtjztzmhf"><img src="https://img.php.cn/upload/subject/202402/28/2024022817251332488.jpg?x-oss-process=image/resize,m_fill,h_96,w_156" /> </a> <a target="_blank" href="/faq/dyjtjztzmhf" class="title-a-spanl"><span>打印机脱机状态怎么恢复正常打印</span> </a> </li> <li> <a target="_blank" href="/faq/bcrjynx"><img src="https://img.php.cn/upload/subject/202308/24/2023082410554025275.jpg?x-oss-process=image/resize,m_fill,h_96,w_156" /> </a> <a target="_blank" href="/faq/bcrjynx" class="title-a-spanl"><span>编程软件有哪些</span> </a> </li> </ul> </div> </div> <div class="wzrOne"> <div class="wzroTitle"> <div> 热门话题 </div>  </div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/730402.html">QQ邮箱格式怎么填写</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1253345.html">QQ邮箱格式怎么填写 qq邮箱的格式怎么填</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/730403.html">qq邮箱的格式是什么</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1527636.html">俄罗斯Yandex搜索引擎免登录入口 Yandex搜索引擎官网一键直达</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1690411.html">怎么在电脑上定闹钟时间设置_Windows系统闹钟设置全攻略</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1014191.html">如何在苹果手机上下载并安装OKX交易所</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1402838.html">比特币八大交易软件榜单最受欢迎的比特币交易app盘点</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1047958.html">币圈三大交易所下载</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1725448.html">ArchiveofOurOwn官方网站地址 ArchiveofOurOwn镜像站官方访问链接</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a target="_blank" href="/faq/1747721.html">Yandex官网登录入口_Yandex国际版搜索引擎链接</a> </div> </li> </ul> </div> </div> <div class="wzrThree"> <div class="wzrthree-title"> <div>热门教程</div> <a target="_blank" href="https://www.php.cn/k.html">更多> </a> </div> <div class="wzrthreelist"> <div class="wzrthreeTab"> <div class="check tabdiv" data-id="one">相关教程 <div></div></div> <div class="tabdiv" data-id="two">热门推荐<div></div></div> <div class="tabdiv" data-id="three">最新课程<div></div></div> </div> <ul class="one"> </ul> <ul class="two" style="display: none;"> <li> <a target="_blank" href="/course/1656.html" title="JavaScript ES5基础线上课程教学" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/081/6862652adafef801.png" alt="JavaScript ES5基础线上课程教学"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/1656.html">JavaScript ES5基础线上课程教学</a> <div class="wzrthreerb"> <div >64937次学习</div> <a class="courseICollection" data-id="1656"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/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" href="/course/812.html">最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)</a> <div class="wzrthreerb"> <div >1484960次学习</div> <a class="courseICollection" data-id="812"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/639.html" title="phpStudy极速入门视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62611ef88fcec821.jpg" alt="phpStudy极速入门视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/639.html">phpStudy极速入门视频教程</a> <div class="wzrthreerb"> <div >529754次学习</div> <a class="courseICollection" data-id="639"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/379.html" title="独孤九贱(4)_PHP视频教程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/001/5d1c6dfc9eb09885.jpg" alt="独孤九贱(4)_PHP视频教程"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/379.html">独孤九贱(4)_PHP视频教程</a> <div class="wzrthreerb"> <div >1249519次学习</div> <a class="courseICollection" data-id="379"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/801.html" title="PHP实战天龙八部之仿爱奇艺电影网站" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/001/5d2426f409839992.jpg" alt="PHP实战天龙八部之仿爱奇艺电影网站"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/801.html">PHP实战天龙八部之仿爱奇艺电影网站</a> <div class="wzrthreerb"> <div >769630次学习</div> <a class="courseICollection" data-id="801"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> </ul> <ul class="three" style="display: none;"> <li> <a target="_blank" href="/course/1696.html" title="最新Python教程从入门到精通" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/081/68c135bb72783194.png" alt="最新Python教程从入门到精通"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/1696.html">最新Python教程从入门到精通</a> <div class="wzrthreerb"> <div >2726次学习</div> <a class="courseICollection" data-id="1696"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/1656.html" title="JavaScript ES5基础线上课程教学" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/081/6862652adafef801.png" alt="JavaScript ES5基础线上课程教学"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/1656.html">JavaScript ES5基础线上课程教学</a> <div class="wzrthreerb"> <div >64937次学习</div> <a class="courseICollection" data-id="1656"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/1655.html" title="PHP新手语法线上课程教学" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/081/684a8c23d811b293.png" alt="PHP新手语法线上课程教学"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/1655.html">PHP新手语法线上课程教学</a> <div class="wzrthreerb"> <div >6428次学习</div> <a class="courseICollection" data-id="1655"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/1654.html" title="支付宝沙箱支付（个人也能用的支付）" class="wzrthreelaimg"> <img src="https://img.php.cn/teacher/course/20240819/172406094466c31510e008b.jpg" alt="支付宝沙箱支付（个人也能用的支付）"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/1654.html">支付宝沙箱支付（个人也能用的支付）</a> <div class="wzrthreerb"> <div >4508次学习</div> <a class="courseICollection" data-id="1654"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> <li> <a target="_blank" href="/course/1650.html" title="麻省理工大佬Python课程" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/66592dcfeb1b4698.png" alt="麻省理工大佬Python课程"/> </a> <div class="wzrthree-right"> <a target="_blank" href="/course/1650.html">麻省理工大佬Python课程</a> <div class="wzrthreerb"> <div >41271次学习</div> <a class="courseICollection" data-id="1650"><img src="/static/images/images/icon-small-nocollect.png" class="nofollow">收藏</a> </div> </div> </li> </ul> </div> <script> $('.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="/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"> <div class="wzrfourlTab"> <div class="check" data-id="onef">网站特效 <div></div></div> <div class="" data-id="twof">网站源码<div></div></div> <div class="" data-id="threef">网站素材<div></div></div> <div class="" 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="/xiazai/js/8071">[表单按钮] jQuery企业留言表单联系代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5 MP3音乐盒播放特效" href="/xiazai/js/8070">[播放器特效] HTML5 MP3音乐盒播放特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5炫酷粒子动画导航菜单特效" href="/xiazai/js/8069">[菜单导航] HTML5炫酷粒子动画导航菜单特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery可视化表单拖拽编辑代码" href="/xiazai/js/8068">[表单按钮] jQuery可视化表单拖拽编辑代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="VUE.JS仿酷狗音乐播放器代码" href="/xiazai/js/8067">[播放器特效] VUE.JS仿酷狗音乐播放器代码</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="经典html5推箱子小游戏" href="/xiazai/js/8066">[html5特效] 经典html5推箱子小游戏</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery滚动添加或减少图片特效" href="/xiazai/js/8065">[图片特效] jQuery滚动添加或减少图片特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="CSS3个人相册封面悬停放大特效" href="/xiazai/js/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="/xiazai/code/10999" title="5ECRM2004 加密版" target="_blank">[电商源码] 5ECRM2004 加密版</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10998" title="CuuMall免费开源网上商城系统" target="_blank">[电商源码] CuuMall免费开源网上商城系统</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10997" title="清爽型淘客天下模板" target="_blank">[电商源码] 清爽型淘客天下模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10996" title="E商企业产品发布系统.NET版" target="_blank">[电商源码] E商企业产品发布系统.NET版</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10995" title="一点牛社区团购" target="_blank">[电商源码] 一点牛社区团购</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10994" title="亚洲互联点卡网站网银在线版" target="_blank">[电商源码] 亚洲互联点卡网站网银在线版</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10993" title="支付宝账户登录ecshop插件" target="_blank">[电商源码] 支付宝账户登录ecshop插件</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/10992" 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="/xiazai/sucai/3872" target="_blank" title="购物节促销折扣主题海报设计下载">[psd素材] 购物节促销折扣主题海报设计下载</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3871" target="_blank" title="酒吧聚会宣传海报PSD源文件设计下载">[psd素材] 酒吧聚会宣传海报PSD源文件设计下载</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3870" target="_blank" title="快餐美食招贴海报设计源文件下载">[psd素材] 快餐美食招贴海报设计源文件下载</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3869" target="_blank" title="节日礼物包装袋合集矢量素材">[矢量素材] 节日礼物包装袋合集矢量素材</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3868" target="_blank" title="特价美食产品招贴海报PSD模板设计下载">[psd素材] 特价美食产品招贴海报PSD模板设计下载</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3867" target="_blank" title="立冬节气简约海报矢量模板">[矢量素材] 立冬节气简约海报矢量模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3866" target="_blank" title="啤酒特价折扣宣传方形海报素材下载">[psd素材] 啤酒特价折扣宣传方形海报素材下载</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/sucai/3865" target="_blank" title="美味甜甜圈美食正方形海报PSD模板下载">[psd素材] 美味甜甜圈美食正方形海报PSD模板下载</a> </div> </li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8590" target="_blank" title="驾照考试驾校HTML5网站模板">[前端模板] 驾照考试驾校HTML5网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8589" target="_blank" title="驾照培训服务机构宣传网站模板">[前端模板] 驾照培训服务机构宣传网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8588" target="_blank" title="HTML5房地产公司宣传网站模板">[前端模板] HTML5房地产公司宣传网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8587" target="_blank" title="新鲜有机肉类宣传网站模板">[前端模板] 新鲜有机肉类宣传网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8586" target="_blank" title="响应式天气预报宣传网站模板">[前端模板] 响应式天气预报宣传网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8585" target="_blank" title="房屋建筑维修公司网站CSS模板">[前端模板] 房屋建筑维修公司网站CSS模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8584" target="_blank" title="响应式志愿者服务网站模板">[前端模板] 响应式志愿者服务网站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="/xiazai/code/8583" target="_blank" title="创意T恤打印店网站HTML5模板">[前端模板] 创意T恤打印店网站HTML5模板</a> </div> </li> </ul> </div> <script> $('.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> </div>    <div class="phpFoot"> <div class="phpFootIn"> <div class="phpFootCont"> <div class="phpFootLeft"> <dl> <dt> <a href="/about/us.html" rel="nofollow" target="_blank" title="关于我们" class="cBlack">关于我们</a> <a href="/about/disclaimer.html" rel="nofollow" target="_blank" title="免责申明" class="cBlack">免责申明</a> <a href="/about/jbzx.html" rel="nofollow" target="_blank" title="举报中心" class="cBlack">举报中心</a> <a href="javascript:;" rel="nofollow" onclick="advice_data(99999999,'意见反馈')" title="意见反馈" class="cBlack">意见反馈</a> <a href="https://www.php.cn/teacher.html" rel="nofollow" target="_blank" title="讲师合作" class="cBlack">讲师合作</a> <a href="https://www.php.cn/blog/detail/20304.html" rel="nofollow" target="_blank" title="广告合作" class="cBlack">广告合作</a>  <a href="/new/" target="_blank" title="最新文章列表" class="cBlack">最新更新</a> <a href="https://global.php.cn/" target="_blank" title="English" class="cBlack">English</a> <div class="clear"></div> </dt> <dd class="cont1">php中文网：公益在线php培训，帮助PHP学习者快速成长！</dd> <dd class="cont2"> <span class="ylwTopBox"> <a href="javascript:;" class="cBlack"><b class="icon1"></b>关注服务号</a> <em style="display:none;" class="ylwTopSub"> <p>微信扫码<br/>关注PHP中文网服务号</p> <img src="/static/images/examples/text16.png"/> </em> </span> <span class="ylwTopBox"> <a href="tencent://message/?uin=27220243&Site=www.php.cn&Menu=yes" target="_blank" class="cBlack"><b class="icon2"></b>技术交流群</a> <em style="display:none;" class="ylwTopSub"> <p>QQ扫码<br/>加入技术交流群</p> <img src="/static/images/examples/text18.png"/> </em> </span> <div class="clear"></div> </dd> </dl> </div> <div class="phpFootRight"> <div class="phpFootMsg"> <span><img src="/static/images/examples/text17.png"/></span> <dl> <dt>PHP中文网订阅号</dt> <dd>每天精选资源文章推送</dd> </dl> </div> <div class="phpFootMsg"> <span><img src="/static/images/examples/text14.png"/></span> <dl> <dt>PHP中文网APP</dt> <dd>随时随地碎片化学习</dd> </dl> </div> </div> </div> </div> <div class="phpFootCode"> <div class="phpFootCodeIn"><p>Copyright 2014-2025 <a href="https://www.php.cn/" target="_blank">https://www.php.cn/</a> All Rights Reserved | php.cn | <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">湘ICP备2023035733号</a></p><a href="http://www.beian.gov.cn/portal/index.do" rel="nofollow" target="_blank"><b></b></a></div> </div> </div> <input type="hidden" id="verifycode" value="/captcha.html"> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?c0e685c8743351838d2a7db1c49abd56"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <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> <span class="layui-hide"><script type="text/javascript" src="https://s4.cnzz.com/z_stat.php?id=1280886301&web_id=1280886301"></script></span>  <style> .layui-fixbar{display: none;} </style> <div class="phpSdhBox" style="height:240px !important;"> <li> <div class="phpSdhIn"> <div class="phpSdhTitle"> <a href="/k24.html" target="_blank" class="hover" title="PHP学习"> <b class="icon1"></b> <p>PHP学习</p> </a> </div> </div> </li> <li> <div class="phpSdhIn"> <div class="phpSdhTitle"> <a href="https://www.php.cn/blog/detail/1047189.html" target="_blank"> <b class="icon2"></b> <p>技术支持</p> </a> </div> </div> </li> <li> <div class="phpSdhIn"> <div class="phpSdhTitle"> <a href="#"> <b class="icon6"></b> <p>返回顶部</p> </a> </div> </div> </li> </div>  <script src="/static/layui/layui.all.js"></script> <script src="/static/ueditor/ueditor.config.js"></script> <script src="/static/ueditor/ueditor.user.all.js"></script> <script src="/static/ueditor/third-party/SyntaxHighlighter/shCore.js"></script> <script type="text/javascript" src="/static/video/video.js?1.7" charset="UTF-8"></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.33"></script> <script>$('.isAct-attr').viewer();</script> </body> </html>