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

HTML框架集构建多页面结构的方法如下:使用<frameset>标签:定义页面的框架布局,可以指定行(rows)或列(cols)来划分区域。添加<frame>标签:在<frameset>内部插入多个<frame>标签,每个标签对应一个页面区域,通过src属性指定要加载的页面。设置属性:为<frame>设置name、scrolling、no

时间:2026-04-25 20:40:39 180浏览 收藏

本文详解了如何利用HTML框架集(frameset)构建多页面结构,涵盖从定义rows分区、配置frame的src与name属性,到优化边框、尺寸锁定和滚动行为的关键技巧;同时指导读者通过target实现精准框架内跳转,并提供noframes降级方案以保障兼容性,最后强调避免嵌套框架及SEO陷阱,确保每个框架页独立可访问、可索引,兼顾用户体验与技术规范。

html如何框架_使用框架集构建HTML多页面结构【多页面】

如果您希望在一个浏览器窗口中同时显示多个独立的HTML页面,并通过框架集(frameset)实现内容分区,则需要使用标签替代来组织页面布局。以下是构建基于框架集的多页面结构的具体方法:

一、定义框架集结构

框架集通过元素划分浏览器窗口区域,每个区域由指定加载的HTML文档。该结构不使用,且需在根元素下直接嵌套

1、创建一个新HTML文件,删除标签及其全部内容。

2、在之后插入,表示顶部150像素高度的框架和剩余空间的主框架。

3、在内部添加两个标签,分别设置src属性指向header.htmlmain.html

4、为每个添加name属性,例如name="topFrame"name="contentFrame",以便后续页面跳转时定向加载。

二、配置框架边框与滚动行为

默认情况下框架会显示边框并启用滚动条,可通过属性控制其外观与交互行为,提升用户界面一致性。

1、在标签中添加border="0",移除框架间分隔线。

2、为每个添加noresize属性,禁止用户拖动调整框架尺寸。

3、在中设置scrolling="auto",仅在内容超出可视区域时显示滚动条。

4、使用frameborder="0"进一步确保各框架无边框渲染。

三、实现框架内页面导航跳转

通过设置标签的target属性,可指定链接在特定命名框架中打开目标页面,从而维持多页面共存状态。

1、在header.html中编写导航链接:关于我们

2、确保target值与目标name属性完全一致,例如contentFrame

3、在main.html中放置初始内容,作为框架默认加载的主视图区域。

4、若需从框架内页面刷新整个窗口,可使用target="_top"或JavaScript调用top.location.href

四、处理不支持框架的浏览器回退方案

现代浏览器虽仍解析,但部分设备或辅助技术可能忽略该结构,需提供</code>备用内容。</p><p>1、在<code><frameset></code>闭合标签后立即插入<code><noframes></code>标签。</p><p>2、在<code><noframes></code>内部添加<code><body></code>标签,并写入提示文字:“您的浏览器不支持框架,请访问<strong><font color="green">首页入口页面</font></strong>获取完整导航。”</p><p>3、在提示文字中嵌入指向<code>index.html</code>的超链接,确保所有用户均可访问核心内容。</p><p>4、将<code><noframes></code>内容置于<code><frameset></code>之外、<code></html></code>之前,保证HTML结构合法性。</p><h2>五、避免框架嵌套与SEO陷阱</h2><p>深层框架嵌套会导致URL不可追踪、历史记录混乱及搜索引擎索引失效,应严格限制层级并确保每个框架页具备独立可访问性。</p><p>1、禁止在任一<code><frame></code>所加载的HTML文档中再次使用<code><frameset></code>。</p><p>2、为每个框架页面单独编写<code><title></code>,例如<code><title>顶部导航栏 - 网站名称</title></code>。</p><p>3、在所有框架页面的<code><head></code>中加入<code><meta name="robots" content="noindex, nofollow"></code>,防止搜索引擎将子框架页误判为主入口。</p><p>4、确保<code>header.html</code>等框架页可通过直接URL访问,且不依赖父框架环境运行。</p><p>以上就是本文的全部内容了,是否有顺利帮助你解决问题?若是能给你带来学习上的帮助,请大家多多支持golang学习网!更多关于文章的相关知识,也可关注golang学习网公众号。</p> </div> <div class="labsList"> </div> </div> <!-- 最新阅读 --> <div class="contBoxNor"> <div class="contTit"> <div class="tit">相关阅读</div> <a href="/articlelist.html" class="more">更多&gt;</a> </div> <ul class="latestReadList"> <li> <div class="info"> <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1年前&nbsp;&nbsp;|&nbsp;&nbsp; <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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;2个月前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;2个月前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;2个月前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;2个月前&nbsp;&nbsp;|&nbsp;&nbsp; </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">更多&gt;</a> </div> <ul class="latestReadList"> <li> <div class="info"> <a href="/articlelist/19_new_0_1.html" class="aLightGray" title="文章">文章</a>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;13小时前&nbsp;&nbsp;|&nbsp;&nbsp; </div> <div class="tit lineOverflow"><a href="/article/621121.html" title="CSS @scope 怎么限制组件样式泄漏:嵌套范围、优先级与降级检查" class="aBlack">CSS @scope 怎么限制组件样式泄漏:嵌套范围、优先级与降级检查</a></div> <div class="opt"> <span><i class="view"></i>366</span> <span class="collectBtn user_collection" data-id="621121" 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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1天前&nbsp;&nbsp;|&nbsp;&nbsp; <a href="/articletag/243_new_0_1.html" class="aLightGray" title="前端">前端</a>&nbsp;· <a href="/articletag/4729_new_0_1.html" class="aLightGray" title="css">css</a>&nbsp;· <a href="/articletag/39796_new_0_1.html" class="aLightGray" title="表单">表单</a>&nbsp;· <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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1天前&nbsp;&nbsp;|&nbsp;&nbsp; <a href="/articletag/4701_new_0_1.html" class="aLightGray" title="javascript">javascript</a>&nbsp;· <a href="/articletag/39953_new_0_1.html" class="aLightGray" title="前端工程">前端工程</a>&nbsp;· <a href="/articletag/40054_new_0_1.html" class="aLightGray" title="浏览器API">浏览器API</a>&nbsp;· <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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1天前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1天前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1天前&nbsp;&nbsp;|&nbsp;&nbsp; <a href="/articletag/4729_new_0_1.html" class="aLightGray" title="css">css</a>&nbsp;· <a href="/articletag/5401_new_0_1.html" class="aLightGray" title="前端开发">前端开发</a>&nbsp;· <a href="/articletag/40634_new_0_1.html" class="aLightGray" title="无障碍设计">无障碍设计</a>&nbsp;· <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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1天前&nbsp;&nbsp;|&nbsp;&nbsp; <a href="/articletag/4729_new_0_1.html" class="aLightGray" title="css">css</a>&nbsp;· <a href="/articletag/5401_new_0_1.html" class="aLightGray" title="前端开发">前端开发</a>&nbsp;· <a href="/articletag/40634_new_0_1.html" class="aLightGray" title="无障碍设计">无障碍设计</a>&nbsp;· <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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;3天前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;3天前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;3天前&nbsp;&nbsp;|&nbsp;&nbsp; </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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1星期前&nbsp;&nbsp;|&nbsp;&nbsp; <a href="/articletag/243_new_0_1.html" class="aLightGray" title="前端">前端</a>&nbsp;· <a href="/articletag/861_new_0_1.html" class="aLightGray" title="性能">性能</a>&nbsp;· <a href="/articletag/2436_new_0_1.html" class="aLightGray" title="异步任务">异步任务</a>&nbsp;· <a href="/articletag/40548_new_0_1.html" class="aLightGray" title="对象存储">对象存储</a>&nbsp;· <a href="/articletag/40552_new_0_1.html" class="aLightGray" title="文件导出">文件导出</a>&nbsp;· <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>&nbsp;· <a href="/articlelist/88_new_0_1.html" class="aLightGray" title="前端">前端</a> &nbsp;&nbsp;|&nbsp;&nbsp;1星期前&nbsp;&nbsp;|&nbsp;&nbsp; </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> </ul> </div> <!-- 课程推荐 --> <div class="contBoxNor"> <div class="contTit"> <div class="tit">课程推荐</div> <a href="/courselist.html" class="more">更多&gt;</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>