什么是HTML元素？常见的HTML标签有哪些？ 程序猿 • 2025年12月22日 13:40:10 • 用户投稿 html标签是用于标记元素的符号，如 、 等，分为开始标签和结束标签，而html元素是由开始标签、内容和结束标签组成的完整结构单元，如 这是一段文字。 即为一个段落元素；2. 某些元素为空元素，如，仅有开始标签，通过属性携带信息，无需结束标签；3. HTML元素在网页中承担语义化、布局基础、可访问性和内容层级组织的作用，语义化标签如 、 、ain>等提升了代码可读性、SEO和无障碍访问；4. 正确使用HTML元素需坚持语义化原则，减少 滥用，合理使用标题层级，优化图片alt属性和懒加载，提供媒体controls，增强表单label关联，并避免过度嵌套，以提升页面性能与可访问性。 HTML元素是构成网页内容的基本单位，而HTML标签则是用来标记这些元素的符号。理解它们是构建任何网页的基石。常见的HTML标签非常多，比如用于段落的 ，标题的 到 ，链接的 ，以及插入图片的 @@##@@ 等。 HTML元素可以被看作是网页内容的“积木”。一个完整的HTML元素通常由一个开始标签、一些内容以及一个结束标签组成。比如， 这是一段文字。 ，其中 是开始标签， 立即学习“前端免费学习笔记（深入）”； 是结束标签，“这是一段文字。”是内容，整个结构就是一个 p （段落）元素。有些元素是“空元素”，它们没有内容，也就不需要结束标签，例如 @@##@@ ，它只有开始标签，但仍然是一个完整的 img 元素，因为它通过属性（ src 和 alt ）携带了所有必要的信息。 在实际开发中，我们使用的HTML标签种类繁多，它们各自承担着不同的职责： 结构性标签: 像 定义了整个文档， 包含了元数据， 则承载了所有可见内容。 和 是通用的容器，前者是块级元素，后者是行内元素，它们常用于布局和样式化，但应尽量配合语义化标签使用。 文本内容标签: 到 用于不同层级的标题， 用于段落， 表示重要文本， 表示强调， 用于换行， 用于水平线。 链接与图像标签: 用于创建超链接， @@##@@ 用于嵌入图片。 列表标签: 用于无序列表， 用于有序列表， 是列表项。还有 、 、 用于定义列表。 表单标签: 用于创建表单， 用于各种输入控件（文本框、按钮、复选框等）， </pre> <div class="contentsignin"></div> </div> <p>用于多行文本输入，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><button></pre> <div class="contentsignin"></div> </div> <p>用于按钮，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>用于下拉菜单，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><label></pre> <div class="contentsignin"></div> </div> <p>用于关联表单控件。</p> <li><strong>媒体标签:</strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><audio></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><video></pre> <div class="contentsignin"></div> </div> <p>分别用于嵌入音频和视频内容，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>用于指定媒体源。</p> <li><strong>语义化标签 (HTML5新增):</strong> 这些标签的出现极大地提升了网页的可读性和可维护性，也对搜索引擎优化</a>和无障碍访问有巨大帮助。例如 <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><header></pre> <div class="contentsignin"></div> </div> <p>（页眉），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><nav></pre> <div class="contentsignin"></div> </div> <p>（导航），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><main></pre> <div class="contentsignin"></div> </div> <p>（页面主要内容），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><article></pre> <div class="contentsignin"></div> </div> <p>（独立文章内容），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><section></pre> <div class="contentsignin"></div> </div> <p>（文档中的独立区块），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><aside></pre> <div class="contentsignin"></div> </div> <p>（侧边栏内容），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><footer></pre> <div class="contentsignin"></div> </div> <p>（页脚），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><figure></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><figcaption></pre> <div class="contentsignin"></div> </div> <p>（图片或代码块及其标题），</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><time></pre> <div class="contentsignin"></div> </div> <p>（时间）。</p> <h3>HTML元素与标签有何区别</a>？</h3> <p>在前端开发里，”HTML标签”和”HTML元素”这两个词经常被混用，但这其实是个小小的误区，它们代表着不同的概念。我个人觉得，理解这个<span class="wpcom_tag_link"><a href="https://www.chuangxiangniao.com/p/tag/qubie" title="区别" target="_blank">区别</a></span>就像理解一个乐谱上的音符和整个乐句的关系。标签是那些用来标记内容的“音符符号”，而元素则是那些被演奏出来的、有意义的“旋律片段”，包含了符号本身、它们所包裹的内容以及所有附加的属性。</p> <p>具体来说，<strong>HTML标签</strong>指的是尖括号</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>包围起来的关键词，比如</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><p></pre><div class="contentsignin"></div></div><p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">@@##@@</pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></a></pre> <div class="contentsignin"></div> </div> <p>。它们是语法上的标记，用于指示浏览器</a>如何解析和渲染内容。我们通常会遇到开始标签（如</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><p></pre><div class="contentsignin"></div></div><p>）和结束标签（如</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></p></pre> <div class="contentsignin"></div> </div> <p>）。而像</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">@@##@@</pre> <div class="contentsignin"></div> </div> <p>这样的空元素，它只有开始标签，没有对应的结束标签。</p> <p><strong>HTML元素</strong>则是一个更宽泛的概念，它代表着从开始标签到结束标签之间的所有内容，包括开始标签本身、所有的属性、标签之间的文本内容，以及嵌套在其中的其他元素。例如，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h1>我的标题</h1></pre> <div class="contentsignin"></div> </div> <p>中，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h1></pre> <div class="contentsignin"></div> </div> <p>是开始标签，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></h1></pre> <div class="contentsignin"></div> </div> <p>是结束标签，“我的标题”是内容，整个结构就是一个</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">h1</pre> <div class="contentsignin"></div> </div> <p>元素。再比如，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><a href="https://example.com">访问示例网站</a></pre> <div class="contentsignin"></div> </div> <p>，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><a href="https://example.com"></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></a></pre> <div class="contentsignin"></div> </div> <p>是标签，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">href</pre> <div class="contentsignin"></div> </div> <p>是</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">a</pre> <div class="contentsignin"></div> </div> <p>元素的属性，“访问示例网站”是内容，整个就是一个</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">a</pre> <div class="contentsignin"></div> </div> <p>元素。简单来说，元素是标签所定义的一个完整、有意义的结构单元。</p> <h3>HTML元素在网页结构中扮演什么角色？</h3> <p>HTML元素在网页结构中扮演的角色，远不止是简单地显示文字和图片那么简单。在我看来，写HTML就像搭乐高。每一块砖（元素）都有它的形状和颜色，关键在于你如何组合它们，让最终的结构既稳固又富有意义。如果只用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">div</pre> <div class="contentsignin"></div> </div> <p>，那就像用一堆灰色方块搭房子，虽然能搭起来，但谁知道哪里是门哪里是窗呢？</p> <p>核心来说，HTML元素主要在以下几个方面构建网页的“骨架”：</p> <ol> <li> <p><strong>语义化:</strong> 这是HTML5时代一个非常重要的概念。过去我们可能大量使用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><div></pre> <div class="contentsignin"></div> </div> <p>来构建页面布局，然后通过CSS来赋予它们样式和意义。但现在，有了</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><header></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><nav></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><main></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><article></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><section></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><footer></pre> <div class="contentsignin"></div> </div> <p>等语义化标签，我们就可以更清晰地告诉<span class="wpcom_tag_link"><a href="https://www.chuangxiangniao.com/p/tag/liulanqi" title="浏览器" target="_blank">浏览器</a></span>、搜索引擎和辅助技术（如屏幕阅读器）每个区块内容的实际含义。例如，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">nav</pre> <div class="contentsignin"></div> </div> <p>元素明确表示这是一段导航链接，而不是一个普通的</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">div</pre> <div class="contentsignin"></div> </div> <p>。这种语义上的清晰性对于<span class="wpcom_tag_link"><a href="https://www.chuangxiangniao.com/p/tag/sousuoyinqingyouhua" title="搜索引擎优化" target="_blank">搜索引擎优化</a></span>（SEO）和提升网页的可访问性至关重要。</p> <li> <p><strong>文档流与布局:</strong> 每个HTML元素都有其默认的显示类型，比如块级元素（</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">display: block;</pre> <div class="contentsignin"></div> </div> <p>，如</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">p</pre> <div class="contentsignin"></div> </div> <p>, </p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">div</pre> <div class="contentsignin"></div> </div> <p>, </p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">h1</pre> <div class="contentsignin"></div> </div> <p>）会独占一行，而行内元素（</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">display: inline;</pre> <div class="contentsignin"></div> </div> <p>，如</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">span</pre> <div class="contentsignin"></div> </div> <p>, </p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">a</pre> <div class="contentsignin"></div> </div> <p>, </p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">img</pre> <div class="contentsignin"></div> </div> <p>）则会与相邻内容在同一行显示。这种默认行为构成了网页的“文档流”，决定了元素在页面上的排列</a>顺序和占据的空间。虽然我们最终会用CSS来精细控制布局，但HTML元素的天然属性是布局的基础。</p> <li> <p><strong>可访问性（Accessibility）:</strong> 正确使用HTML元素是构建无障碍网页的关键。屏幕阅读器等辅助技术会解析HTML结构来理解页面内容，并将其传达给视障用户。例如，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">@@##@@</pre> <div class="contentsignin"></div> </div> <p>标签的</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">alt</pre> <div class="contentsignin"></div> </div> <p>属性提供了图片的文字描述，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><label></pre> <div class="contentsignin"></div> </div> <p>标签与</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>元素关联可以帮助用户更好地理解表单字段。语义化标签也让屏幕阅读器能够更有效地导航页面，比如直接跳到</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">main</pre> <div class="contentsignin"></div> </div> <p>内容区或</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">nav</pre> <div class="contentsignin"></div> </div> <p>导航区。</p> <li> <p><strong>内容组织与层级:</strong> 通过</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h1></pre> <div class="contentsignin"></div> </div> <p>到</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h6></pre> <div class="contentsignin"></div> </div> <p>定义标题层级，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><ol></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><ul></pre> <div class="contentsignin"></div> </div> <p>组织列表，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><table></pre> <div class="contentsignin"></div> </div> <p>组织表格数据，HTML元素自然地构建了内容的层级结构。这种结构不仅让内容在视觉上更易读，也帮助搜索引擎理解页面的主题和重点。</p> <h3>如何正确使用HTML元素以优化页面性能和可访问性？</h3> <p>在我看来，性能和可访问性不是什么高深莫测的魔法，更多的是一种习惯和责任。你写的每一行HTML，都可能影响到用户能否顺畅地访问你的内容，甚至决定了你的网站在搜索引擎眼中的“地位”。这就像盖房子，地基打得好，房子才结实，而且要考虑到所有住户的需求，包括那些行动不便的。</p> <p>要正确使用HTML元素来优化页面性能和可访问性，我们可以从几个方面入手：</p> <ol> <li> <p><strong>坚持语义化HTML:</strong></p> <ul> <li><strong>减少 <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">div</pre> <div class="contentsignin"></div> </div> <p>滥用:</strong> 尽可能使用HTML5引入的语义化标签，如</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><header></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><nav></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><main></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><article></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><section></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><aside></pre> <div class="contentsignin"></div> </div> <p>、</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><footer></pre> <div class="contentsignin"></div> </div> <p>等，而不是一味地使用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><div></pre> <div class="contentsignin"></div> </div> <p>。这不仅让代码更清晰易懂，也为搜索引擎和辅助技术提供了更丰富的上下文信息。</p> <li><strong>正确使用标题标签:</strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h1></pre> <div class="contentsignin"></div> </div> <p>到</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h6></pre> <div class="contentsignin"></div> </div> <p>应该按照内容的逻辑层级来使用，而不是仅仅为了改变字体大小。一个页面通常只有一个</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><h1></pre> <div class="contentsignin"></div> </div> <p>，代表页面最主要的主题。</p> <li> <p><strong>优化图片和媒体元素:</strong></p> <ul> <li><strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">alt</pre> <div class="contentsignin"></div> </div> <p>属性必不可少:</strong> </p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">@@##@@</pre> <div class="contentsignin"></div> </div> <p>标签的</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">alt</pre> <div class="contentsignin"></div> </div> <p>属性是提升可访问性的基石。它为图片提供了替代文本，当图片无法加载或用户使用屏幕阅读器时，这段文本能描述图片内容。对于装饰性图片，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">alt=""</pre> <div class="contentsignin"></div> </div> <p>（空字符串）可以告诉屏幕阅读器忽略它。</p> <li><strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">loading="lazy"</pre> <div class="contentsignin"></div> </div> <p>:</strong> 对于非首屏的图片和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>，使用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">loading="lazy"</pre> <div class="contentsignin"></div> </div> <p>属性可以延迟加载</a>这些资源，直到它们进入视口附近，从而显著提高页面首次加载速度。</p> <li><strong>响应式图片:</strong> 使用 <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"></pre> <div class="contentsignin"></div> </div> <p>元素和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">@@##@@</pre> <div class="contentsignin"></div> </div> <p>标签的</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">srcset</pre> <div class="contentsignin"></div> </div> <p>属性，可以根据用户的设备屏幕大小和分辨率提供不同尺寸或格式的图片，减少不必要的带宽消耗。</p> <li><strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">controls</pre> <div class="contentsignin"></div> </div> <p>属性:</strong> </p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><video></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><audio></pre> <div class="contentsignin"></div> </div> <p>标签应包含</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">controls</pre> <div class="contentsignin"></div> </div> <p>属性，为用户提供播放、暂停、音量控制等标准媒体播放器控件，提升用户体验和可访问性。</p> <li> <p><strong>增强表单可访问性:</strong></p> <ul> <li><strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">label</pre> <div class="contentsignin"></div> </div> <p>与</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">input</pre> <div class="contentsignin"></div> </div> <p>关联:</strong> 始终使用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><label></pre> <div class="contentsignin"></div> </div> <p>标签来关联表单控件，并通过</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">for</pre> <div class="contentsignin"></div> </div> <p>属性与</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">input</pre> <div class="contentsignin"></div> </div> <p>的</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">id</pre> <div class="contentsignin"></div> </div> <p>匹配。这样，点击标签文本就能激活对应的输入框，对鼠标用户和使用屏幕阅读器的用户都非常友好。</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class='brush:html;toolbar:false;'><label for="username">用户名:</label></pre> <div class="contentsignin"></div> </div> <li><strong>提供反馈信息:</strong> 使用 <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><fieldset></pre> <div class="contentsignin"></div> </div> <p>和</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><legend></pre> <div class="contentsignin"></div> </div> <p>来组织相关的表单控件组，使用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><p></pre><div class="contentsignin"></div></div><p>或</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><span></pre> <div class="contentsignin"></div> </div> <p>提供错误信息，并确保这些信息是可访问的。</p> <li> <p><strong>注意链接和按钮的语义:</strong></p> <ul> <li><strong> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><a></pre> <div class="contentsignin"></div> </div> <p>用于导航，</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><button></pre> <div class="contentsignin"></div> </div> <p>用于操作:</strong> 如果是跳转到另一个页面或资源，用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><a></pre> <div class="contentsignin"></div> </div> <p>标签。如果是触发某个JavaScript函数或提交表单，用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;"><button></pre> <div class="contentsignin"></div> </div> <p>标签。避免滥用</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">div</pre> <div class="contentsignin"></div> </div> <p>或</p> <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">span</pre> <div class="contentsignin"></div> </div> <p>模拟按钮或链接，因为它们缺乏原生的键盘交互和语义。</p> <li> <p><strong>减少不必要的嵌套和DOM深度:</strong></p> <ul> <li>虽然现代浏览器渲染能力很强，但过于深层的DOM结构（即元素嵌套层级过多）仍然可能对性能造成轻微影响，尤其是在进行CSS样式计算和JavaScript DOM操作时。尽量保持HTML结构扁平化，减少不必要的 <div class="code" style="position:relative;padding:0px;margin:0px"> <pre class="brush:php;toolbar:false;">div</pre> <div class="contentsignin"></div> </div> <p>嵌套。</p> <p>通过这些实践，我们不仅能构建出结构清晰、易于维护的网页，更能确保我们的内容能够被更广泛的用户群体所访问和理解，包括那些使用辅助技术的用户，这对于一个负责任的开发者来说，是极其重要的。</p> <p><img alt="什么是HTML元素？常见的HTML标签有哪些？"><img decoding="async" src="image.jpg" alt="描述"><img alt="什么是HTML元素？常见的HTML标签有哪些？"><img alt="什么是HTML元素？常见的HTML标签有哪些？"><img alt="什么是HTML元素？常见的HTML标签有哪些？"><img alt="什么是HTML元素？常见的HTML标签有哪些？"><img alt="什么是HTML元素？常见的HTML标签有哪些？"><img alt="什么是HTML元素？常见的HTML标签有哪些？"></div></nav></header><p>以上就是什么是HTML元素？常见的HTML标签有哪些？的详细内容，更多请关注创想鸟其它相关文章！</p> <div class="entry-readmore"><div class="entry-readmore-btn"></div></div> <div class="entry-copyright"><p>版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。<br> 如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。<br> 发布者：程序猿，转转请注明出处：<span>https://www.chuangxiangniao.com/p/1571321.html</span></p></div> </div> <div class="entry-tag"><a href="https://www.chuangxiangniao.com/p/tag/access" rel="tag">access</a><a href="https://www.chuangxiangniao.com/p/tag/ai" rel="tag">ai</a><a href="https://www.chuangxiangniao.com/p/tag/css" rel="tag">css</a><a href="https://www.chuangxiangniao.com/p/tag/htmlyuansu" rel="tag">html元素</a><a href="https://www.chuangxiangniao.com/p/tag/htmlbiaoqian" rel="tag">html标签</a><a href="https://www.chuangxiangniao.com/p/tag/daimakeduxing" rel="tag">代码可读性</a><a href="https://www.chuangxiangniao.com/p/tag/qubie" rel="tag">区别</a><a href="https://www.chuangxiangniao.com/p/tag/yanchijiazai" rel="tag">延迟加载</a><a href="https://www.chuangxiangniao.com/p/tag/pailie" rel="tag">排列</a><a href="https://www.chuangxiangniao.com/p/tag/sousuoyinqingyouhua" rel="tag">搜索引擎优化</a><a href="https://www.chuangxiangniao.com/p/tag/liulanqi" rel="tag">浏览器</a></div> <div class="entry-action"> <div class="btn-zan" data-id="1571321"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up-fill"></use></svg></i> 赞 <span class="entry-action-num">(0)</span></div> <div class="btn-dashang"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-cny-circle-fill"></use></svg></i> 打赏 <span class="dashang-img dashang-img2"> <span> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/wx.jpg" alt="微信扫一扫"/> 微信扫一扫 </span> <span> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/zfb.jpg" alt="支付宝扫一扫"/> 支付宝扫一扫 </span> </span> </div> </div> <div class="entry-bar"> <div class="entry-bar-inner"> <div class="entry-bar-info entry-bar-info2"> <div class="info-item meta"> <a class="meta-item j-heart" href="javascript:;" data-id="1571321"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i> <span class="data">0</span></a> <a class="meta-item" href="#comments"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i> <span class="data">0</span></a> </div> <div class="info-item share"> <a class="meta-item mobile j-mobile-share" href="javascript:;" data-id="1571321" data-qrcode="https://www.chuangxiangniao.com/p/1571321.html"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-share"></use></svg></i> 生成海报 </a> <a class="meta-item wechat" data-share="wechat" target="_blank" rel="nofollow noopener noreferrer" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-wechat"></use></svg></i> </a> <a class="meta-item weibo" data-share="weibo" target="_blank" rel="nofollow noopener noreferrer" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-weibo"></use></svg></i> </a> <a class="meta-item qq" data-share="qq" target="_blank" rel="nofollow noopener noreferrer" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-qq"></use></svg></i> </a> <a class="meta-item qzone" data-share="qzone" target="_blank" rel="nofollow noopener noreferrer" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-qzone"></use></svg></i> </a> <a class="meta-item douban" data-share="douban" target="_blank" rel="nofollow noopener noreferrer" href="#"> <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-douban"></use></svg></i> </a> </div> <div class="info-item act"> <a href="javascript:;" id="j-reading"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-article"></use></svg></i></a> </div> </div> </div> </div> </div> <div class="entry-author"> <h3 class="entry-author-title">关于作者</h3> <div class="entry-author-inner"> <div class="entry-author-avatar"> <a class="avatar j-user-card" href="https://www.chuangxiangniao.com/user/3" target="_blank" data-user="3"><img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-120 photo' height='120' width='120' decoding='async'/></a> </div> <div class="entry-author-content"> <div class="entry-author-info"> <h4 class="entry-author-name"> <a class="j-user-card" href="https://www.chuangxiangniao.com/user/3" target="_blank" data-user="3">程序猿<span class="user-group">签约作者</span></a> </h4> <div class="entry-author-action"> <button type="button" class="wpcom-btn btn-xs btn-follow j-follow btn-primary" data-user="3"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-add"></use></svg></i>关注</button><button type="button" class="wpcom-btn btn-primary btn-xs btn-message j-message" data-user="3"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-mail-fill"></use></svg></i>私信</button> </div> </div> <div class="entry-author-stats"> <div class="user-stats-item"> <b>413.8K</b> <span>文章</span> </div> <div class="user-stats-item"> <b>0</b> <span>评论</span> </div> <div class="user-stats-item"> <b>2</b> <span>粉丝</span> </div> </div> <div class="entry-author-description">这个人很懒，什么都没有留下～</div> </div> </div> </div> <div class="entry-page"> <div class="entry-page-prev"> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/12/175499652257441-480x300.png" alt="表单中的地图选择怎么实现？如何集成地图API？" decoding="async" loading="lazy"> <a href="https://www.chuangxiangniao.com/p/1571319.html" title="表单中的地图选择怎么实现？如何集成地图API？" rel="prev"> <span>表单中的地图选择怎么实现？如何集成地图API？</span> </a> <div class="entry-page-info"> <span class="pull-left"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-arrow-left-double"></use></svg></i> 上一篇</span> <span class="pull-right">2025年12月22日 13:40:01</span> </div> </div> <div class="entry-page-next"> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/12/175499580562168-480x300.jpg" alt="如何在 JavaScript 中选择动态创建并追加的元素？" decoding="async" loading="lazy"> <a href="https://www.chuangxiangniao.com/p/1571323.html" title="如何在 JavaScript 中选择动态创建并追加的元素？" rel="next"> <span>如何在 JavaScript 中选择动态创建并追加的元素？</span> </a> <div class="entry-page-info"> <span class="pull-right">下一篇 <i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-arrow-right-double"></use></svg></i></span> <span class="pull-left">2025年12月22日 13:40:17</span> </div> </div> </div> <div class="entry-related-posts"> <h3 class="entry-related-title">相关推荐</h3><ul class="entry-related cols-3 post-loop post-loop-default"><li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/175004.html" title="Node.js究竟是什么样的运行环境？" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174114289654206-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Node.js究竟是什么样的运行环境？" decoding="async" fetchpriority="high" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/175004.html" target="_blank" rel="bookmark"> Node.js究竟是什么样的运行环境？ </a> </h3> <div class="item-excerpt"> <p>深入剖析Node.js：JavaScript服务器端运行环境 本文旨在深入浅出地解释Node.js作为JavaScript服务器端运行环境的具体含义，帮助开发者更好地理解这一概念。许多人初学Node.js时，常常对“运行环境”感到困惑。我们将从软件和硬件层面，以及与“运行时”（runtime）的关系…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/175004.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item3"> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/175003.html" target="_blank" rel="bookmark"> 从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控 </a> </h3> <a class="item-images" href="https://www.chuangxiangniao.com/p/175003.html" title="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控" target="_blank"> <img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174013993870286.png" alt="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控" decoding="async" loading="lazy"><img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174013994087889.png" alt="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控" decoding="async" loading="lazy"><img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174013994287388.png" alt="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控" decoding="async" loading="lazy"><img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174013994441936.png" alt="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控" decoding="async" loading="lazy"> </a> <div class="item-excerpt"> <p>☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ 编辑 | 萝卜皮 增强子通过与转录因子 (TF) 相互作用，在各种生物过程中充当基因表达的关键调节器。虽然转录因子结合位点 (TFBS) 被广泛认为是 TF 结合和增强子活性的关键决定因素，但其…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <span class="item-meta-li dot">•</span> <a class="item-meta-li" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>8</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/175003.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/19921.html" title="蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/175438243156653-480x300.jpg" class="attachment-default size-default wp-post-image" alt="蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/19921.html" target="_blank" rel="bookmark"> 蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计 </a> </h3> <div class="item-excerpt"> <p>开通直播带货权限需满足粉丝量、信用等级和实名认证等资质要求，并通过官方后台申请；2. 商品库搭建要完善商品信息、库存管理并实现与供应商或第三方平台同步；3. 直播间装修应注重背景、灯光与互动元素，提升用户停留时长与购买意愿；4. 直播流程需包含预热、开场、商品讲解、互动、促销及结尾五个环节，系统化提…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>5</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/19921.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174981.html" title="解决Laravel项目中CSS文件无法加载的问题" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/170997552531337-480x300.jpg" class="attachment-default size-default wp-post-image" alt="解决Laravel项目中CSS文件无法加载的问题" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174981.html" target="_blank" rel="bookmark"> 解决Laravel项目中CSS文件无法加载的问题 </a> </h3> <div class="item-excerpt"> <p>解决Laravel项目中CSS文件无法加载的问题，需要具体代码示例 在开发Laravel项目的过程中，有时候会遇到CSS文件无法加载的问题，这可能会导致页面样式混乱或者无法正常显示页面内容。这个问题通常是由于文件路径配置或者缓存导致的，接下来我们将介绍几种常见的解决方法，并提供具体的代码示例。 一、…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174981.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174978.html" title="机构：2025年全球云服务支出预计增长19%" target="_blank" rel="bookmark"> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174014018862240.jpg" class="attachment-default size-default wp-post-image" alt="机构：2025年全球云服务支出预计增长19%" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174978.html" target="_blank" rel="bookmark"> 机构：2025年全球云服务支出预计增长19% </a> </h3> <div class="item-excerpt"> <p>☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ Canalys最新数据显示，2024年第四季度全球云基础设施服务支出达860亿美元，同比增长20%。全年支出也强劲增长，从2023年的2677亿美元增至3213亿美元，增幅达20%。 看好未来发…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174978.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/19913.html" title="12分钟充电跑800公里！韩企攻克锂金属电池寿命难关" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/175705794519660-480x300.jpg" class="attachment-default size-default wp-post-image" alt="12分钟充电跑800公里！韩企攻克锂金属电池寿命难关" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/19913.html" target="_blank" rel="bookmark"> 12分钟充电跑800公里！韩企攻克锂金属电池寿命难关 </a> </h3> <div class="item-excerpt"> <p>☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ 据智车派消息，韩国科研团队近日宣布在锂金属电池领域实现关键性突破，成功攻克其寿命短的技术难题。新技术有望实现电动车仅用12分钟充电即可行驶800公里的惊人表现。作为对比，国内最新发布的小鹏P7搭…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/19913.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item3"> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174947.html" target="_blank" rel="bookmark"> 慢思考助力医学大语言模型突破数据瓶颈：上海交大联合上海AI Lab推出MedS3系统 </a> </h3> <a class="item-images" href="https://www.chuangxiangniao.com/p/174947.html" title="慢思考助力医学大语言模型突破数据瓶颈：上海交大联合上海AI Lab推出MedS3系统" target="_blank"> <img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174015230513917.png" alt="慢思考助力医学大语言模型突破数据瓶颈：上海交大联合上海AI Lab推出MedS3系统" decoding="async" loading="lazy"><img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174015230890756.png" alt="慢思考助力医学大语言模型突破数据瓶颈：上海交大联合上海AI Lab推出MedS3系统" decoding="async" loading="lazy"><img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174015231052871.png" alt="慢思考助力医学大语言模型突破数据瓶颈：上海交大联合上海AI Lab推出MedS3系统" decoding="async" loading="lazy"><img class="item-images-el" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174015231281578.png" alt="慢思考助力医学大语言模型突破数据瓶颈：上海交大联合上海AI Lab推出MedS3系统" decoding="async" loading="lazy"> </a> <div class="item-excerpt"> <p>上海交通大学、复旦大学和上海人工智能实验室的研究团队推出新型医学推理系统meds3，该系统采用自我进化“慢思考”范式，无需预训练和模型蒸馏，即可实现细粒度推理流程验证。 ☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ MedS3克服了现有医疗…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <span class="item-meta-li dot">•</span> <a class="item-meta-li" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174947.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174945.html" title="如何用Flexbox和JavaScript实现父元素内子元素的两行排列及展开显示？" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174114567517284-480x300.jpg" class="attachment-default size-default wp-post-image" alt="如何用Flexbox和JavaScript实现父元素内子元素的两行排列及展开显示？" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174945.html" target="_blank" rel="bookmark"> 如何用Flexbox和JavaScript实现父元素内子元素的两行排列及展开显示？ </a> </h3> <div class="item-excerpt"> <p>如何利用Flexbox和JavaScript在一个父元素内实现子元素的两行排列，并支持点击展开显示全部内容？ 本文将演示如何使用Flexbox和JavaScript，在一个父容器中将多个子元素排列成两行，初始状态隐藏超出部分，点击按钮后显示所有内容并启用水平滚动条。 关键在于巧妙地结合CSS的Fle…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174945.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174934.html" title="b站视频怎么循环播放_B站视频单曲循环播放设置技巧" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175998564711398-480x300.jpg" class="attachment-default size-default wp-post-image" alt="b站视频怎么循环播放_B站视频单曲循环播放设置技巧" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174934.html" target="_blank" rel="bookmark"> b站视频怎么循环播放_B站视频单曲循环播放设置技巧 </a> </h3> <div class="item-excerpt"> <p>B站视频循环播放可通过三种方式实现：一是使用App内播放器的循环功能，点击进度条右侧循环图标即可；二是通过第三方播放器如VLC导入视频链接并开启循环模式；三是PC端利用浏览器扩展插件如Global Speed，启用Loop Video选项实现自动重播。 如果您希望在观看B站视频时实现循环播放，以便重…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>2</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174934.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/19912.html" title="最受好评iOS设备TOP10出炉：iPhone 16都排不进前5" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/175729677674974-480x300.jpg" class="attachment-default size-default wp-post-image" alt="最受好评iOS设备TOP10出炉：iPhone 16都排不进前5" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/19912.html" target="_blank" rel="bookmark"> 最受好评iOS设备TOP10出炉：iPhone 16都排不进前5 </a> </h3> <div class="item-excerpt"> <p>9月3日消息，安兔兔评测近日发布了2025年8月iOS设备用户好评榜TOP10，统计周期为8月1日至8月31日。 榜单结果令人意外，备受瞩目的iPhone 16在此次排名中位列第六，未能闯入前五。 本次榜单的冠军由iPad Air 4夺得，以高达96.88%的好评率高居榜首。该机型凭借卓越的屏幕素质…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>0</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/19912.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174904.html" title="如何解决Laravel无法加载CSS样式的情况" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/171003312448711-480x300.jpg" class="attachment-default size-default wp-post-image" alt="如何解决Laravel无法加载CSS样式的情况" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174904.html" target="_blank" rel="bookmark"> 如何解决Laravel无法加载CSS样式的情况 </a> </h3> <div class="item-excerpt"> <p>标题：如何解决Laravel无法加载CSS样式的情况 在使用Laravel进行Web开发的过程中，有时候会遇到CSS样式无法加载的情况，这可能会导致页面显示效果不正常。本文将介绍一些常见的原因以及解决方法，同时提供具体的代码示例供大家参考。 1. 检查CSS文件路径是否正确 首先要确保CSS文件路径…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>1</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174904.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174874.html" title="慧科讯业受邀出席2025华为开发者大会，携手加速企业AI算力创新实践" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175212881344947-480x300.jpg" class="attachment-default size-default wp-post-image" alt="慧科讯业受邀出席2025华为开发者大会，携手加速企业AI算力创新实践" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174874.html" target="_blank" rel="bookmark"> 慧科讯业受邀出席2025华为开发者大会，携手加速企业AI算力创新实践 </a> </h3> <div class="item-excerpt"> <p>2025年6月20日至22日，华为开发者大会（hdc2025）在东莞顺利召开。此次盛会吸引了来自世界各地的开发者、技术专家及行业领袖齐聚一堂，围绕harmonyos、盘古大模型、昇腾ai云服务等前沿技术成果展开深入交流。通过主题演讲、高峰对话、专题讨论以及圆桌会议等多种形式，与会嘉宾共同探讨科技未来…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>1</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174874.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174853.html" title="2024年全球存储销售收入创历史新高，三星领衔Q4 DRAM/NAND Flash排行榜" target="_blank" rel="bookmark"> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174018893557165.jpg" class="attachment-default size-default wp-post-image" alt="2024年全球存储销售收入创历史新高，三星领衔Q4 DRAM/NAND Flash排行榜" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174853.html" target="_blank" rel="bookmark"> 2024年全球存储销售收入创历史新高，三星领衔Q4 DRAM/NAND Flash排行榜 </a> </h3> <div class="item-excerpt"> <p>2024年全球存储芯片市场强劲增长，创下历史新高！得益于ai服务器的爆发式需求，全球dram和nand flash销售收入达到1670亿美元。 根据CFM闪存市场数据，2024年第四季度，全球NAND Flash市场规模虽环比下降8.5%至174.1亿美元，但DRAM市场规模却逆势增长13.5%，达…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>5</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174853.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174843.html" title="Java正则表达式如何精准提取中括号内外文本？" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174079681250083-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Java正则表达式如何精准提取中括号内外文本？" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174843.html" target="_blank" rel="bookmark"> Java正则表达式如何精准提取中括号内外文本？ </a> </h3> <div class="item-excerpt"> <p>Java字符串处理：巧妙提取中括号内外文本 在Java开发中，经常需要从字符串中提取特定部分。本文提供一种高效的方法，从包含中括号的字符串中，分别提取中括号之前和中括号内部的文本，即使中括号前文本长度不固定也能轻松应对。 例如，对于字符串 “test[10000]”，我们需要…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>6</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174843.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174840.html" title="Tailwind CSS hocus 变体失效：为什么按钮焦点状态下样式不生效？" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174121944432104-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Tailwind CSS hocus 变体失效：为什么按钮焦点状态下样式不生效？" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174840.html" target="_blank" rel="bookmark"> Tailwind CSS hocus 变体失效：为什么按钮焦点状态下样式不生效？ </a> </h3> <div class="item-excerpt"> <p>Tailwind CSS hocus 变体失效排查：焦点样式覆盖问题 使用 Tailwind CSS 时，变体（variants）用于控制样式在不同状态下的应用。然而，有时变体可能失效，例如 hocus 变体在按钮获得焦点时样式不生效。本文分析一个实际案例，解释 hocus 变体未能正确应用样式的原…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>2</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174840.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174829.html" title="聊聊flink Table的Group Windows" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175772581410139-480x300.jpg" class="attachment-default size-default wp-post-image" alt="聊聊flink Table的Group Windows" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174829.html" target="_blank" rel="bookmark"> 聊聊flink Table的Group Windows </a> </h3> <div class="item-excerpt"> <p>本文旨在探讨flink table的group windows。 Table table = input .window([Window w].as(“w”)) // 定义窗口并为其赋予别名 w .groupBy(“w”) // 按窗口 w 分组表 .select(“b.sum”); // 聚合Ta…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>1</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174829.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174818.html" title="【IPO价值观】恒坤新材“押宝”大客户 产能利用率低仍“豪赌”扩产" target="_blank" rel="bookmark"> <img src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174018909721356.jpg" class="attachment-default size-default wp-post-image" alt="【IPO价值观】恒坤新材“押宝”大客户 产能利用率低仍“豪赌”扩产" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174818.html" target="_blank" rel="bookmark"> 【IPO价值观】恒坤新材“押宝”大客户 产能利用率低仍“豪赌”扩产 </a> </h3> <div class="item-excerpt"> <p>☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ 国产替代浪潮推动恒坤新材业绩快速增长，然而，其营收高度依赖少数大客户的隐忧不容忽视。前五大客户贡献了97%以上的收入，第一大客户占比更是超过六成。这种高度集中的客户结构虽然带来了稳定的收入，但也…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>1</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174818.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2 item-no-thumb"> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174809.html" target="_blank" rel="bookmark"> 如何使用Composer解决WordPress本地开发环境的搭建问题？wp-cli/server-command助你一臂之力 </a> </h3> <div class="item-excerpt"> <p>可以通过一下地址学习composer：学习地址 在 wordpress 开发过程中，搭建一个本地开发环境是必不可少的步骤。然而，配置一个高效且易用的本地服务器常常会遇到各种问题，比如无法处理 .htaccess 文件或者配置复杂。最近，我在尝试搭建一个 wordpress 本地开发环境时，遇到了这些…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <a class="item-meta-li category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>1</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174809.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174789.html" title="Elasticsearch数组内时间范围筛选：如何高效查找change_records数组中指定时间范围内元素个数达到N的文档？" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174079681673592-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Elasticsearch数组内时间范围筛选：如何高效查找change_records数组中指定时间范围内元素个数达到N的文档？" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/174789.html" target="_blank" rel="bookmark"> Elasticsearch数组内时间范围筛选：如何高效查找change_records数组中指定时间范围内元素个数达到N的文档？ </a> </h3> <div class="item-excerpt"> <p>高效筛选elasticsearch数组内时间范围数据 本文介绍如何高效地从Elasticsearch文档中筛选出change_records数组内，change_time字段值位于特定时间范围且元素个数达到指定数量的文档。 我们面临的挑战是如何在不引发no field found错误的情况下，对数组…</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>3</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/174789.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> <li class="item item2"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/19906.html" title="如何在Java中使用LinkedHashSet" target="_blank" rel="bookmark"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/176019246257570-480x300.jpg" class="attachment-default size-default wp-post-image" alt="如何在Java中使用LinkedHashSet" decoding="async" loading="lazy" /> </a> <a class="item-category" href="https://www.chuangxiangniao.com/page" target="_blank">用户投稿</a> </div> <div class="item-content"> <h3 class="item-title"> <a href="https://www.chuangxiangniao.com/p/19906.html" target="_blank" rel="bookmark"> 如何在Java中使用LinkedHashSet </a> </h3> <div class="item-excerpt"> <p>LinkedHashSet继承HashSet并保持插入顺序，适用于去重且需顺序的场景。1. 创建时可指定初始容量；2. add()添加元素，自动去重；3. 遍历时按插入顺序输出；4. 支持remove()、contains()等操作；5. 常用于关键词去重、缓存等。注意：允许null、非线程安全。 …</p> </div> <div class="item-meta"> <div class="item-meta-li author"> <a data-user="3" target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar j-user-card"> <img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-60 photo' height='60' width='60' loading='lazy' decoding='async'/> <span>程序猿</span> </a> </div> <span class="item-meta-li date">2026年8月31日</span> <div class="item-meta-right"> <span class="item-meta-li views" title="阅读数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-eye"></use></svg></i>2</span><a class="item-meta-li comments" href="https://www.chuangxiangniao.com/p/19906.html#comments" target="_blank" title="评论数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-comment"></use></svg></i>0</a><span class="item-meta-li stars" title="收藏数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-star"></use></svg></i>0</span><span class="item-meta-li likes" title="点赞数"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-thumb-up"></use></svg></i>0</span> </div> </div> </div> </li> </ul> </div> <div id="comments" class="entry-comments"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">发表回复 <small><a rel="nofollow" id="cancel-comment-reply-link" href="/p/1571321.html#respond" style="display:none;"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-close"></use></svg></i></a></small></h3><div class="comment-form"><div class="comment-must-login">请登录后评论...</div><div class="form-submit"><div class="form-submit-text pull-left"><a href="https://www.chuangxiangniao.com/login?modal-type=login">登录</a>后才能评论</div> <button name="submit" type="submit" id="must-submit" class="wpcom-btn btn-primary btn-xs submit">提交</button></div></div> </div><!-- #respond --> </div><!-- .comments-area --> </article> </main> <aside class="sidebar"> <div class="widget widget_profile"><div class="profile-cover"><img src="//bing.img.run/rand_uhd.php" alt="程序猿" decoding="async" loading="lazy"></div> <div class="avatar-wrap"> <a target="_blank" href="https://www.chuangxiangniao.com/user/3" class="avatar-link"><img alt='程序猿的头像' src='//www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg' class='avatar avatar-120 photo' height='120' width='120' loading='lazy' decoding='async'/></a></div> <div class="profile-info"> <a target="_blank" href="https://www.chuangxiangniao.com/user/3" class="profile-name"><span class="author-name">程序猿</span><span class="user-group">签约作者</span></a> <p class="author-description">这个人很懒，什么都没有留下～</p> <div class="profile-stats"> <div class="profile-stats-inner"> <div class="user-stats-item"> <b>413.8K</b> <span>文章</span> </div> <div class="user-stats-item"> <b>0</b> <span>评论</span> </div> <div class="user-stats-item"> <b>2</b> <span>粉丝</span> </div> </div> </div> <button type="button" class="wpcom-btn btn-xs btn-follow j-follow btn-primary" data-user="3"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-add"></use></svg></i>关注</button><button type="button" class="wpcom-btn btn-primary btn-xs btn-message j-message" data-user="3"><i class="wpcom-icon wi"><svg aria-hidden="true"><use xlink:href="#wi-mail-fill"></use></svg></i>私信</button> </div> <div class="profile-posts"> <h3 class="widget-title"><span>最近文章</span></h3> <ul> <li><a href="https://www.chuangxiangniao.com/p/175007.html" title="Win7c盘变红满了怎么清理？Win7手动c盘深度瘦身教程">Win7c盘变红满了怎么清理？Win7手动c盘深度瘦身教程</a></li> <li><a href="https://www.chuangxiangniao.com/p/175004.html" title="Node.js究竟是什么样的运行环境？">Node.js究竟是什么样的运行环境？</a></li> <li><a href="https://www.chuangxiangniao.com/p/175003.html" title="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控">从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控</a></li> <li><a href="https://www.chuangxiangniao.com/p/19921.html" title="蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计">蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计</a></li> <li><a href="https://www.chuangxiangniao.com/p/174996.html" title="美图秀秀的模板功能怎么套用_美图秀秀模板套用教程">美图秀秀的模板功能怎么套用_美图秀秀模板套用教程</a></li> </ul> </div> </div><div class="widget widget_post_thumb"><h3 class="widget-title"><span>最新发布</span></h3> <ul> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/175007.html" title="Win7c盘变红满了怎么清理？Win7手动c盘深度瘦身教程"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175522514198073-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Win7c盘变红满了怎么清理？Win7手动c盘深度瘦身教程" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/175007.html" title="Win7c盘变红满了怎么清理？Win7手动c盘深度瘦身教程">Win7c盘变红满了怎么清理？Win7手动c盘深度瘦身教程</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/175004.html" title="Node.js究竟是什么样的运行环境？"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174114289654206-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Node.js究竟是什么样的运行环境？" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/175004.html" title="Node.js究竟是什么样的运行环境？">Node.js究竟是什么样的运行环境？</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/175003.html" title="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/174013993870286-480x300.png" class="attachment-default size-default wp-post-image" alt="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/175003.html" title="从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控">从概念到应用，清华团队开发DeepTFBU工具包助力基因表达精准调控</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/19921.html" title="蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/175438243156653-480x300.jpg" class="attachment-default size-default wp-post-image" alt="蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/19921.html" title="蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计">蝴蝶号如何设置直播带货 蝴蝶号电商转化的流程设计</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174996.html" title="美图秀秀的模板功能怎么套用_美图秀秀模板套用教程"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175998492827131-480x300.png" class="attachment-default size-default wp-post-image" alt="美图秀秀的模板功能怎么套用_美图秀秀模板套用教程" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/174996.html" title="美图秀秀的模板功能怎么套用_美图秀秀模板套用教程">美图秀秀的模板功能怎么套用_美图秀秀模板套用教程</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174993.html" title="win10如何实现一张主题包含多张图片"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175772565642066-480x300.jpg" class="attachment-default size-default wp-post-image" alt="win10如何实现一张主题包含多张图片" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/174993.html" title="win10如何实现一张主题包含多张图片">win10如何实现一张主题包含多张图片</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174988.html" title="原神5.7你存在的时空佐证推理选项"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175040940559854-480x300.jpg" class="attachment-default size-default wp-post-image" alt="原神5.7你存在的时空佐证推理选项" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/174988.html" title="原神5.7你存在的时空佐证推理选项">原神5.7你存在的时空佐证推理选项</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-content item-no-thumb"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/174985.html" title="如何解决PHP中GeoJSON数据处理问题？jmikola/geojson库助你轻松实现！">如何解决PHP中GeoJSON数据处理问题？jmikola/geojson库助你轻松实现！</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174986.html" title="Win11多台电脑如何实现共享？Win11两台电脑建立共享的方法"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/175522524534485-480x300.jpg" class="attachment-default size-default wp-post-image" alt="Win11多台电脑如何实现共享？Win11两台电脑建立共享的方法" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/174986.html" title="Win11多台电脑如何实现共享？Win11两台电脑建立共享的方法">Win11多台电脑如何实现共享？Win11两台电脑建立共享的方法</a></p> <p class="item-date">2026年8月31日</p> </div> </li> <li class="item"> <div class="item-img"> <a class="item-img-inner" href="https://www.chuangxiangniao.com/p/174983.html" title="诺基亚6300和2720哪个好（诺基亚800和2720对比）"> <img width="480" height="300" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/11/171210303150084-480x300.jpg" class="attachment-default size-default wp-post-image" alt="诺基亚6300和2720哪个好（诺基亚800和2720对比）" decoding="async" loading="lazy" /> </a> </div> <div class="item-content"> <p class="item-title"><a href="https://www.chuangxiangniao.com/p/174983.html" title="诺基亚6300和2720哪个好（诺基亚800和2720对比）">诺基亚6300和2720哪个好（诺基亚800和2720对比）</a></p> <p class="item-date">2026年8月31日</p> </div> </li> </ul> </div><div class="widget widget_tags"><h3 class="widget-title"><span>热门标签</span></h3> <div class="tagcloud"> <a href="https://www.chuangxiangniao.com/p/tag/ai" title="ai">ai</a> <a href="https://www.chuangxiangniao.com/p/tag/gongju" title="工具">工具</a> <a href="https://www.chuangxiangniao.com/p/tag/liulanqi" title="浏览器">浏览器</a> <a href="https://www.chuangxiangniao.com/p/tag/app" title="app">app</a> <a href="https://www.chuangxiangniao.com/p/tag/java" title="java">java</a> <a href="https://www.chuangxiangniao.com/p/tag/php" title="php">php</a> <a href="https://www.chuangxiangniao.com/p/tag/css" title="css">css</a> <a href="https://www.chuangxiangniao.com/p/tag/windows" title="windows">windows</a> <a href="https://www.chuangxiangniao.com/p/tag/html" title="html">html</a> <a href="https://www.chuangxiangniao.com/p/tag/go" title="go">go</a> <a href="https://www.chuangxiangniao.com/p/tag/js" title="js">js</a> <a href="https://www.chuangxiangniao.com/p/tag/win" title="win">win</a> <a href="https://www.chuangxiangniao.com/p/tag/diannao" title="电脑">电脑</a> <a href="https://www.chuangxiangniao.com/p/tag/javascript" title="javascript">javascript</a> <a href="https://www.chuangxiangniao.com/p/tag/linux" title="linux">linux</a> <a href="https://www.chuangxiangniao.com/p/tag/red" title="red">red</a> <a href="https://www.chuangxiangniao.com/p/tag/python" title="python">python</a> <a href="https://www.chuangxiangniao.com/p/tag/c%20%20" title="c++">c++</a> <a href="https://www.chuangxiangniao.com/p/tag/o" title="o">o</a> <a href="https://www.chuangxiangniao.com/p/tag/mysql" title="mysql">mysql</a> <a href="https://www.chuangxiangniao.com/p/tag/a" title="a">a</a> <a href="https://www.chuangxiangniao.com/p/tag/caozuoxitong" title="操作系统">操作系统</a> <a href="https://www.chuangxiangniao.com/p/tag/weishenme" title="为什么">为什么</a> <a href="https://www.chuangxiangniao.com/p/tag/2025" title="2025">2025</a> <a href="https://www.chuangxiangniao.com/p/tag/json" title="json">json</a> <a href="https://www.chuangxiangniao.com/p/tag/git" title="git">git</a> <a href="https://www.chuangxiangniao.com/p/tag/qubie" title="区别">区别</a> <a href="https://www.chuangxiangniao.com/p/tag/jiaoyisuo" title="交易所">交易所</a> <a href="https://www.chuangxiangniao.com/p/tag/qianduan" title="前端">前端</a> <a href="https://www.chuangxiangniao.com/p/tag/bian-4" title="币安">币安</a> </div> </div> </aside> </div> </div> <footer class="footer"> <div class="container"> <div class="footer-col-wrap footer-with-icon"> <div class="footer-col footer-col-copy"> <ul class="footer-nav hidden-xs"><li id="menu-item-4095" class="menu-item menu-item-4095"><a target="1" href="https://www.chuangxiangniao.com/falyushengming">法律声明</a></li> <li id="menu-item-4099" class="menu-item menu-item-4099"><a target="1" href="https://www.chuangxiangniao.com/about">关于我们</a></li> <li id="menu-item-4098" class="menu-item menu-item-4098"><a target="1" href="https://www.chuangxiangniao.com/contact">联系我们</a></li> <li id="menu-item-4097" class="menu-item menu-item-4097"><a target="1" href="https://www.chuangxiangniao.com/yonghuxieyi">用户协议</a></li> <li id="menu-item-4094" class="menu-item menu-item-privacy-policy menu-item-4094"><a target="1" rel="privacy-policy" href="https://www.chuangxiangniao.com/yinsizhengce">隐私政策</a></li> <li id="menu-item-4096" class="menu-item menu-item-4096"><a target="1" href="https://www.chuangxiangniao.com/mianzeshengming">版权及免责声明</a></li> </ul> <div class="copyright"> <p>版权声明：本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。</p> <p>如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao#163.com （请把#更换@）举报，一经查实，本站将立刻删除。</p> <p>Copyright © 2019-2025 <a href="https://www.chuangxiangniao.com/" target="_blank" rel="noopener noreferrer">创想鸟</a> 版权所有 <a href="https://beian.miit.gov.cn" target="_blank" rel="nofollow noopener noreferrer">皖ICP备2024035995号-1</a></p> </div> </div> <div class="footer-col footer-col-sns"> <div class="footer-sns"> <a href="https://www.chuangxiangniao.com/sitemap/sitemap.xml" target="_blank" aria-label="icon"> <i class="wpcom-icon fa fa-sitemap sns-icon"></i> </a> <a class="sns-wx" href="javascript:;" aria-label="icon"> <i class="wpcom-icon fa fa-wechat sns-icon"></i> <span style="background-image:url('https://www.chuangxiangniao.com/wp-content/uploads/2025/10/wechat.jpg');"></span> </a> </div> </div> </div> </div> </footer> <div class="action action-style-0 action-color-1 action-pos-1" style="bottom:450px;"> <div class="action-item"> <i class="wpcom-icon fa fa-wechat action-item-icon"></i> <div class="action-item-inner action-item-type-1"> <img class="action-item-img" src="https://www.chuangxiangniao.com/wp-content/uploads/2025/10/wechat.jpg" alt="关注微信" decoding="async" loading="lazy"> </div> </div> <div class="action-item j-share"> <i class="wpcom-icon wi action-item-icon"><svg aria-hidden="true"><use xlink:href="#wi-share"></use></svg></i> </div> <div class="action-item gotop j-top"> <i class="wpcom-icon wi action-item-icon"><svg aria-hidden="true"><use xlink:href="#wi-arrow-up-2"></use></svg></i> </div> </div> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/justnews/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script id="imwpf-this-page"> var g_this_page = { "type": "post", "id": 1571321, "terms": [{"id":49069,"tax":"category"},{"id":175,"tax":"post_tag"},{"id":100,"tax":"post_tag"},{"id":190,"tax":"post_tag"},{"id":347,"tax":"post_tag"},{"id":18464,"tax":"post_tag"},{"id":219,"tax":"post_tag"},{"id":121,"tax":"post_tag"},{"id":376,"tax":"post_tag"},{"id":267,"tax":"post_tag"},{"id":2459,"tax":"post_tag"},{"id":116,"tax":"post_tag"}] };console.log(g_this_page); </script><div class="imwpcache_status_ok"></div><script id="main-js-extra"> var _wpcom_js = {"webp":"","ajaxurl":"https://www.chuangxiangniao.com/wp-admin/admin-ajax.php","theme_url":"https://www.chuangxiangniao.com/wp-content/themes/justnews","slide_speed":"5000","is_admin":"0","lang":"zh_CN","js_lang":{"share_to":"\u5206\u4eab\u5230:","copy_done":"\u590d\u5236\u6210\u529f\uff01","copy_fail":"\u6d4f\u89c8\u5668\u6682\u4e0d\u652f\u6301\u62f7\u8d1d\u529f\u80fd","confirm":"\u786e\u5b9a","qrcode":"\u4e8c\u7ef4\u7801","page_loaded":"\u5df2\u7ecf\u5230\u5e95\u4e86","no_content":"\u6682\u65e0\u5185\u5bb9","load_failed":"\u52a0\u8f7d\u5931\u8d25\uff0c\u8bf7\u7a0d\u540e\u518d\u8bd5\uff01","expand_more":"\u9605\u8bfb\u5269\u4f59 %s"},"share":"1","share_items":{"weibo":{"title":"\u5fae\u535a","icon":"weibo"},"wechat":{"title":"\u5fae\u4fe1","icon":"wechat"},"qq":{"title":"QQ\u597d\u53cb","icon":"qq"},"qzone":{"title":"QQ\u7a7a\u95f4","icon":"qzone"},"douban":{"name":"douban","title":"\u8c46\u74e3","icon":"douban"},"mail":{"title":"\u90ae\u4ef6","icon":"mail-fill"}},"lightbox":"1","post_id":"1571321","user_card_height":"356","poster":{"notice":"\u8bf7\u300c\u70b9\u51fb\u4e0b\u8f7d\u300d\u6216\u300c\u957f\u6309\u4fdd\u5b58\u56fe\u7247\u300d\u540e\u5206\u4eab\u7ed9\u66f4\u591a\u597d\u53cb","generating":"\u6b63\u5728\u751f\u6210\u6d77\u62a5\u56fe\u7247...","failed":"\u6d77\u62a5\u56fe\u7247\u751f\u6210\u5931\u8d25"},"video_height":"484","fixed_sidebar":"1","dark_style":"2","font_url":"//fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500&display=swap","follow_btn":"\u003Ci class=\"wpcom-icon wi\"\u003E\u003Csvg aria-hidden=\"true\"\u003E\u003Cuse xlink:href=\"#wi-add\"\u003E\u003C/use\u003E\u003C/svg\u003E\u003C/i\u003E\u5173\u6ce8","followed_btn":"\u5df2\u5173\u6ce8","user_card":"1"}; //# sourceURL=main-js-extra </script> <script id="main-js" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/js/main.js?ver=6.23.1"></script> <script id="wpcom-icons-js" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/js/icons-2.8.9.js?ver=2.8.9"></script> <script id="comment-reply-js" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/js/comment-reply.js?ver=6.23.1"></script> <script id="wwa-js-extra"> var _wwa_js = {"ajaxurl":"https://www.chuangxiangniao.com/wp-admin/admin-ajax.php","post_id":"1571321","rewarded":"wx"}; //# sourceURL=wwa-js-extra </script> <script id="wwa-js" src="https://www.chuangxiangniao.com/wp-content/plugins/justweapp/js/script.js?ver=3.16.3"></script> <script id="wp-postviews-cache-js-extra"> var wpPostViewsL10n = {"ajaxUrl":"https://www.chuangxiangniao.com/wp-admin/admin-ajax.php","nonce":"eb441ecc38","postId":"1571321"}; //# sourceURL=wp-postviews-cache-js-extra </script> <script id="wp-postviews-cache-js" src="https://www.chuangxiangniao.com/wp-content/plugins/wp-postviews/js/wp-postviews-cache.js?ver=2.0.1"></script> <script id="wp-postviews-cache-js-after"> jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); jQuery(document).ready(function($) { $.get(viewsCacheL10n.admin_ajax_url + '?action=show_postviews&id=' + viewsCacheL10n.post_id, function(data) { $('.ajax-views').html(data); }); }); //# sourceURL=wp-postviews-cache-js-after </script> <script id="wpcom-member-js-extra"> var _wpmx_js = {"ajaxurl":"https://www.chuangxiangniao.com/wp-admin/admin-ajax.php","plugin_url":"https://www.chuangxiangniao.com/wp-content/plugins/wpcom-member/","ver":"1.7.27","max_upload_size":"52428800","post_id":"1571321","pro_ver":"2.5.0","js_lang":{"login_desc":"\u60a8\u8fd8\u672a\u767b\u5f55\uff0c\u8bf7\u767b\u5f55\u540e\u518d\u8fdb\u884c\u76f8\u5173\u64cd\u4f5c\uff01","login_title":"\u8bf7\u767b\u5f55","login_btn":"\u767b\u5f55","reg_btn":"\u6ce8\u518c"},"login_url":"https://www.chuangxiangniao.com/login?modal-type=login","register_url":"https://www.chuangxiangniao.com/register?modal-type=register","errors":{"require":"\u4e0d\u80fd\u4e3a\u7a7a","email":"\u8bf7\u8f93\u5165\u6b63\u786e\u7684\u7535\u5b50\u90ae\u7bb1","pls_enter":"\u8bf7\u8f93\u5165","password":"\u5bc6\u7801\u5fc5\u987b\u4e3a6~32\u4e2a\u5b57\u7b26","passcheck":"\u4e24\u6b21\u5bc6\u7801\u8f93\u5165\u4e0d\u4e00\u81f4","phone":"\u8bf7\u8f93\u5165\u6b63\u786e\u7684\u624b\u673a\u53f7\u7801","terms":"\u8bf7\u9605\u8bfb\u5e76\u540c\u610f\u6761\u6b3e","sms_code":"\u9a8c\u8bc1\u7801\u9519\u8bef","captcha_verify":"\u8bf7\u70b9\u51fb\u6309\u94ae\u8fdb\u884c\u9a8c\u8bc1","captcha_fail":"\u4eba\u673a\u9a8c\u8bc1\u5931\u8d25\uff0c\u8bf7\u91cd\u8bd5","nonce":"\u968f\u673a\u6570\u6821\u9a8c\u5931\u8d25","req_error":"\u8bf7\u6c42\u5931\u8d25"},"hidden_content":"1","copy_post":"1","copy_post_text":"\u4ed8\u8d39\u89e3\u9501\u5f53\u524d\u6587\u7ae0\u590d\u5236\u6743\u9650","copy_post_container":".entry-content"}; //# sourceURL=wpcom-member-js-extra </script> <script id="wpcom-member-js" src="https://www.chuangxiangniao.com/wp-content/plugins/wpcom-member/js/index.js?ver=1.7.27"></script> <script id="wpcom-member-pro-js" src="https://www.chuangxiangniao.com/wp-content/plugins/wpcom-member-pro/js/index.js?ver=2.5.0"></script> <script id="wp-embed-js" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/js/wp-embed.js?ver=6.23.1"></script> <!--百度自动推送代码开始--> <script> (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> <!--百度自动推送代码结束--> <!--360自动推送代码开始--> <script> (function(){ var src = (document.location.protocol == "http:") ? "http://js.passport.qihucdn.com/11.0.1.js?d7af82f5d5a7d431d4b53f4d0069f989":"https://jspassport.ssl.qhimg.com/11.0.1.js?d7af82f5d5a7d431d4b53f4d0069f989"; document.write('<script src="' + src + '" id="sozz"><\/script>'); })(); </script> <!--360自动推送代码结束--> <!--头条自动推送代码开始--> <script> (function(){ var el = document.createElement("script"); el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?e1627df632cb7d8422ff5a171866ae673d0a9fd8a088d803a9d0f3c3bef0aa6adb92f43d4b1c8ff14071b55e1e71da09d918f66d1949fb3b81012c4e4e9e4a34644f149b0c276c07ebf664bf3622e408"; el.id = "ttzz"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(el, s); })(window) </script> <!--头条自动推送代码结束--> <!--百度统计代码开始--> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?357b28aff465596d316075fdd7393426"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <!--百度统计代码结束--> <script type="application/ld+json">{"@context":"https://schema.org","@type":"Article","@id":"https://www.chuangxiangniao.com/p/1571321.html","url":"https://www.chuangxiangniao.com/p/1571321.html","headline":"什么是HTML元素？常见的HTML标签有哪些？","description":"html标签是用于标记元素的符号，如 、 等，分为开始标签和结束标签，而html元素是由开始标签、内容和结束标签组成的完整结构单元，如 这是一段文字。 即为一个段落元素；2. 某些元素为空元素，如，仅有开始标签，通过属性携带信息，无需结束标签；3. HTML元素在网页中承担语义化、布局基础、可访问性…","datePublished":"2025-12-22T13:40:10+08:00","dateModified":"2025-12-22T13:40:10+08:00","author":{"@type":"Person","name":"程序猿","url":"https://www.chuangxiangniao.com/user/3","image":"http://www.chuangxiangniao.com/wp-content/uploads/2025/10/2025102208472691.jpg"},"image":["https://www.chuangxiangniao.com/wp-content/uploads/2025/12/175499622729497.jpg"]}</script> <script>console.log('命中缓存\n缓存页加载耗时: 0.0077s\n缓存页生成时间: 2026-08-31 05:42:25')</script></body> </html><!--cached by imwpcache 2026-08-31 05:42:25-->
