header标签用于构建页面可见的语义化头部区域，而head标签是存放不可见元数据的容器；1. header中应包含品牌标识（如带h1的logo）、主导航（nav标签）、搜索框等用户可见内容；2. 为seo优化，需在h1中体现网站名称或关键词、使用语义化导航链接、提升用户体验以降低跳出率；3. 移动端设计应保持简洁，采用汉堡菜单隐藏导航、固定头部、图标化搜索、确保logo可点击返回首页，并注重可访问性与操作便捷性，从而提升整体用户体验和搜索引擎友好度。
header标签在 HTML5 中扮演着一个关键的角色，它是一个语义化的容器，通常用来承载页面或某个独立部分的介绍性内容，比如网站的标志、主标题、导航链接，甚至是一个搜索表单。它并不是指整个 HTML 文档的 部分，而是页面可见内容顶部的一个逻辑区域。至于网页头部怎么写，这实际上是在问如何构建和组织
header标签内部的内容，使其既符合语义，又能提供良好的用户体验。
构建一个网页头部，也就是使用
header标签，其实挺有意思的。它不只是把东西堆在一起，更像是在给你的网站一张脸，告诉访客“我是谁，我能带你去哪”。
一个典型的
header结构，我会这样考虑：
我会先放网站的品牌标识。这通常是一个
标签，里面可能包含网站的名称，或者一个
标签包裹的
@@##@@（也就是你的Logo），点击后能回到首页。比如：
@@##@@我的精彩世界
这里有个小技巧，如果Logo图片里已经包含了网站名称，那么
标签可以直接包裹
和
@@##@@，或者
里面只放一个
隐藏的文本，确保SEO友好性，同时视觉上只显示Logo。这取决于具体设计和语义需求。
接着是导航。这是
header里非常核心的部分，一般会用 标签包裹
- 和
有时候，你可能还会想在头部放一个搜索框。这通常是一个
注意这里的
sr-only是一个常见的CSS类，用来把标签在视觉上隐藏，但对屏幕阅读器依然可见，这在可访问性上很重要。
所以，一个完整的
header结构大概会是这样：
@@##@@ 我的精彩世界
当然，这只是一个基础框架。实际项目中，你可能还会加入用户登录/注册链接、多语言切换、购物车图标等等。关键在于保持逻辑清晰，每个元素都放在它语义上最合适的位置。
header标签和head标签有什么区别？
这个问题啊，初学者经常会混淆，但它们俩完全是两码事。简单来说，
header标签是给“人”看的，而
head标签是给“浏览器和搜索引擎”看的。
header，就像我们前面说的，它是一个 HTML5 的语义化标签，用于定义文档或一个区段的介绍性内容或导航链接。它属于 标签内部的内容，是用户在浏览器中能直接看到的部分。你可以把它想象成一本书的封面或章节的标题页，上面有书名、作者、出版社，甚至目录的一部分。它的作用是让页面的结构更清晰，帮助搜索引擎理解这块区域是页面的头部信息。
而
head标签，它是整个 HTML 文档的头部元数据容器。它位于 标签内部，但却在 标签之前。
head里面的内容是不会直接显示在网页上的，它承载的是关于网页的各种“幕后”信息，比如：
</pre>：网页的标题，显示在浏览器标签页上。</li> <li><pre class="brush:php;toolbar:false;"><meta></pre>：字符集、视口设置、描述、关键词等，对SEO和设备适配至关重要。</li> <li><pre class="brush:php;toolbar:false;"><link></pre>：引入外部CSS文件。</li> <li><pre class="brush:php;toolbar:false;"><script></pre>：引入JavaScript文件（虽然现在也推荐在 <pre class="brush:php;toolbar:false;"><body></pre> 底部引入以优化性能）。</li> <li><pre class="brush:php;toolbar:false;"><style></pre>：内联CSS样式。</li> </ul> <p>打个比方，如果你的网页是一辆汽车，<pre class="brush:php;toolbar:false;">header</pre> 标签就像是汽车的引擎盖、车头灯、车标，是车辆“外观”的一部分，告诉你这是什么牌子，长什么样。而 <pre class="brush:php;toolbar:false;">head</pre> 标签呢，更像是汽车的说明书和配置清单，里面写着这辆车的型号、发动机参数、排放标准、用了什么轮胎等等，这些信息对驾驶员（浏览器）和管理部门（搜索引擎）很重要，但你坐在车里是看不到这些说明书内容的。</p><div class="aritcle_card flexRow"> <div class="artcardd flexRow"> <a class="aritcle_card_img" href="/ai/2075" title="九歌"><img src="https://img.php.cn/upload/ai_manual/000/000/000/175680183660656.png" alt="九歌"></a> <div class="aritcle_card_info flexColumn"> <a href="/ai/2075" title="九歌">九歌</a> <p>九歌--人工智能诗歌写作系统</p> </div> <a href="/ai/2075" title="九歌" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <p>所以，记住它们的根本区别：<pre class="brush:php;toolbar:false;">header</pre> 是可见内容的语义区，<pre class="brush:php;toolbar:false;">head</pre> 是不可见元数据的容器。理解这一点，对于写出规范且高效的HTML代码至关重要。</p> <h3>在网页头部放置哪些内容有助于SEO？</h3> <p>谈到SEO，很多人会把注意力放在内容区和 <pre class="brush:php;toolbar:false;">head</pre> 标签里的 <pre class="brush:php;toolbar:false;"><meta></pre> 信息上，但其实 <pre class="brush:php;toolbar:false;">header</pre> 区域的内容组织对SEO同样有着不小的影响，虽然不是直接的排名因素，但它极大地影响了用户体验和爬虫的抓取效率。</p> <p>首先，<strong>主标题（<pre class="brush:php;toolbar:false;"><h1></pre>）</strong>。这是 <pre class="brush:php;toolbar:false;">header</pre> 标签里最直接的SEO元素。如果你的网站名称或主要关键词能自然地出现在 <pre class="brush:php;toolbar:false;"><h1></pre> 中，那绝对是加分项。搜索引擎会认为 <pre class="brush:php;toolbar:false;"><h1></pre> 里的内容是页面最重要的标题。不过，要避免关键词堆砌。如果你的Logo图片已经包含了品牌名，那么 <pre class="brush:php;toolbar:false;"><h1></pre> 标签可以包裹Logo，或者用CSS隐藏 <pre class="brush:php;toolbar:false;"><h1></pre> 文本但保留其语义，确保屏幕阅读器也能读到。我个人更倾向于在 <pre class="brush:php;toolbar:false;"><h1></pre> 中放网站的品牌名，即使有Logo，因为这能清晰地告诉搜索引擎这个页面是属于哪个网站的。</p> <p>接着，<strong>清晰的导航（<pre class="brush:php;toolbar:false;"><nav></pre>）</strong>。这是重中之重。一个结构良好、语义清晰的导航栏，能让搜索引擎爬虫更好地理解你网站的结构和各个页面之间的关系。这意味着：</p> <ul> <li> <strong>使用描述性强的链接文本</strong>：比如“产品与服务”比“这里”要好得多。</li> <li> <strong>避免使用JavaScript进行导航</strong>：确保主要导航是纯HTML链接，这样爬虫才能顺利抓取。</li> <li> <strong>链接到重要的页面</strong>：把网站的核心页面放在主导航中，这会传递权重。</li> </ul> <p>再来，虽然不直接是SEO因素，但<strong>搜索框</strong>的存在也间接有益。一个易于找到和使用的搜索框能提升用户体验。用户能更快找到他们想要的内容，这会降低跳出率，增加页面停留时间，这些都是搜索引擎评估网站质量的信号。</p> <p>还有，如果你的网站是多语言的，在 <pre class="brush:php;toolbar:false;">header</pre> 区域放置<strong>语言切换器</strong>（但要配合 <pre class="brush:php;toolbar:false;">head</pre> 里的 <pre class="brush:php;toolbar:false;">hreflang</pre> 标签使用），也能帮助搜索引擎理解你的多语言策略，避免重复内容问题。</p> <p>最后，记住一点：所有这些元素都应该服务于用户体验。搜索引擎越来越智能，它们能够识别那些为了SEO而牺牲用户体验的做法。一个对用户友好的 <pre class="brush:php;toolbar:false;">header</pre>，自然也会得到搜索引擎的青睐。</p> <h3>移动端网页头部设计有哪些最佳实践？</h3> <p>移动优先的设计理念现在是主流，尤其是在头部区域，它直接关系到用户在小屏幕上的第一印象和操作便捷性。移动端的 <pre class="brush:php;toolbar:false;">header</pre> 设计，我觉得有几个点是必须考虑的：</p> <p>首先，<strong>简洁至上</strong>。在桌面端，你可能可以放很多东西，但在手机上，屏幕空间非常宝贵。所以，要精简 <pre class="brush:php;toolbar:false;">header</pre> 的内容，只保留最核心的元素：品牌Logo/名称、导航入口和可能的搜索入口。</p> <p>接着，<strong>汉堡菜单（Hamburger Menu）</strong>。这几乎成了移动端导航的标配。把复杂的导航菜单收起来，只显示一个三条杠的图标。点击后，菜单从侧边滑出或以全屏覆盖的方式展现。这既节省了空间，又保持了导航的完整性。当然，也要考虑菜单打开后的可读性和操作性。</p><pre class='brush:html;toolbar:false;'><header> <a href="/" class="mobile-logo"> @@##@@ </a> <button class="hamburger-menu" aria-label="打开导航菜单"> <span></span> <span></span> <span></span> </button> <nav class="mobile-nav"> <!-- 导航链接 --> </nav> </header></pre><p>这里 <pre class="brush:php;toolbar:false;">aria-label</pre> 属性很重要，它提升了可访问性，让屏幕阅读器用户知道这个按钮的作用。</p> <p>第三，<strong>Logo和品牌名称的可见性</strong>。即使空间有限，也要确保Logo清晰可见，并能点击回到首页。这是建立品牌认知和提供基本导航的关键。通常，Logo会放在左侧，占据较小的空间。</p> <p>第四，<strong>搜索功能的处理</strong>。在移动端，搜索功能通常以一个放大镜图标的形式出现，点击后可以展开搜索框，或者跳转到专门的搜索页面。避免直接在 <pre class="brush:php;toolbar:false;">header</pre> 中显示一个完整的搜索输入框，那会占据太多宝贵的空间。</p> <p>第五，<strong>固定头部（Sticky Header）</strong>。很多移动网站会选择让 <pre class="brush:php;toolbar:false;">header</pre> 固定在屏幕顶部，即使用户滚动页面，头部也始终可见。这对于快速访问导航或品牌标识非常有用。但在实现时要注意，不要让固定头部占据过多的屏幕高度，尤其是在小屏幕设备上，否则会遮挡太多内容。</p> <img alt="什么是header标签？网页头部怎么写？" ><img src="images/logo.png" alt="我的网站Logo" style="max-width:90%" style="max-width:90%"><img alt="什么是header标签？网页头部怎么写？" ><img src="images/logo.png" alt="我的网站Logo"><img src="images/logo.png" alt="我的网站Logo"> </div> <div class="artmoreart "> <div class="artdp artptit"><span></span> <p>相关文章</p> </div> <div class="artmores flexColumn"> <a class="artmrlis flexRow" href="/faq/1995391.html" title="轮播图怎么制作html_轮播图制作html入门方法【基础】"><b></b> <p class="overflowclass">轮播图怎么制作html_轮播图制作html入门方法【基础】</p> </a> <a class="artmrlis flexRow" href="/faq/1995358.html" title="猎豹浏览器如何开启html5硬件加速_猎豹浏览器开硬件加速法【优化】"><b></b> <p class="overflowclass">猎豹浏览器如何开启html5硬件加速_猎豹浏览器开硬件加速法【优化】</p> </a> <a class="artmrlis flexRow" href="/faq/1995356.html" title="html5网站模板怎样添加页面过渡动画_html5加过渡动画窍门【指南】"><b></b> <p class="overflowclass">html5网站模板怎样添加页面过渡动画_html5加过渡动画窍门【指南】</p> </a> <a class="artmrlis flexRow" href="/faq/1995315.html" title="HTML怎样设背景图片径向渐变_HTML径向渐变背景图片法【光影】"><b></b> <p class="overflowclass">HTML怎样设背景图片径向渐变_HTML径向渐变背景图片法【光影】</p> </a> <a class="artmrlis flexRow" href="/faq/1995298.html" title="HTML下拉框怎么设选中样式_CSS给HTML下拉框改选中项色【样式】"><b></b> <p class="overflowclass">HTML下拉框怎么设选中样式_CSS给HTML下拉框改选中项色【样式】</p> </a> </div> <div class="artmoretabs flexRow"> <p>相关标签:</p> <div class="mtbs flexRow"> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/zt/15716.html" target="_blank">css</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/zt/16180.html" target="_blank">浏览器</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/zt/17539.html" target="_blank">ai</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/zt/27988.html" target="_blank">区别</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/zt/41136.html" target="_blank">多语言切换</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=JavaScript" target="_blank">JavaScript</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=html5" target="_blank">html5</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=css" target="_blank">css</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=html" target="_blank">html</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=堆" target="_blank">堆</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=input" target="_blank">input</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=ul" target="_blank">ul</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=li" target="_blank">li</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=搜索引擎" target="_blank">搜索引擎</a> <a class="mtbsa flexRow" onclick="hits_log(2,'www',this);" href-data="/search?q=SEO" target="_blank">SEO</a> </div> </div> <p class="statement">本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn</p> <div class="lastanext flexRow"> <a class="lastart flexRow" href="/faq/1439849.html" title="什么是HTML重置按钮？reset按钮还常用吗？"><span>上一篇：</span>什么是HTML重置按钮？reset按钮还常用吗？</a> <a class="nextart flexRow" href="/faq/1439878.html" title="thead、tbody和tfoot标签的区别？表格结构如何划分？"><span>下一篇：</span>thead、tbody和tfoot标签的区别？表格结构如何划分？</a> </div> </div> <div class="artlef-down "> <div class="authormore "> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>作者最新文章</p> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1989937.html" title="微信文件过期了怎么恢复 找回已过期的微信文件实用教程"><b></b> <p class="overflowclass">微信文件过期了怎么恢复 找回已过期的微信文件实用教程</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 16:42</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1989951.html" title="高德地图升级下载特别慢怎么办 提高高德更新速度的技巧"><b></b> <p class="overflowclass">高德地图升级下载特别慢怎么办 提高高德更新速度的技巧</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 16:44</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990014.html" title="网页禁止复制文字怎么办 谷歌浏览器破解网页复制限制【插件】"><b></b> <p class="overflowclass">网页禁止复制文字怎么办 谷歌浏览器破解网页复制限制【插件】</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 16:55</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990033.html" title="联邦快递快速查询入口 输入单号一键查询物流状态"><b></b> <p class="overflowclass">联邦快递快速查询入口 输入单号一键查询物流状态</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 16:59</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990067.html" title="一卡路里等于多少大卡 一卡等于一千卡吗"><b></b> <p class="overflowclass">一卡路里等于多少大卡 一卡等于一千卡吗</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 17:06</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990196.html" title="漫蛙2026最新链接入口_manwa2官方正版直连"><b></b> <p class="overflowclass">漫蛙2026最新链接入口_manwa2官方正版直连</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 17:30</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990267.html" title="yy漫画画质清晰入口 yy漫画最新章节抢先看"><b></b> <p class="overflowclass">yy漫画画质清晰入口 yy漫画最新章节抢先看</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 17:42</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990269.html" title="yy漫画官网直达入口 yy漫画无修版在线免费入口"><b></b> <p class="overflowclass">yy漫画官网直达入口 yy漫画无修版在线免费入口</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 17:42</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990278.html" title="腾讯软件管理中心入口 应用宝电脑管家软件仓库入口"><b></b> <p class="overflowclass">腾讯软件管理中心入口 应用宝电脑管家软件仓库入口</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 17:44</p> </div> </div> </div> <div class="authlist flexColumn"> <div class="autharts flexRow"> <a class="autharta flexRow " href="/faq/1990287.html" title="12315处理结果不满意怎么办 12315行政复议申请入口"><b></b> <p class="overflowclass">12315处理结果不满意怎么办 12315行政复议申请入口</p> </a> <div class="authtime flexRow"><b></b> <p>2026-01-16 17:46</p> </div> </div> </div> </div> <div class="moreAi "> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>热门AI工具</p> </div> <a target="_blank" class="rititle-more flexRow" href="/ai" title="热门AI工具"><span>更多</span><b></b></a> </div> <div class="moreailist flexRow"> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/723" title="DeepSeek" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679963982777.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="DeepSeek" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">DeepSeek</p> <p class="overflowclass abriptwo">幻方量化公司旗下的开源大模型平台</p> <div class="aidconstab flexRow"> <p href="/ai/tag/code/large-model" title="AI大模型" class="aidcontbp flexRow flexcenter">AI大模型</p> <p href="/ai/tag/code/open-plat" title="开放平台" class="aidcontbp flexRow flexcenter">开放平台</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/726" title="豆包大模型" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175680204067325.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="豆包大模型" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">豆包大模型</p> <p class="overflowclass abriptwo">字节跳动自主研发的一系列大型语言模型</p> <div class="aidconstab flexRow"> <p href="/ai/tag/code/large-model" title="AI大模型" class="aidcontbp flexRow flexcenter">AI大模型</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/725" title="通义千问" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679974228210.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="通义千问" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">通义千问</p> <p class="overflowclass abriptwo">阿里巴巴推出的全能AI助手</p> <div class="aidconstab flexRow"> <p href="/ai/tag/code/large-model" title="AI大模型" class="aidcontbp flexRow flexcenter">AI大模型</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/854" title="腾讯元宝" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679978251103.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="腾讯元宝" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">腾讯元宝</p> <p class="overflowclass abriptwo">腾讯混元平台推出的AI助手</p> <div class="aidconstab flexRow"> <p href="/ai/tag/office/docs" title="文档处理" class="aidcontbp flexRow flexcenter">文档处理</p> <p href="/ai/tag/office/excel" title="Excel 表格" class="aidcontbp flexRow flexcenter">Excel 表格</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/724" title="文心一言" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679974557049.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="文心一言" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">文心一言</p> <p class="overflowclass abriptwo">文心一言是百度开发的AI聊天机器人，通过对话可以生成各种形式的内容。</p> <div class="aidconstab flexRow"> <p href="/ai/tag/code/large-model" title="AI大模型" class="aidcontbp flexRow flexcenter">AI大模型</p> <p href="/ai/tag/text/chinese-writing" title="中文写作" class="aidcontbp flexRow flexcenter">中文写作</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/1507" title="讯飞写作" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/969/633/68b7a4153cd86671.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="讯飞写作" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">讯飞写作</p> <p class="overflowclass abriptwo">基于讯飞星火大模型的AI写作工具，可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿</p> <div class="aidconstab flexRow"> <p href="/ai/tag/text/chinese-writing" title="中文写作" class="aidcontbp flexRow flexcenter">中文写作</p> <p href="/ai/tag/text/write" title="写作工具" class="aidcontbp flexRow flexcenter">写作工具</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/1115" title="即梦AI" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/001/246/273/68b6d8f7c530c315.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="即梦AI" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">即梦AI</p> <p class="overflowclass abriptwo">一站式AI创作平台，免费AI图片和视频生成。</p> <div class="aidconstab flexRow"> <p href="/ai/tag/image/image-titching" title="图片拼接" class="aidcontbp flexRow flexcenter">图片拼接</p> <p href="/ai/tag/image/image-create" title="图画生成" class="aidcontbp flexRow flexcenter">图画生成</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/808" title="ChatGPT" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679970194596.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="ChatGPT" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">ChatGPT</p> <p class="overflowclass abriptwo">最最强大的AI聊天机器人程序，ChatGPT不单是聊天机器人，还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。</p> <div class="aidconstab flexRow"> <p href="/ai/tag/code/large-model" title="AI大模型" class="aidcontbp flexRow flexcenter">AI大模型</p> <p href="/ai/tag/text/chinese-writing" title="中文写作" class="aidcontbp flexRow flexcenter">中文写作</p> </div> </div> </a> </div> <div class="aidcons flexRow check "> <a target="_blank" href="/ai/821" title="智谱清言 - 免费全能的AI助手" class="aibtns flexRow"> <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679976181507.png?x-oss-process=image/resize,m_mfit,h_70,w_70,limit_0" alt="智谱清言 - 免费全能的AI助手" class="aibtnimg" onerror="this.src='/static/lhimages/moren/morentu.png'"> <div class="aibtn-right flexColumn"> <p class="overflowclass abripone">智谱清言 - 免费全能的AI助手</p> <p class="overflowclass abriptwo">智谱清言 - 免费全能的AI助手</p> <div class="aidconstab flexRow"> <p href="/ai/tag/code/large-model" title="AI大模型" class="aidcontbp flexRow flexcenter">AI大模型</p> <p href="/ai/tag/office/pdf" title="PDF 文档" class="aidcontbp flexRow flexcenter">PDF 文档</p> </div> </div> </a> </div> </div> </div> </div> </div> </div> <div class="conRight artdtilRight "> <div class="artrig-adv "> <script type="text/javascript" src="https://teacher.php.cn/php/MDM3MTk1MGYxYjI5ODJmNTE0ZWVkZTA3NmJhYzhmMjI6Og=="></script> </div> <div class="hotzt artdtzt"> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>相关专题</p> </div> <a target="_blank" class="rititle-more flexRow" href="/faq/zt" title="相关专题"><span>更多</span><b></b></a> </div> <div class="hotztuls flexColumn"> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/jsszcd" class="aClass flexRow hotzta" title="js获取数组长度的方法"><img src="https://img.php.cn/upload/subject/202306/20/2023062017455159983.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="js获取数组长度的方法" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/jsszcd" class="aClass flexRow hotztra overflowclass" title="js获取数组长度的方法">js获取数组长度的方法</a> <p class="aClass flexRow hotztrp overflowclass">在js中，可以利用array对象的length属性来获取数组长度，该属性可设置或返回数组中元素的数目，只需要使用“array.length”语句即可返回表示数组对象的元素个数的数值，也就是长度值。php中文网还提供JavaScript数组的相关下载、相关课程等内容，供大家免费下载使用。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">556</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.06.20</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/jssxym" class="aClass flexRow hotzta" title="js刷新当前页面"><img src="https://img.php.cn/upload/subject/202307/04/2023070409584996422.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="js刷新当前页面" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/jssxym" class="aClass flexRow hotztra overflowclass" title="js刷新当前页面">js刷新当前页面</a> <p class="aClass flexRow hotztrp overflowclass">js刷新当前页面的方法：1、reload方法，该方法强迫浏览器刷新当前页面，语法为“location.reload([bForceGet]) ”；2、replace方法，该方法通过指定URL替换当前缓存在历史里（客户端）的项目，因此当使用replace方法之后，不能通过“前进”和“后退”来访问已经被替换的URL，语法为“location.replace(URL) ”。php中文网为大家带来了js刷新当前页面的相关知识、以及相关文章等内容</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">374</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.07.04</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/jssswr" class="aClass flexRow hotzta" title="js四舍五入"><img src="https://img.php.cn/upload/subject/202307/04/2023070410160418152.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="js四舍五入" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/jssswr" class="aClass flexRow hotztra overflowclass" title="js四舍五入">js四舍五入</a> <p class="aClass flexRow hotztrp overflowclass">js四舍五入的方法：1、tofixed方法，可把 Number 四舍五入为指定小数位数的数字；2、round() 方法，可把一个数字舍入为最接近的整数。php中文网为大家带来了js四舍五入的相关知识、以及相关文章等内容</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">732</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.07.04</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/jsscjddff" class="aClass flexRow hotzta" title="js删除节点的方法"><img src="https://img.php.cn/upload/subject/202309/01/2023090117024286721.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="js删除节点的方法" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/jsscjddff" class="aClass flexRow hotztra overflowclass" title="js删除节点的方法">js删除节点的方法</a> <p class="aClass flexRow hotztrp overflowclass">js删除节点的方法有：1、removeChild()方法，用于从父节点中移除指定的子节点，它需要两个参数，第一个参数是要删除的子节点，第二个参数是父节点；2、parentNode.removeChild()方法，可以直接通过父节点调用来删除子节点；3、remove()方法，可以直接删除节点，而无需指定父节点；4、innerHTML属性，用于删除节点的内容。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">477</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.09.01</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/javascriptzy" class="aClass flexRow hotzta" title="JavaScript转义字符"><img src="https://img.php.cn/upload/subject/202309/04/2023090411084899588.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="JavaScript转义字符" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/javascriptzy" class="aClass flexRow hotztra overflowclass" title="JavaScript转义字符">JavaScript转义字符</a> <p class="aClass flexRow hotztrp overflowclass">JavaScript中的转义字符是反斜杠和引号，可以在字符串中表示特殊字符或改变字符的含义。本专题为大家提供转义字符相关的文章、下载、课程内容，供大家免费下载体验。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">394</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.09.04</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/jsscsjsdff" class="aClass flexRow hotzta" title="js生成随机数的方法"><img src="https://img.php.cn/upload/subject/202309/04/2023090411300156430.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="js生成随机数的方法" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/jsscsjsdff" class="aClass flexRow hotztra overflowclass" title="js生成随机数的方法">js生成随机数的方法</a> <p class="aClass flexRow hotztrp overflowclass">js生成随机数的方法有：1、使用random函数生成0-1之间的随机数；2、使用random函数和特定范围来生成随机整数；3、使用random函数和round函数生成0-99之间的随机整数；4、使用random函数和其他函数生成更复杂的随机数；5、使用random函数和其他函数生成范围内的随机小数；6、使用random函数和其他函数生成范围内的随机整数或小数。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">991</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.09.04</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/rhqyjavascrip" class="aClass flexRow hotzta" title="如何启用JavaScript"><img src="https://img.php.cn/upload/subject/202309/12/2023091210411962381.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="如何启用JavaScript" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/rhqyjavascrip" class="aClass flexRow hotztra overflowclass" title="如何启用JavaScript">如何启用JavaScript</a> <p class="aClass flexRow hotztrp overflowclass">JavaScript启用方法有内联脚本、内部脚本、外部脚本和异步加载。详细介绍：1、内联脚本是将JavaScript代码直接嵌入到HTML标签中；2、内部脚本是将JavaScript代码放置在HTML文件的`<script>`标签中；3、外部脚本是将JavaScript代码放置在一个独立的文件；4、外部脚本是将JavaScript代码放置在一个独立的文件。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">657</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.09.12</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/jssymbol" class="aClass flexRow hotzta" title="Js中Symbol类详解"><img src="https://img.php.cn/upload/subject/202309/20/2023092011360778721.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="Js中Symbol类详解" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/jssymbol" class="aClass flexRow hotztra overflowclass" title="Js中Symbol类详解">Js中Symbol类详解</a> <p class="aClass flexRow hotztrp overflowclass">javascript中的Symbol数据类型是一种基本数据类型，用于表示独一无二的值。Symbol的特点：1、独一无二，每个Symbol值都是唯一的，不会与其他任何值相等；2、不可变性，Symbol值一旦创建，就不能修改或者重新赋值；3、隐藏性，Symbol值不会被隐式转换为其他类型；4、无法枚举，Symbol值作为对象的属性名时，默认是不可枚举的。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">552</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2023.09.20</p> </div> </div> </div> </div> <div class="hotztlls flexRow"> <a target="_blank" href="/faq/gddtsjffhz" class="aClass flexRow hotzta" title="高德地图升级方法汇总"><img src="https://img.php.cn/upload/subject/202601/16/2026011616530741625.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="高德地图升级方法汇总" class="hotztaimg" onerror="this.src='/static/lhimages/moren/morentu.png'"></a> <div class="hotztright flexColumn"> <a target="_blank" href="/faq/gddtsjffhz" class="aClass flexRow hotztra overflowclass" title="高德地图升级方法汇总">高德地图升级方法汇总</a> <p class="aClass flexRow hotztrp overflowclass">本专题整合了高德地图升级相关教程，阅读专题下面的文章了解更多详细内容。</p> <div class="hotztrdown flexRow"> <div class="htztdsee flexRow"> <b></b> <p class="">43</p> </div> <div class="htztdTime flexRow"> <b></b> <p>2026.01.16</p> </div> </div> </div> </div> </div> </div> <div class="hotdownload "> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>热门下载</p> </div> <a target="_blank" class="rititle-more flexRow" href="/xiazai" title="热门下载"><span>更多</span><b></b></a> </div> <div class="hotdownTab"> <div class="hdTabs flexRow"> <div class="check" data-id="onef">网站特效 <b></b> </div> / <div class="" data-id="twof">网站源码 <b></b></div> / <div class="" data-id="threef">网站素材 <b></b></div> / <div class="" data-id="fourf">前端模板 <b></b></div> </div> <ul class="onef"> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="jQuery可悬停控制图片轮播代码" href="/xiazai/js/8504"><span>[图片特效]</span><span>jQuery可悬停控制图片轮播代码</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="HTML5棱形动态背景登录框代码" href="/xiazai/js/8503"><span>[表单按钮]</span><span>HTML5棱形动态背景登录框代码</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="LayerSlider带动画效果幻灯片" href="/xiazai/js/8502"><span>[图片特效]</span><span>LayerSlider带动画效果幻灯片</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="jQuery掩码文本输入框 jQuery掩码文本输入框网页特效" href="/xiazai/js/8501"><span>[表单按钮]</span><span>jQuery掩码文本输入框 jQuery掩码文本输入框网页特效</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="旋转木马切换特效slick" href="/xiazai/js/8500"><span>[图片特效]</span><span>旋转木马切换特效slick</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="创意的熊猫遮眼登录框代码" href="/xiazai/js/8499"><span>[表单按钮]</span><span>创意的熊猫遮眼登录框代码</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="js仿YOKA七日重头戏图片切换" href="/xiazai/js/8498"><span>[图片特效]</span><span>js仿YOKA七日重头戏图片切换</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="jQuery带步骤找回密码表单代码" href="/xiazai/js/8497"><span>[表单按钮]</span><span>jQuery带步骤找回密码表单代码</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="jQuery图片滑动切换 jQuery图片滑动切换代码下载" href="/xiazai/js/8496"><span>[图片特效]</span><span>jQuery图片滑动切换 jQuery图片滑动切换代码下载</span></a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" title="CSS3注册表单文本框占位符特效" href="/xiazai/js/8495"><span>[表单按钮]</span><span>CSS3注册表单文本框占位符特效</span></a> </div> </li> </ul> <ul class="twof" style="display:none;"> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11354" title="思翔企(事)业单位文件柜 build 20080313"><span>[其它模板]</span><span>思翔企(事)业单位文件柜 build 20080313</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11353" title="雅龙智能装备工业设备类WordPress主题1.0"><span>[企业站源码]</span><span>雅龙智能装备工业设备类WordPress主题1.0</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11352" title="威发卡自动发卡系统"><span>[电商源码]</span><span>威发卡自动发卡系统</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11351" title="卡密分发系统"><span>[电商源码]</span><span>卡密分发系统</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11350" title="中华陶瓷网"><span>[电商源码]</span><span>中华陶瓷网</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11349" title="简洁粉色食品公司网站"><span>[电商源码]</span><span>简洁粉色食品公司网站</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11348" title="极速网店系统"><span>[电商源码]</span><span>极速网店系统</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11347" title="淘宝妈妈_淘客推广系统"><span>[电商源码]</span><span>淘宝妈妈_淘客推广系统</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11346" title="积客B2SCMS商城系统"><span>[电商源码]</span><span>积客B2SCMS商城系统</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/11345" title="CODEC2I 众筹系统"><span>[电商源码]</span><span>CODEC2I 众筹系统</span> </a> </div> </li> </ul> <ul class="threef" style="display:none;"> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4208" title="2026新春纳福金葫芦矢量素材"><span>[网站素材]</span><span>2026新春纳福金葫芦矢量素材</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4207" title="手机特价宣传海报PSD素材下载"><span>[网站素材]</span><span>手机特价宣传海报PSD素材下载</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4206" title="游戏手柄特价折扣方形海报PSD下载"><span>[网站素材]</span><span>游戏手柄特价折扣方形海报PSD下载</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4205" title="新春喜庆灯笼梅花边框矢量素材"><span>[网站素材]</span><span>新春喜庆灯笼梅花边框矢量素材</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4204" title="周末美食折扣海报PSD设计源文件下载"><span>[网站素材]</span><span>周末美食折扣海报PSD设计源文件下载</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4203" title="手绘读书俱乐部海报矢量模板"><span>[网站素材]</span><span>手绘读书俱乐部海报矢量模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4202" title="商务名片展示样机PSD分层素材下载"><span>[网站素材]</span><span>商务名片展示样机PSD分层素材下载</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4201" title="扁平海边沙滩旅游风景矢量插画"><span>[网站素材]</span><span>扁平海边沙滩旅游风景矢量插画</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4200" title="超市购物特价产品宣传主图PSD素材下载"><span>[网站素材]</span><span>超市购物特价产品宣传主图PSD素材下载</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/sucai/4199" title="现代几何抽象飞鸟装饰矢量素材"><span>[网站素材]</span><span>现代几何抽象飞鸟装饰矢量素材</span> </a> </div> </li> </ul> <ul class="fourf" style="display:none;"> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8590" title="驾照考试驾校HTML5网站模板"><span>[前端模板]</span><span>驾照考试驾校HTML5网站模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8589" title="驾照培训服务机构宣传网站模板"><span>[前端模板]</span><span>驾照培训服务机构宣传网站模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8588" title="HTML5房地产公司宣传网站模板"><span>[前端模板]</span><span>HTML5房地产公司宣传网站模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8587" title="新鲜有机肉类宣传网站模板"><span>[前端模板]</span><span>新鲜有机肉类宣传网站模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8586" title="响应式天气预报宣传网站模板"><span>[前端模板]</span><span>响应式天气预报宣传网站模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8585" title="房屋建筑维修公司网站CSS模板"><span>[前端模板]</span><span>房屋建筑维修公司网站CSS模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8584" title="响应式志愿者服务网站模板"><span>[前端模板]</span><span>响应式志愿者服务网站模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8583" title="创意T恤打印店网站HTML5模板"><span>[前端模板]</span><span>创意T恤打印店网站HTML5模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8582" title="网页开发岗位简历作品展示网页模板"><span>[前端模板]</span><span>网页开发岗位简历作品展示网页模板</span> </a> </div> </li> <li> <div class="wzrfourli flexRow"> <b></b> <a target="_blank" href="/xiazai/code/8581" title="响应式人力资源机构宣传网站模板"><span>[前端模板]</span><span>响应式人力资源机构宣传网站模板</span> </a> </div> </li> </ul> </div> <script> $('.hdTabs>div').click(function (e) { $('.hdTabs>div').removeClass('check') $(this).addClass('check') $('.hotdownTab>ul').css('display', 'none') $('.' + e.currentTarget.dataset.id).show() }) </script> </div> <div class="artrig-adv "> <script type="text/javascript" src="https://teacher.php.cn/php/MDM3MTk1MGYxYjI5ODJmNTE0ZWVkZTA3NmJhYzhmMjI6Og=="></script> </div> <div class="xgarts "> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>相关下载</p> </div> <a target="_blank" class="rititle-more flexRow" href="/xiazai" title="相关下载"><span>更多</span><b></b></a> </div> <div class="xgwzlist "> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="php商城系统" href="/xiazai/code/11178">php商城系统</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="淘源码商城PHP淘宝查信誉" href="/xiazai/code/11177">淘源码商城PHP淘宝查信誉</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="PHP房产程序[BBWPS]" href="/xiazai/code/11165">PHP房产程序[BBWPS]</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="PHP简约自动发卡平台个人版" href="/xiazai/code/11128">PHP简约自动发卡平台个人版</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="ERMEB域名PHP离线网络授权系统" href="/xiazai/code/11040">ERMEB域名PHP离线网络授权系统</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="Difeye-敏捷的轻量级PHP框架" href="/xiazai/code/11037">Difeye-敏捷的轻量级PHP框架</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="大泉州汽车网PHP整站程序" href="/xiazai/code/10963">大泉州汽车网PHP整站程序</a></div> </div> </div> <div class="jpkc"> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>精品课程</p> </div> <a class="rititle-more flexRow" target="_blank" href="/course/sort_new.html" title="精品课程"><span>更多</span><b></b></a> </div> <div class=" jpkcTab"> <div class=" jpkcTabs flexRow"> <div class="check" data-id="onefd">相关推荐 <b></b> </div> / <div class="" data-id="twofd">热门推荐 <b></b></div> / <div class="" data-id="threefd">最新课程 <b></b></div> </div> <div class="onefd jpktabd"> <div class="ristyA flexRow " > <a target="_blank" href="/course/1683.html" title="Sass 教程"> <img src="https://img.php.cn/upload/course/000/000/090/689da3d823e1e854.png?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="Sass 教程" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1683.html" title="Sass 教程" class="rirightp overflowclass">Sass 教程</a> <div class="risrdown flexRow"> <p>共14课时 | 0.8万人学习</p> </div> </div> </div> <div class="ristyA flexRow " > <a target="_blank" href="/course/1673.html" title="Bootstrap 5教程"> <img src="https://img.php.cn/upload/course/000/000/090/6899a24dcdf73781.png?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="Bootstrap 5教程" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1673.html" title="Bootstrap 5教程" class="rirightp overflowclass">Bootstrap 5教程</a> <div class="risrdown flexRow"> <p>共46课时 | 2.9万人学习</p> </div> </div> </div> <div class="ristyA flexRow " > <a target="_blank" href="/course/1660.html" title="CSS教程"> <img src="https://img.php.cn/upload/course/000/000/090/68774990cfb6f919.jpg?x-oss-process=image/resize,m_mfit,h_75,w_120,limit_0" alt="CSS教程" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1660.html" title="CSS教程" class="rirightp overflowclass">CSS教程</a> <div class="risrdown flexRow"> <p>共754课时 | 20万人学习</p> </div> </div> </div> </div> <div class="twofd jpktabd" style="display:none;"> <div class="ristyA flexRow " > <a target="_blank" href="/course/1656.html" title="JavaScript ES5基础线上课程教学"> <img src="https://img.php.cn/upload/course/000/000/081/6862652adafef801.png?x-oss-process=image/resize,m_mfit,h_86,w_140,limit_0" alt="JavaScript ES5基础线上课程教学" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1656.html" title="JavaScript ES5基础线上课程教学" class="rirightp overflowclass">JavaScript ES5基础线上课程教学</a> <div class="risrdown flexRow"> <p>共6课时 | 7.5万人学习</p> </div> </div> </div> <div class="ristyA flexRow " > <a target="_blank" href="/course/812.html" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg?x-oss-process=image/resize,m_mfit,h_86,w_140,limit_0" alt="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/812.html" title="最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)" class="rirightp overflowclass">最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)</a> <div class="risrdown flexRow"> <p>共79课时 | 151.2万人学习</p> </div> </div> </div> <div class="ristyA flexRow " > <a target="_blank" href="/course/639.html" title="phpStudy极速入门视频教程"> <img src="https://img.php.cn/upload/course/000/000/068/62611ef88fcec821.jpg?x-oss-process=image/resize,m_mfit,h_86,w_140,limit_0" alt="phpStudy极速入门视频教程" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/639.html" title="phpStudy极速入门视频教程" class="rirightp overflowclass">phpStudy极速入门视频教程</a> <div class="risrdown flexRow"> <p>共6课时 | 53.4万人学习</p> </div> </div> </div> </div> <div class="threefd jpktabd" style="display:none;"> <div class="ristyA flexRow " > <a target="_blank" href="/course/1696.html" title="最新Python教程 从入门到精通"> <img src="https://img.php.cn/upload/course/000/000/081/68c135bb72783194.png?x-oss-process=image/resize,m_mfit,h_86,w_140,limit_0" alt="最新Python教程 从入门到精通" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1696.html" title="最新Python教程 从入门到精通" class="rirightp overflowclass">最新Python教程 从入门到精通</a> <div class="risrdown flexRow"> <p>共4课时 | 2.9万人学习</p> </div> </div> </div> <div class="ristyA flexRow " > <a target="_blank" href="/course/1656.html" title="JavaScript ES5基础线上课程教学"> <img src="https://img.php.cn/upload/course/000/000/081/6862652adafef801.png?x-oss-process=image/resize,m_mfit,h_86,w_140,limit_0" alt="JavaScript ES5基础线上课程教学" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1656.html" title="JavaScript ES5基础线上课程教学" class="rirightp overflowclass">JavaScript ES5基础线上课程教学</a> <div class="risrdown flexRow"> <p>共6课时 | 7.5万人学习</p> </div> </div> </div> <div class="ristyA flexRow " > <a target="_blank" href="/course/1655.html" title="PHP新手语法线上课程教学"> <img src="https://img.php.cn/upload/course/000/000/081/684a8c23d811b293.png?x-oss-process=image/resize,m_mfit,h_86,w_140,limit_0" alt="PHP新手语法线上课程教学" class="ristyAimg" onerror="this.src='/static/mobimages/moren/morentu.png'"> </a> <div class="ristyaRight flexColumn"> <a target="_blank" href="/course/1655.html" title="PHP新手语法线上课程教学" class="rirightp overflowclass">PHP新手语法线上课程教学</a> <div class="risrdown flexRow"> <p>共13课时 | 0.9万人学习</p> </div> </div> </div> </div> <script> $('.jpkcTabs>div').click(function (e) { $('.jpkcTabs>div').removeClass('check') $(this).addClass('check') $('.jpkcTab .jpktabd').css('display', 'none') $('.' + e.currentTarget.dataset.id).show() }) </script> </div> </div> <div class="zxarts "> <div class="rightdTitle flexRow"> <div class="title-left flexRow"> <b></b> <p>最新文章</p> </div> <a class="rititle-more flexRow" href="" title="最新文章" target="_blank"><span>更多</span><b></b></a> </div> <div class="xgwzlist "> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="轮播图怎么制作html翻转切换_做html轮播图翻转效果法【翻转】" href="/faq/1996095.html">轮播图怎么制作html翻转切换_做html轮播图翻转效果法【翻转】</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="HTML5的Canvas能做啥_HTML绘图局限在哪【示例】" href="/faq/1996085.html">HTML5的Canvas能做啥_HTML绘图局限在哪【示例】</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="如何在表单中可靠提交大量复选框的选中/未选中状态" href="/faq/1996069.html">如何在表单中可靠提交大量复选框的选中/未选中状态</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="如何在表单提交中准确捕获所有复选框的选中与未选中状态" href="/faq/1996059.html">如何在表单提交中准确捕获所有复选框的选中与未选中状态</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="BIRT报表中有序列表（OL）的start属性在PDF导出时失效的解决方案" href="/faq/1996036.html">BIRT报表中有序列表（OL）的start属性在PDF导出时失效的解决方案</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="如何在用户悬停选择项时触发事件" href="/faq/1995838.html">如何在用户悬停选择项时触发事件</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="如何在 React 中正确实现权限检查函数并返回布尔值" href="/faq/1995731.html">如何在 React 中正确实现权限检查函数并返回布尔值</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="CSS 绝对定位元素在相对定位父容器中偏移的根源与修复方案" href="/faq/1995481.html">CSS 绝对定位元素在相对定位父容器中偏移的根源与修复方案</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="html轮播图怎么绑定事件_给html轮播图加触发事件法【事件】" href="/faq/1995449.html">html轮播图怎么绑定事件_给html轮播图加触发事件法【事件】</a></div> <div class="xgwzlid flexRow"><b></b><a target="_blank" title="html5网站模板如何修改下拉菜单展开方向_html5改菜单方向攻略【贴士】" href="/faq/1995440.html">html5网站模板如何修改下拉菜单展开方向_html5改菜单方向攻略【贴士】</a></div> </div> </div> </div> </div> </div> <!--底部--> <div class="phpFoot"> <div class="phpFootIn"> <div class="phpFootCont"> <div class="phpFootLeft"> <dl> <dt> <a target="_blank" href="/about/us.html" rel="nofollow" title="关于我们" class="cBlack">关于我们</a> <a target="_blank" href="/about/disclaimer.html" rel="nofollow" title="免责申明" class="cBlack">免责申明</a> <a target="_blank" href="/about/jbzx.html" rel="nofollow" title="举报中心" class="cBlack">举报中心</a> <a href="javascript:;" rel="nofollow" onclick="advice_data(99999999,'意见反馈')" title="意见反馈" class="cBlack">意见反馈</a> <a target="_blank" href="https://www.php.cn/teacher.html" rel="nofollow" title="讲师合作" class="cBlack">讲师合作</a> <a target="_blank" href="https://www.php.cn/blog/detail/20304.html" rel="nofollow" title="广告合作" class="cBlack">广告合作</a> <a target="_blank" href="/new/" title="最新文章列表" class="cBlack">最新更新</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" 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> </div> </div> <div class="phpFootCode"> <div class="phpFootCodeIn"><p>Copyright 2014-2026 <a href="https://www.php.cn/" >https://www.php.cn/</a> All Rights Reserved | php.cn | <a href="https://beian.miit.gov.cn/" rel="nofollow" >湘ICP备2023035733号</a></p><a href="http://www.beian.gov.cn/portal/index.do" rel="nofollow" ><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> <script src="/static/js/cdn.js?v=1.0.1"></script> <!--底部 end--> <!-- content --> <!-- <div class="phpFudong"> <div class="phpFudongIn"> <div class="phpFudongImg"></div> <div class="phpFudongXue">登录PHP中文网，和优秀的人一起学习！</div> <div class="phpFudongQuan">全站<span>2000+</span>教程免费学</div> <div class="phpFudongCode"><a href="javascript:;" id="login" title="微信扫码登录">微信扫码登录</a></div> <div class="phpGuanbi" onclick="$('.phpFudong').hide();"></div> <div class="clear"></div> </div> </div> --> <!--底部浮动层 end--> <!--侧导航--> <style> .layui-fixbar{display: none;} </style> <div class="phpSdhBox" style="height:240px !important;"> <li> <div class="phpSdhIn"> <div class="phpSdhTitle"> <a href="/k24.html" 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" > <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> </body> </html> <script type="text/javascript" src="/hitsUp?type=article&id=1439860&time=1768691089"> </script> <script src="/static/ueditor/third-party/SyntaxHighlighter/shCore.js?1768691089"></script> <script> article_status = "1522179"; </script> <input type="hidden" id="verifycode" value="/captcha.html"> <script type="text/javascript" src="/static/js/global.min.js?5.5.33"></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/jquery.cookie.js"></script> <script>var _hmt = _hmt || [];(function(){var hm = document.createElement("script");hm.src="//hm.baidu.com/hm.js?c0e685c8743351838d2a7db1c49abd56";var s=document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm, s);})();(function(){var bp = document.createElement('script');var curProtocol = window.location.protocol.split(':')[0];if(curProtocol === 'https'){bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';}else{bp.src = 'http://push.zhanzhang.baidu.com/push.js';};var s = document.getElementsByTagName("script")[0];s.parentNode.insertBefore(bp, s);})();</script> <script> function setCookie(name, value, iDay) { //name相当于键，value相当于值，iDay为要设置的过期时间（天） var oDate = new Date(); oDate.setDate(oDate.getDate() + iDay); document.cookie = name + '=' + value + ';path=/;domain=.php.cn;expires=' + oDate; } function getCookie(name) { var cookieArr = document.cookie.split(";"); for (var i = 0; i < cookieArr.length; i++) { var cookiePair = cookieArr[i].split("="); if (name == cookiePair[0].trim()) { return decodeURIComponent(cookiePair[1]); } } return null; } </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', '7']); 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 --> <script> setCookie('is_article', 1, 1); </script> <script> var is_login = "0"; var show = 0; var ceng = getCookie('ceng'); //未登录复制显示登录按钮 if(is_login == 0 && false){ $(".code").hover(function(){ $(this).find('.contentsignin').show(); },function(){ $(this).find('.contentsignin').hide(); }); //不给复制 $('.code').bind("cut copy paste",function(e) { e.preventDefault(); }); $('.code .contentsignin').click(function(){ $(document).trigger("api.loginpopbox"); }) }else{ // 获取所有的 <pre> 元素 var preElements = document.querySelectorAll('pre'); preElements.forEach(function(preElement) { // 创建复制按钮 var copyButton = document.createElement('button'); copyButton.className = 'copy-button'; copyButton.textContent = '复制'; // 添加点击事件处理程序 copyButton.addEventListener('click', function() { // 获取当前按钮所属的 <pre> 元素中的文本内容 var textContent = preElement.textContent.trim(); // 创建一个临时 textarea 元素并设置其值为 <pre> 中的文本内容 var tempTextarea = document.createElement('textarea'); tempTextarea.value = textContent; // 将临时 textarea 添加到文档中 document.body.appendChild(tempTextarea); // 选中临时 textarea 中的文本内容并执行复制操作 tempTextarea.select(); document.execCommand('copy'); // 移除临时 textarea 元素 document.body.removeChild(tempTextarea); // 更新按钮文本为 "已复制" this.textContent = '已复制'; }); // 创建AI写代码按钮 var aiButton = document.createElement('button'); aiButton.className = 'copy-button'; aiButton.textContent = 'AI写代码'; aiButton.style.marginLeft = '5px'; aiButton.style.marginRight = '5px'; // 添加点击事件处理程序 aiButton.addEventListener('click', function() { // Generate a random number between 0 and 1 var randomChance = Math.random(); // If the random number is less than 0.5, open the first URL, else open the second if (randomChance < 0.5) { window.open('https://www.doubao.com/chat/coding?channel=php&source=hw_db_php', '_blank'); } else { window.open('https://click.aliyun.com/m/1000402709/', '_blank'); } }); // 将按钮添加到 <pre> 元素前面 preElement.parentNode.insertBefore(copyButton, preElement); preElement.parentNode.insertBefore(aiButton, preElement); }); } </script>