登录
推荐 文章 Go 技术 课程 下载 专题 AI
首页 >  文章 >  前端

HTML标签分类及实例详解

时间：2025-08-12 13:58:39 166浏览 收藏

最近发现不少小伙伴都对文章很感兴趣，所以今天继续给大家介绍文章相关的知识，本文《HTML标签主要分为三类：基本标签、语义标签和表单标签。以下是每类的实例演示：基本标签

：段落标签

这是一个段落。

：标题标签

这是主标题

语义标签
：定义页面头部

网站标题

：定义页面底部
版权所有 © 2025
表单标签 ：输入框 》
主要内容涉及到等等知识点，希望能帮到你！当然如果阅读本文时存在不同想法，可以在评论中表达，但是请勿使用过激的措辞~

HTML标签分为三类：1. 结构标签，如、、，定义网页基本框架；2. 内容标签，如

、

、、，用于显示实际内容；3. 格式化标签，如、、、

，控制内容外观和排版。
html中的标记分几种举例说明 3类html标签实例演示
在HTML中，标记（tags）是构建网页的基础，它们定义了网页的结构和内容。HTML标签可以分为多种类型，但为了简明起见，我们将它们大致分为三类：结构标签、内容标签和格式化标签。以下是每种类型的实例演示，并将详细探讨如何使用这些标签来构建和美化网页。
结构标签
结构标签是用来定义网页的基本结构和布局的。这些标签通常不会直接显示在网页上，但它们对组织内容至关重要。



    
    我的网页


    


在上面的例子中，, , , </code>, 和 <code><body></code> 都是结构标签。它们定义了网页的基本框架，没有这些标签，网页将无法正确显示。</p><p>使用这些标签时，务必要注意文档类型声明（<code><DOCTYPE html></code>）和语言属性（<code>lang="zh-CN"</code>），它们对搜索引擎优化（SEO）和用户体验至关重要。尤其是<code><head></code>标签内的<code><meta></code>标签，它定义了字符编码，如果没有它，网页可能在某些浏览器中显示乱码。</p><h3>内容标签</h3><p>内容标签用于在网页上显示实际内容，如文本、图片、链接等。这些标签直接影响用户看到的内容。</p><pre class="brush:language-html;toolbar:false;"><h1>欢迎来到我的博客</h1>
<p>这是我的第一篇文章，关于HTML标签的使用心得。</p>
<img src="image.jpg" alt="我的照片">
<a href="https://example.com">访问我的网站</a></pre><p>在这个例子中，<code><h1></code>, <code><p></code>, <code><img></code>, 和 <code><a></code> 都是内容标签。它们分别用于标题、段落、图片和链接。</p><p>使用内容标签时，需要注意<code><img></code>标签的<code>alt</code>属性，它为图片提供文本描述，这不仅有助于SEO，还能在图片无法加载时为用户提供信息。此外，<code><a></code>标签的<code>href</code>属性是链接的核心，它决定了点击链接后用户将被带到哪里。</p><h3>格式化标签</h3><p>格式化标签用于控制文本和内容的外观和排版。这些标签不会改变内容本身，但会影响内容的显示方式。</p><pre class="brush:language-html;toolbar:false;"><b>这是加粗的文本</b>
<i>这是斜体的文本</i>
<u>这是带下划线的文本</u>
<pre>
这是预格式化的文本
    它保留了空格和换行
</pre></pre><p>在这个例子中，<code><b></code>, <code><i></code>, <code><u></code>, 和 <code><pre></code> 都是格式化标签。它们分别用于加粗、斜体、下划线和预格式化文本。</p><p>使用格式化标签时，值得注意的是，虽然这些标签可以快速改变文本的外观，但最好通过CSS来控制样式，因为这样可以更好地分离内容和样式，提高网页的可维护性和可访问性。例如，<code><b></code>和<code><i></code>标签虽然仍被广泛使用，但现代网页设计更倾向于使用<code><strong></code>和<code><em></code>标签，因为它们不仅改变了文本的外观，还提供了语义上的强调。</p><h3>深度见解与建议</h3><p>在使用HTML标签时，除了基本的使用方法外，还需要考虑以下几个方面：</p><ul><li><strong>语义化HTML</strong>：使用合适的标签来反映内容的结构和意义，这不仅有助于SEO，还能提高网页的可访问性。例如，使用<code><nav></code>来标记导航菜单，而不是简单的<code><div></code>。</li><li><strong>响应式设计</strong>：随着移动设备的普及，确保网页在不同设备上都能正确显示变得越来越重要。这通常需要结合CSS和JavaScript来实现，但从HTML层面来说，使用<code><meta name="viewport"></code>标签是第一步。</li><li><strong>性能优化</strong>：尽量减少不必要的标签和属性，使用简洁的HTML代码可以提高网页的加载速度和性能。</li></ul><p>总之，理解和正确使用HTML标签不仅能构建出结构清晰、内容丰富的网页，还能提高网页的性能和用户体验。在实际开发中，结合CSS和JavaScript可以进一步提升网页的美观度和交互性，但HTML始终是网页的基础。</p><p>理论要掌握，实操不能落！以上关于《HTML标签分类及实例详解》的详细介绍，大家都掌握了吧！如果想要继续提升自己的能力，那么就来关注golang学习网公众号吧！</p>      </div>
        <div class="labsList">
                    </div>
          </div>

         <!-- 最新阅读 -->
     <div class="contBoxNor">
      <div class="contTit">
        <div class="tit">相关阅读</div>
        <a href="/articlelist.html" class="more">更多></a>
      </div>
      <ul class="latestReadList">
                <li>
          <div class="info">
                                  <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                          |  1年前  |  
                                       <a href="javascript:;" class="aLightGray" title="提升">提升</a>
                                                 <a href="javascript:;" class="aLightGray" title="箭头函数">箭头函数</a>
                                                 <a href="javascript:;" class="aLightGray" title="函数表达式">函数表达式</a>
                                                 <a href="javascript:;" class="aLightGray" title="函数声明">函数声明</a>
                                                 <a href="javascript:;" class="aLightGray" title="Function构造函数">Function构造函数</a>
                      </div>
          <div class="tit lineOverflow"><a href="/article/207000.html"  title="JavaScript函数定义及示例详解" class="aBlack">JavaScript函数定义及示例详解</a></div>
          <div class="opt">
            <span><i class="view"></i>502</span>
            <span class="collectBtn user_collection" data-id="207000" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
          </div>
        </li>
                <li>
          <div class="info">
                                  <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                          |  2个月前  |  
            </div>
          <div class="tit lineOverflow"><a href="/article/619053.html"  title="CSS变量简化按钮悬停效果技巧" class="aBlack">CSS变量简化按钮悬停效果技巧</a></div>
          <div class="opt">
            <span><i class="view"></i>501</span>
            <span class="collectBtn user_collection" data-id="619053" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
          </div>
        </li>
                <li>
          <div class="info">
                                  <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                          |  2个月前  |  
            </div>
          <div class="tit lineOverflow"><a href="/article/618916.html"  title="JavaScript符号类型详解与应用" class="aBlack">JavaScript符号类型详解与应用</a></div>
          <div class="opt">
            <span><i class="view"></i>501</span>
            <span class="collectBtn user_collection" data-id="618916" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
          </div>
        </li>
                <li>
          <div class="info">
                                  <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                          |  2个月前  |  
            </div>
          <div class="tit lineOverflow"><a href="/article/612539.html"  title="HTML剪贴板复制粘贴怎么用" class="aBlack">HTML剪贴板复制粘贴怎么用</a></div>
          <div class="opt">
            <span><i class="view"></i>501</span>
            <span class="collectBtn user_collection" data-id="612539" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
          </div>
        </li>
                <li>
          <div class="info">
                                  <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                          |  2个月前  |  
            </div>
          <div class="tit lineOverflow"><a href="/article/611774.html"  title="data-*属性详解：HTML数据存储与DOM操作技巧" class="aBlack">data-*属性详解：HTML数据存储与DOM操作技巧</a></div>
          <div class="opt">
            <span><i class="view"></i>501</span>
            <span class="collectBtn user_collection" data-id="611774" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
          </div>
        </li>
              </ul>
    </div>
         <!-- 最新阅读 -->
      <div class="contBoxNor">
          <div class="contTit">
              <div class="tit">最新阅读</div>
              <a href="/articlelist.html" class="more">更多></a>
          </div>
          <ul class="latestReadList">
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  12小时前  |  
                                            <a href="/articletag/243_new_0_1.html" class="aLightGray" title="前端">前端</a> ·
                                            <a href="/articletag/4729_new_0_1.html" class="aLightGray" title="css">css</a> ·
                                            <a href="/articletag/39796_new_0_1.html" class="aLightGray" title="表单">表单</a> ·
                                            <a href="javascript:;" class="aLightGray" title="CSS">CSS</a>
                                            <a href="javascript:;" class="aLightGray" title="响应式布局">响应式布局</a>
                                            <a href="javascript:;" class="aLightGray" title="表单">表单</a>
                                            <a href="javascript:;" class="aLightGray" title="field-sizing">field-sizing</a>
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621111.html"  title="CSS field-sizing: content 怎么让输入框随内容变宽：最小宽度、最大宽度和降级验收" class="aBlack">CSS field-sizing: content 怎么让输入框随内容变宽：最小宽度、最大宽度和降级验收</a></div>
                  <div class="opt">
                      <span><i class="view"></i>442</span>
                      <span class="collectBtn user_collection" data-id="621111" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  14小时前  |  
                                            <a href="/articletag/4701_new_0_1.html" class="aLightGray" title="javascript">javascript</a> ·
                                            <a href="/articletag/39953_new_0_1.html" class="aLightGray" title="前端工程">前端工程</a> ·
                                            <a href="/articletag/40054_new_0_1.html" class="aLightGray" title="浏览器API">浏览器API</a> ·
                                            <a href="javascript:;" class="aLightGray" title="Web Locks API">Web Locks API</a>
                                            <a href="javascript:;" class="aLightGray" title="navigator.locks">navigator.locks</a>
                                            <a href="javascript:;" class="aLightGray" title="前端多标签页">前端多标签页</a>
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621099.html"  title="Web Locks API 怎么防止多标签页重复刷新：ifAvailable、超时与失联恢复" class="aBlack">Web Locks API 怎么防止多标签页重复刷新：ifAvailable、超时与失联恢复</a></div>
                  <div class="opt">
                      <span><i class="view"></i>386</span>
                      <span class="collectBtn user_collection" data-id="621099" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  16小时前  |  
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621083.html"  title="SPA 导航失败怎么保留旧内容：Navigation API 的 navigateerror 与重试回退" class="aBlack">SPA 导航失败怎么保留旧内容：Navigation API 的 navigateerror 与重试回退</a></div>
                  <div class="opt">
                      <span><i class="view"></i>308</span>
                      <span class="collectBtn user_collection" data-id="621083" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  16小时前  |  
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621082.html"  title="前端 SPA 导航怎么统一接管：Navigation API 的拦截、失败恢复与回退" class="aBlack">前端 SPA 导航怎么统一接管：Navigation API 的拦截、失败恢复与回退</a></div>
                  <div class="opt">
                      <span><i class="view"></i>291</span>
                      <span class="collectBtn user_collection" data-id="621082" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  19小时前  |  
                                            <a href="/articletag/4729_new_0_1.html" class="aLightGray" title="css">css</a> ·
                                            <a href="/articletag/5401_new_0_1.html" class="aLightGray" title="前端开发">前端开发</a> ·
                                            <a href="/articletag/40634_new_0_1.html" class="aLightGray" title="无障碍设计">无障碍设计</a> ·
                                            <a href="javascript:;" class="aLightGray" title="CSS">CSS</a>
                                            <a href="javascript:;" class="aLightGray" title="无障碍">无障碍</a>
                                            <a href="javascript:;" class="aLightGray" title="color-mix">color-mix</a>
                                            <a href="javascript:;" class="aLightGray" title="design token">design token</a>
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621062.html"  title="CSS 主题按钮怎么用 color-mix() 派生 hover 与浅底：对比度和 fallback 实战" class="aBlack">CSS 主题按钮怎么用 color-mix() 派生 hover 与浅底：对比度和 fallback 实战</a></div>
                  <div class="opt">
                      <span><i class="view"></i>173</span>
                      <span class="collectBtn user_collection" data-id="621062" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  19小时前  |  
                                            <a href="/articletag/4729_new_0_1.html" class="aLightGray" title="css">css</a> ·
                                            <a href="/articletag/5401_new_0_1.html" class="aLightGray" title="前端开发">前端开发</a> ·
                                            <a href="/articletag/40634_new_0_1.html" class="aLightGray" title="无障碍设计">无障碍设计</a> ·
                                            <a href="javascript:;" class="aLightGray" title="CSS">CSS</a>
                                            <a href="javascript:;" class="aLightGray" title="无障碍">无障碍</a>
                                            <a href="javascript:;" class="aLightGray" title="color-mix">color-mix</a>
                                            <a href="javascript:;" class="aLightGray" title="design token">design token</a>
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621061.html"  title="CSS color-mix() 做主题色派生：从 design token 到对比度验收" class="aBlack">CSS color-mix() 做主题色派生：从 design token 到对比度验收</a></div>
                  <div class="opt">
                      <span><i class="view"></i>406</span>
                      <span class="collectBtn user_collection" data-id="621061" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  2天前  |  
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621033.html"  title="中文标题总是断得难看？CSS text-wrap balance 的宽度约束与降级验收" class="aBlack">中文标题总是断得难看？CSS text-wrap balance 的宽度约束与降级验收</a></div>
                  <div class="opt">
                      <span><i class="view"></i>330</span>
                      <span class="collectBtn user_collection" data-id="621033" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  2天前  |  
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621032.html"  title="CSS text-wrap: balance 怎么让中文标题更稳：max-width、降级与可访问性" class="aBlack">CSS text-wrap: balance 怎么让中文标题更稳：max-width、降级与可访问性</a></div>
                  <div class="opt">
                      <span><i class="view"></i>353</span>
                      <span class="collectBtn user_collection" data-id="621032" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  2天前  |  
                      </div>
                  <div class="tit lineOverflow"><a href="/article/621031.html"  title="CSS Anchor Positioning 怎么做浮层定位：position-try 回退、可访问性和旧浏览器降级" class="aBlack">CSS Anchor Positioning 怎么做浮层定位：position-try 回退、可访问性和旧浏览器降级</a></div>
                  <div class="opt">
                      <span><i class="view"></i>349</span>
                      <span class="collectBtn user_collection" data-id="621031" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  1星期前  |  
                                            <a href="/articletag/243_new_0_1.html" class="aLightGray" title="前端">前端</a> ·
                                            <a href="/articletag/861_new_0_1.html" class="aLightGray" title="性能">性能</a> ·
                                            <a href="/articletag/2436_new_0_1.html" class="aLightGray" title="异步任务">异步任务</a> ·
                                            <a href="/articletag/40548_new_0_1.html" class="aLightGray" title="对象存储">对象存储</a> ·
                                            <a href="/articletag/40552_new_0_1.html" class="aLightGray" title="文件导出">文件导出</a> ·
                                            <a href="javascript:;" class="aLightGray" title="Excel">Excel</a>
                                            <a href="javascript:;" class="aLightGray" title="csv">csv</a>
                                            <a href="javascript:;" class="aLightGray" title="对象存储">对象存储</a>
                                            <a href="javascript:;" class="aLightGray" title="异步任务">异步任务</a>
                                            <a href="javascript:;" class="aLightGray" title="SSE">SSE</a>
                                            <a href="javascript:;" class="aLightGray" title="前端报表导出">前端报表导出</a>
                                            <a href="javascript:;" class="aLightGray" title="浏览器导出">浏览器导出</a>
                      </div>
                  <div class="tit lineOverflow"><a href="/article/620753.html"  title="前端大报表导出怎么选：浏览器直出还是后端异步任务" class="aBlack">前端大报表导出怎么选：浏览器直出还是后端异步任务</a></div>
                  <div class="opt">
                      <span><i class="view"></i>331</span>
                      <span class="collectBtn user_collection" data-id="620753" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  1星期前  |  
                      </div>
                  <div class="tit lineOverflow"><a href="/article/620752.html"  title="前端 WebSocket 断线重连为什么会打爆接口：指数退避、抖动与页面恢复" class="aBlack">前端 WebSocket 断线重连为什么会打爆接口：指数退避、抖动与页面恢复</a></div>
                  <div class="opt">
                      <span><i class="view"></i>366</span>
                      <span class="collectBtn user_collection" data-id="620752" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                            <li>
                  <div class="info">
                                            <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a> ·
                                            <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a>
                                              |  1星期前  |  
                                            <a href="/articletag/243_new_0_1.html" class="aLightGray" title="前端">前端</a> ·
                                            <a href="/articletag/729_new_0_1.html" class="aLightGray" title="性能优化">性能优化</a> ·
                                            <a href="/articletag/4701_new_0_1.html" class="aLightGray" title="javascript">javascript</a> ·
                                            <a href="/articletag/40547_new_0_1.html" class="aLightGray" title="大文件上传">大文件上传</a> ·
                                            <a href="/articletag/40548_new_0_1.html" class="aLightGray" title="对象存储">对象存储</a> ·
                                            <a href="javascript:;" class="aLightGray" title="断点续传">断点续传</a>
                                            <a href="javascript:;" class="aLightGray" title="分片上传">分片上传</a>
                                            <a href="javascript:;" class="aLightGray" title="前端大文件上传">前端大文件上传</a>
                                            <a href="javascript:;" class="aLightGray" title="对象存储直传">对象存储直传</a>
                                            <a href="javascript:;" class="aLightGray" title="预签名URL">预签名URL</a>
                      </div>
                  <div class="tit lineOverflow"><a href="/article/620744.html"  title="前端大文件上传怎么选：后端中转还是对象存储分片直传" class="aBlack">前端大文件上传怎么选：后端中转还是对象存储分片直传</a></div>
                  <div class="opt">
                      <span><i class="view"></i>448</span>
                      <span class="collectBtn user_collection" data-id="620744" data-type="article" title="收藏"><i class="collect"></i>收藏</span>
                  </div>
              </li>
                        </ul>
      </div>
    <!-- 课程推荐 -->
    <div class="contBoxNor">
      <div class="contTit">
        <div class="tit">课程推荐</div>
        <a href="/courselist.html" class="more">更多></a>
      </div>
      <ul class="classRecomList">
                <li>
          <a href="/course/9.html" title="前端进阶之JavaScript设计模式" class="img_box">
            <img src="/uploads/20221222/52fd0f23a454c71029c2c72d206ed815.jpg" onerror="this.onerror='';this.src='/assets/images/moren/morentu.png'" alt="前端进阶之JavaScript设计模式">
                      </a>
          <dl>
            <dt class="lineOverflow">
              前端进阶之JavaScript设计模式            </dt>
            <dd class="cont1 lineOverflow">设计模式是开发人员在软件开发过程中面临一般问题时的解决方案，代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景，打造一站式知识长龙服务，适合有JS基础的同学学习。</dd>
            <dd class="cont2">
              <a href="/course/9.html" title="前端进阶之JavaScript设计模式" class="toStudy">立即学习</a>
              <span>543次学习</span>
            </dd>
          </dl>
        </li>
                <li>
          <a href="/course/2.html" title="GO语言核心编程课程" class="img_box">
            <img src="/uploads/20221221/634ad7404159bfefc6a54a564d437b5f.png" onerror="this.onerror='';this.src='/assets/images/moren/morentu.png'" alt="GO语言核心编程课程">
                      </a>
          <dl>
            <dt class="lineOverflow">
              GO语言核心编程课程            </dt>
            <dd class="cont1 lineOverflow">本课程采用真实案例，全面具体可落地，从理论到实践，一步一步将GO核心编程技术、编程思想、底层实现融会贯通，使学习者贴近时代脉搏，做IT互联网时代的弄潮儿。</dd>
            <dd class="cont2">
              <a href="/course/2.html" title="GO语言核心编程课程" class="toStudy">立即学习</a>
              <span>516次学习</span>
            </dd>
          </dl>
        </li>
                <li>
          <a href="/course/74.html" title="简单聊聊mysql8与网络通信" class="img_box">
            <img src="/uploads/20240103/bad35fe14edbd214bee16f88343ac57c.png" onerror="this.onerror='';this.src='/assets/images/moren/morentu.png'" alt="简单聊聊mysql8与网络通信">
                      </a>
          <dl>
            <dt class="lineOverflow">
              简单聊聊mysql8与网络通信            </dt>
            <dd class="cont1 lineOverflow">如有问题加微信：Le-studyg；在课程中，我们将首先介绍MySQL8的新特性，包括性能优化、安全增强、新数据类型等，帮助学生快速熟悉MySQL8的最新功能。接着，我们将深入解析MySQL的网络通信机制，包括协议、连接管理、数据传输等，让</dd>
            <dd class="cont2">
              <a href="/course/74.html" title="简单聊聊mysql8与网络通信" class="toStudy">立即学习</a>
              <span>500次学习</span>
            </dd>
          </dl>
        </li>
                <li>
          <a href="/course/57.html" title="JavaScript正则表达式基础与实战" class="img_box">
            <img src="/uploads/20221226/bbe4083bb3cb0dd135fb02c31c3785fb.jpg" onerror="this.onerror='';this.src='/assets/images/moren/morentu.png'" alt="JavaScript正则表达式基础与实战">
                      </a>
          <dl>
            <dt class="lineOverflow">
              JavaScript正则表达式基础与实战            </dt>
            <dd class="cont1 lineOverflow">在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。</dd>
            <dd class="cont2">
              <a href="/course/57.html" title="JavaScript正则表达式基础与实战" class="toStudy">立即学习</a>
              <span>487次学习</span>
            </dd>
          </dl>
        </li>
                <li>
          <a href="/course/28.html" title="从零制作响应式网站—Grid布局" class="img_box">
            <img src="/uploads/20221223/ac110f88206daeab6c0cf38ebf5fe9ed.jpg" onerror="this.onerror='';this.src='/assets/images/moren/morentu.png'" alt="从零制作响应式网站—Grid布局">
                      </a>
          <dl>
            <dt class="lineOverflow">
              从零制作响应式网站—Grid布局            </dt>
            <dd class="cont1 lineOverflow">本系列教程将展示从零制作一个假想的网络科技公司官网，分为导航，轮播，关于我们，成功案例，服务流程，团队介绍，数据部分，公司动态，底部信息等内容区块。网站整体采用CSSGrid布局，支持响应式，有流畅过渡和展现动画。</dd>
            <dd class="cont2">
              <a href="/course/28.html" title="从零制作响应式网站—Grid布局" class="toStudy">立即学习</a>
              <span>485次学习</span>
            </dd>
          </dl>
        </li>
              </ul>
    </div>
        </div>
  <!-- footer -->
  <div class="footer">
    <ul>
      <li  ><a href="/" class="aLightGray"><em class="navIcon navIconHome"></em><span>首页</span></a></li>
      <li  class="curr"><a href="/articlelist.html" class="aLightGray"><em class="navIcon navIconRead"></em><span>阅读</span></a></li>
      <li  ><a href="/courselist.html" class="aLightGray"><em class="navIcon navIconCourse"></em><span>课程</span></a></li>
      <li  ><a href="/ai.html" class="aLightGray"><em class="navIcon navIconAi"></em><span>AI助手</span></a></li>
      <li ><a href="/user.html" class="aLightGray"><em class="navIcon navIconUser"></em><span>我的</span></a></li>
    </ul>
  </div>
  <script src="/assets/js/frontend/common.js" defer></script>
  <script src="/assets/js/juejin-theme.js?v=20260613b" defer></script>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?e34c3e8ab31ba35d7e1c48ea8d77315f";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

</body>
</html>