HTML <noframes> 标签
正在学习：<![CDATA[</p>
<div class="search-banner">
<form name="search" method="post" action="/e/search/index.php" class="search-form">
<input type="text" name="keyboard" id="keyboard" class="input_text"
value="请输入关键字词"
style="color: rgb(153, 153, 153);"
onFocus="if(value=='请输入关键字词'){this.style.color='#000';value=''}"
onBlur="if(value==''){this.style.color='#999';value='请输入关键字词'}">
<select id="templateSelect" class="template-select">
<option value="1">全站搜索</option>
<option value="2">教程搜索</option>
<option value="3">源码搜索</option>
</select>
<button type="submit" class="input_submit">搜索</button>
<input type="hidden" name="show" value="title,newstext">
<input type="hidden" name="tbname" value="news">
<input type="hidden" id="tempid" name="tempid" value="1">
<input type="hidden" id="classid" name="classid" value="0">
<input type="hidden" id="searchtype" name="searchtype" value="full">
</form>
</div>
<script src="https://www.ebingou.cn/skin/suosuo/suo.js"></script>
</div>
</div>
<div class="container">
<aside class="nyleft-sidebar">
<h3>全部教程</h3>
<ul class="article-list">
<li><a href="https://www.ebingou.cn/biancheng/html/html-tutorial.html" class=""><strong>HTML 教程</strong></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/what-is-html.html" class="">HTML 介绍</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-text-editors.html" class="">HTML 文本编辑器</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-building-blocks.html" class="">HTML 结构</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-tags.html" class="">HTML 标签</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-attributes.html" class="">HTML 属性</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-elements.html" class="">HTML 元素</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-heading.html" class="">HTML 标题</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-paragraph.html" class="">HTML 段落</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-phrase-tags.html" class="">HTML 短语标签</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-anchor.html" class="">HTML 锚元素</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-image.html" class="">HTML 图像</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-table.html" class="">HTML 表格</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-lists.html" class="">HTML 列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-ordered-list.html" class="">HTML 有序列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-unordered-list.html" class="">HTML 无序列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-description-list.html" class="">HTML 描述列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-with-css.html" class="">HTML CSS</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-classes.html" class="">HTML class</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/id-attribute.html" class="">HTML id</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/iframes.html" class="">HTML iframes 框架</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/javascript.html" class="">HTML JavaScript 脚本</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/comments.html" class="">HTML 注释</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/file-path.html" class="">HTML 文件路径</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/head.html" class="">HTML Head 头部</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/layout.html" class="">HTML Layouts 布局</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/layout-techniques.html" class="">HTML 布局设计</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/responsive.html" class="">HTML 响应式</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/computercode.html" class="">HTML 代码展示标签</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/entities.html" class="">HTML Entities 实体</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/symbols.html" class="">HTML 符号</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/charset.html" class="">HTML 字符编码</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/url-encode.html" class="">HTML URL 编码</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/end.html" class="">HTML 结束</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/introduction-global-attributes.html" class=""><strong>HTML 全局属性</strong></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/event-attributes.html" class="">HTML 事件属性</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/reference-manual.html" class=""><strong>HTML 参考手册</strong></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tags-reference-guide.html" class="">HTML 标签列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/global-attributes.html" class="">HTML 全局属性列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/element-specific-attributes.html" class="">HTML 按元素划分的属性列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/attribute-values-alphabetical.html" class="">HTML 属性值列表</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tag.html" class="">HTML <!-- -->注释标签</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/doctype.html" class="">DOCTYPE</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tag-a.html" class=""><a></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/abbr.html" class=""><abbr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/acronym-tag.html" class=""><acronym></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/address-tag.html" class=""><address></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/applet-tag.html" class=""><applet></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/area-tag.html" class=""><area></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/article-tag.html" class=""><article></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/aside-tag.html" class=""><aside></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/audio.html" class=""><audio></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/b-tag.html" class=""><b></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/base-tag.html" class=""><base></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/basefont-tag.html" class=""><basefont></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/bdi-tag.html" class=""><bdi></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/bdo-tag.html" class=""><bdo></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/big-tag.html" class=""><big></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/blockquote-tag.html" class=""><blockquote></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/blink-tag.html" class=""><blink></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/body-tag.html" class=""><body></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/br-tag.html" class=""><br></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/button-tag.html" class=""><button></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/canvas-tag.html" class=""><canvas></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/caption-tag.html" class=""><caption></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/center-tag.html" class=""><center></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/cite-tag.html" class=""><cite></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/code-tag.html" class=""><code></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/col-tag.html" class=""><col></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/colgroup-tag.html" class=""><colgroup></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/data-tag.html" class=""><data></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/datalist-tag.html" class=""><datalist></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/dd-tag.html" class=""><dd></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/del-tag.html" class=""><del></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/details-tag.html" class=""><details></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/dfn-tag.html" class=""><dfn></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/dialog-tag.html" class=""><dialog></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/dir-tag.html" class=""><dir></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/div-tag.html" class=""><div></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/dl-tag.html" class=""><dl></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/dt-tag.html" class=""><dt></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/em-tag.html" class=""><em></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/embed-tag.html" class=""><embed></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/fieldset-tag.html" class=""><fieldset></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/figcaption-tag.html" class=""><figcaption></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/figure-tag.html" class=""><figure></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/font-tag.html" class=""><font></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/footer-tag.html" class=""><footer></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/form-tag.html" class=""><form></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/frame-tag.html" class=""><frame></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/frameset-tag.html" class=""><frameset></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/h1-h6-tag.html" class=""><h1>到<h6></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/head-tag.html" class=""><head></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/header-tag.html" class=""><header></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/hr-tag.html" class=""><hr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-tag.html" class=""><html></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/i-tag.html" class=""><i></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/iframe-tag.html" class=""><iframe></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/img-tag.html" class=""><img></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/input-tag.html" class=""><input></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/ins-tag.html" class=""><ins></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/isindex-tag.html" class=""><isindex></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/kbd-tag.html" class=""><kbd></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/keygen-tag.html" class=""><keygen></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/label-tag.html" class=""><label></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/legend-tag.html" class=""><legend></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/li-tag.html" class=""><li></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/link-tag.html" class=""><link></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/main-tag.html" class=""><main></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/map-tag.html" class=""><map></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/marquee-tag.html" class=""><marquee></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/menu-tag.html" class=""><menu></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/menuitem-tag.html" class=""><menuitem></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/meta-tag.html" class=""><meta></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/meter-tag.html" class=""><meter></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/nav-tag.html" class=""><nav></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/noframes-tag.html" class=""><noframes></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/nobr-tag.html" class=""><nobr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/noscript-tag.html" class=""><noscript></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/object-tag.html" class=""><object></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/ol-tag.html" class=""><ol></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/optgroup-tag.html" class=""><optgroup></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/option-tag.html" class=""><option></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/output-tag.html" class=""><output></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/p-tag.html" class=""><p></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/param-tag.html" class=""><param></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/plaintext-tag.html" class=""><plaintext></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/picture-tag.html" class=""><picture></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/pre-tag.html" class=""><pre></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/progress-tag.html" class=""><progress></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/q-tag.html" class=""><q></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/rp-tag.html" class=""><rp></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/rb-tag.html" class=""><rb></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/rt-tag.html" class=""><rt></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/rtc-tag.html" class=""><rtc></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/ruby-tag.html" class=""><ruby></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/s-tag.html" class=""><s></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/samp-tag.html" class=""><samp></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/script-tag.html" class=""><script></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/section-tag.html" class=""><section></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/select-tag.html" class=""><select></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/small-tag.html" class=""><small></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/source-tag.html" class=""><source></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/span-tag.html" class=""><span></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/spacer-tag.html" class=""><spacer></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/strike-tag.html" class=""><strike></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/strong-tag.html" class="">strong</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/style-tag.html" class=""><style></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/sub-tag.html" class=""><sub></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/summary-tag.html" class=""><summary></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/sup-tag.html" class=""><sup></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/svg-tag.html" class=""><svg></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/table-tag.html" class=""><table></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tbody-tag.html" class=""><tbody></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/td-tag.html" class=""><td></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/template-tag.html" class=""><template></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/textarea-tag.html" class=""><textarea></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tfoot-tag.html" class=""><tfoot></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/th-tag.html" class=""><th></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/thead-tag.html" class=""><thead></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/time-tag.html" class=""><time></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/title-tag.html" class=""><title></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tr-tag.html" class=""><tr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/track-tag.html" class=""><track></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tt-tag.html" class=""><tt></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/u-tag.html" class=""><u></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/var-tag.html" class=""><var></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/video-tag.html" class=""><video></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/wbr-tag.html" class=""><wbr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/xmp-tag.html" class=""><xmp></a></li>
</ul>
</aside>
<main class="nymain-content">
<div class="breadcrumb">
您现在位置<span>></span> <a href="https://www.ebingou.cn/">首页</a> > <a href="https://www.ebingou.cn/biancheng/">编程</a> > <a href="https://www.ebingou.cn/biancheng/htmlcss/">HTML CSS</a> > <a href="https://www.ebingou.cn/biancheng/htmlcss/html/">HTML</a> </div>
<div class="article-nav">
<span class="prev-article">
<a href="https://www.ebingou.cn/biancheng/html/nav-tag.html">← <nav></a>
</span>
<span class="next-article">
<a href="https://www.ebingou.cn/biancheng/html/nobr-tag.html"><nobr> →</a>
</span>
</div>
<article class="article">
<header class="article-header">
<h1>HTML <noframes> 标签</h1>
<div class="nyarticle-meta">
<div class="avatar">著</div>
<span>原创</span>
<span>2025-09-17</span>
<span><a rel="nofollow" href="https://www.ebingou.cn/biancheng/htmlcss/html/">HTML</a></span>
<span>已有<script src=https://www.ebingou.cn/e/public/ViewClick/?classid=35&id=17239&addclick=1></script>人查阅</span>
</div>
</header>
<div class="article-content">
<h2>HTML <noframes> 标签解析与替代方案</h2>
<h3>什么是 noframes 标签？</h3>
<p>在早期网页开发中，<code><noframes></code> 标签用于为不支持框架（frame）的浏览器提供替代内容。当浏览器无法渲染 <code><frame></code> 或 <code><frameset></code> 时，就会显示 <code><noframes></code> 中的内容。如果浏览器支持框架，则会忽略 <code><noframes></code> 内的所有内容。</p>
<p>需要特别注意的是，<strong><code><noframes></code> 标签已被弃用</strong>，HTML5 标准不再支持该标签，现在网页开发中应当避免使用。</p>
<h3>基本语法与使用场景</h3>
<pre>
<code class="language-html"><!DOCTYPE html>
<html>
<head>
<title>代码号编程学习 - noframes示例</title>
</head>
<frameset cols="50%,50%">
<frame src="html-content.html">
<frame src="css-content.html">
<noframes>
<p>抱歉！您的浏览器不支持框架技术。</p>
<p>请访问<a href="https://www.ebingou.cn/biancheng/">代码号编程学习平台</a>获取更多内容。</p>
</noframes>
</frameset>
</html></code></pre><button class="try-code-btn" onclick="runCode(this)" title="在线运行编程代码示例">试试在线运行代码</button>
<h3>为什么 noframes 被弃用？</h3>
<p>从我多年的前端开发经验来看，<code><noframes></code> 标签被淘汰主要有以下几个原因：</p>
<ol start="1">
<li>
<p><strong>框架技术过时</strong>：现在网页开发已很少使用框架布局，取而代之的是更灵活的 CSS 布局技术</p>
</li>
<li>
<p><strong>可用性问题</strong>：框架破坏了 URL 结构，导致无法直接链接到特定内容</p>
</li>
<li>
<p><strong>SEO 不友好</strong>：搜索引擎难以正确索引框架内容</p>
</li>
<li>
<p><strong>移动端兼容性差</strong>：框架在移动设备上表现不佳，无法适应不同屏幕尺寸</p>
</li>
<li>
<p><strong>可访问性限制</strong>：屏幕阅读器等辅助技术难以处理框架内容</p>
</li>
</ol>
<h3>现在替代方案</h3>
<h4>使用 CSS 和 JavaScript 实现类似效果</h4>
<pre>
<code class="language-html"><!DOCTYPE html>
<html>
<head>
<title>代码号教程 - 现在布局方案</title>
<style>
.container {
display: flex;
width: 100%;
height: 100vh;
}
.panel {
flex: 1;
padding: 20px;
overflow: auto;
border: 1px solid #ddd;
}
.no-flexbox-message {
display: none;
padding: 20px;
background-color: #f8d7da;
color: #721c24;
}
/* 检测浏览器是否不支持flexbox */
@media not all and (display: flex) {
.container { display: none; }
.no-flexbox-message { display: block; }
}
</style>
</head>
<body>
<div class="container">
<div class="panel" id="html-content">
<h2>HTML学习资源</h2>
<p>欢迎学习HTML基础知识，这是代码号编程教程的第一部分。</p>
</div>
<div class="panel" id="css-content">
<h2>CSS学习资源</h2>
<p>CSS样式表教程，帮助您创建美观的网页布局。</p>
</div>
</div>
<div class="no-flexbox-message">
<p>您的浏览器不支持现在布局技术。</p>
<p>建议升级浏览器或访问<a href="https://www.ebingou.cn/jiaocheng/">代码号教程页面</a>获取更多学习资源。</p>
</div>
<script>
// 动态加载内容
document.addEventListener('DOMContentLoaded', function() {
// 这里可以使用AJAX加载实际内容
document.getElementById('html-content').innerHTML +=
'<p>更多HTML内容将通过JavaScript动态加载...</p>';
document.getElementById('css-content').innerHTML +=
'<p>更多CSS内容将通过JavaScript动态加载...</p>';
});
</script>
</body>
</html></code></pre><button class="try-code-btn" onclick="runCode(this)" title="在线运行编程代码示例">试试在线运行代码</button>
<h4>使用 iframe 的降级方案</h4>
<p>虽然 iframe 仍然可用，但建议谨慎使用：</p>
<pre>
<code class="language-html"><!DOCTYPE html>
<html>
<head>
<title>代码号源码学习 - iframe示例</title>
</head>
<body>
<iframe src="html-content.html" style="width:100%; height:300px; border:none;">
<div style="padding:20px; background:#f0f0f0;">
<p>您的浏览器不支持iframe功能。</p>
<p>请直接访问<a href="html-content.html">HTML学习内容</a></p>
</div>
</iframe>
</body>
</html></code></pre><button class="try-code-btn" onclick="runCode(this)" title="在线运行编程代码示例">试试在线运行代码</button>
<h3>本节课程知识要点</h3>
<ol start="1">
<li>
<p><strong>避免使用过时技术</strong>：<code><noframes></code> 和 <code><frameset></code> 已被现在标准淘汰</p>
</li>
<li>
<p><strong>渐进增强原则</strong>：先构建基础功能，再为现在浏览器添加增强体验</p>
</li>
<li>
<p><strong>优雅降级策略</strong>：确保即使某些功能不被支持，用户仍能访问核心内容</p>
</li>
<li>
<p><strong>使用特性检测</strong>：通过 CSS 和 JavaScript 检测浏览器功能，提供替代方案</p>
</li>
<li>
<p><strong>关注可访问性</strong>：确保所有用户都能访问内容，无论使用何种浏览器或设备</p>
</li>
</ol>
<h3>实际开发建议</h3>
<p>根据我的项目经验，处理浏览器兼容性问题时，建议采用以下方法：</p>
<ol start="1">
<li>
<p><strong>使用 Modernizr 等特性检测库</strong>：可以系统性地检测浏览器功能支持情况</p>
</li>
<li>
<p><strong>采用 CSS 特性查询</strong>：使用 <code>@supports</code> 规则为支持特定功能的浏览器提供增强样式</p>
</li>
<li>
<p><strong>提供多版本内容</strong>：对于重要功能，可以考虑提供简化版和增强版两种体验</p>
</li>
</ol>
<pre>
<code class="language-css">/* 使用@supports进行特性检测 */
@supports (display: grid) {
.container {
display: grid;
grid-template-columns: 1fr 1fr;
}
}
@supports not (display: grid) {
.container {
display: flex;
flex-wrap: wrap;
}
}</code></pre>
<h3>浏览器兼容性说明</h3>
<p>虽然大多数现在浏览器仍然识别 <code><noframes></code> 标签，但由于框架技术本身已被淘汰，这些标签的实际作用非常有限。建议将重点放在现在网页标准上，如 Flexbox、Grid 布局和响应式设计。</p>
<p>虽然了解 <code><noframes></code> 标签的历史作用有助于理解网页技术的发展，但在项目开发中应当避免使用这些过时技术。现在网页开发更加注重语义化标记、响应式设计和渐进增强原则。</p>
<div class="article-tags">
<b>本文标签：</b> </div>
</div>
<div class="article-nav">
<span class="prev-article">
<a href="https://www.ebingou.cn/biancheng/html/nav-tag.html">← <nav></a>
</span>
<span class="next-article">
<a href="https://www.ebingou.cn/biancheng/html/nobr-tag.html"><nobr> →</a>
</span>
</div>
<input type="checkbox" id="modal-toggle" aria-hidden="true">
<main style="width:100%;text-align:center;">
<label for="modal-toggle" class="sponsor-btn" role="button" aria-label="打开助力">疯狂暗示打赏按钮</label>
</main>
<div class="modal">
<div class="modal-content">
<label for="modal-toggle" class="close-btn" aria-label="关闭弹窗">×</label>
<div class="modal-header">
<h2 style="margin:0;font-size:18px;font-weight:600;color:#333;">感谢您的认可和支持</h2>
</div>
<div class="modal-body">
<div class="qrcode-grid">
<div class="qrcode-item">
<div class="qrcode-img-container">
<img src="/shang/shang.jpg"
alt="微信支付二维码 - 长按识别"
class="qrcode-img"
loading="lazy">
</div>
<p style="margin-top:8px;color:#555;">微信</p>
</div>
<div class="qrcode-item">
<div class="qrcode-img-container">
<img src="/shang/shang2.jpg"
alt="支付宝二维码 - 长按识别"
class="qrcode-img"
loading="lazy">
</div>
<p style="margin-top:8px;color:#555;">支付宝</p>
</div>
</div>
</div>
<div class="modal-footer">
持续输出优质内容需要动力，您的每一个打赏都是深夜码字时的温暖咖啡☕
</div>
</div>
</div>
<div class="comments-section">
<div id="comments" class="comments">
<div id="comment_post" class="compost">
<div class="cp_post">
<link href="https://www.ebingou.cn/skin/ecmspl/css/pl.css" rel="stylesheet">
<div class="showpage" id="plpost">
<table style="line-height: 25px; padding: 5px 3px 1px 8px; font-size: 18px;" width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr><td><strong><font color="#333333">分享笔记
（共有 <span id="infocommentnumarea"><script type="text/javascript" src="https://www.ebingou.cn/e/public/ViewClick/?classid=35&id=17239&down=2"></script></span> 篇笔记）</font></strong></td></tr>
</tbody></table>
<script>
function CheckPl(obj)
{
if(obj.saytext.value=="")
{
alert("您没什么话要说吗？");
obj.saytext.focus();
return false;
}
return true;
}
</script>
<form action="https://www.ebingou.cn/e/pl/doaction.php" method="post" name="saypl" id="saypl" onSubmit="return CheckPl(document.saypl)">
<table id="plpost" width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td>
<table width="100%" cellspacing="10" cellpadding="0" border="0">
<tbody><tr>
<td>
<script src="https://www.ebingou.cn/e/pl/test.php"></script>
<textarea name="saytext" rows="6" id="saytext" placeholder="说点什么吧？分享此刻你的理解！"></textarea>
<script src="https://www.ebingou.cn/skin/ecmspl/js/plface.js"></script>
<table width="100%" cellspacing="1" cellpadding="3" bgcolor="#FFF" align="left">
<tbody><tr>
<td width="80%" height="40" bgcolor="#FFFFFF">验证码：<input name="key" type="text" class="inputText" size="16">
<img src="https://www.ebingou.cn/e/ShowKey/?v=pl" align="absmiddle" name="plKeyImg" id="plKeyImg" onClick="plKeyImg.src='https://www.ebingou.cn/e/ShowKey/?v=pl&t='+Math.random()" title="看不清楚,点击刷新" />
</td>
<td width="20%" height="40" bgcolor="#FFFFFF">
<input name="sumbit" type="submit" value="提交笔记" tabindex="6" style="border-radius: 5px;font-size: 16px;background: #e94c3d none repeat scroll 0% 0%;border: 0px none;margin: 0px 16px;padding: 1px 16px;height: 33px;line-height: 30px;color: rgb(255, 255, 255);opacity: 0.95;">
<input name="id" type="hidden" id="id" value="17239" />
<input name="classid" type="hidden" id="classid" value="35" />
<input name="enews" type="hidden" id="enews" value="AddPl" />
<input name="repid" type="hidden" id="repid" value="0" />
<input type="hidden" name="ecmsfrom" value="https://www.ebingou.cn/biancheng/html/noframes-tag.html">
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table></form>
<script src=https://www.ebingou.cn/e/pl/more?classid=35&id=17239&num=10></script>
</div>
</div>
</div>
</div>
</div>
</article>
</main>
<aside class="nyright-sidebar">
<div class="sidebar-block category-menu">
<h3>全部课程</h3>
<div class="sub-categories">
<ul class="sidebar-list">
<a href="https://www.ebingou.cn/biancheng/htmlcss/">HTML CSS</a>
<a href="https://www.ebingou.cn/biancheng/js/">JS</a>
<a href="https://www.ebingou.cn/biancheng/houduan/">后端编程</a>
</ul>
</div>
</div>
<div class="sidebar-block">
<h3>课程速递</h3>
<ul class="sidebar-list">
<li><a href="https://www.ebingou.cn/biancheng/html/xmp-tag.html" class="text-ellipsis"><xmp></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/wbr-tag.html" class="text-ellipsis"><wbr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/video-tag.html" class="text-ellipsis"><video></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/var-tag.html" class="text-ellipsis"><var></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/u-tag.html" class="text-ellipsis"><u></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tt-tag.html" class="text-ellipsis"><tt></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/track-tag.html" class="text-ellipsis"><track></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/tr-tag.html" class="text-ellipsis"><tr></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/title-tag.html" class="text-ellipsis"><title></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/time-tag.html" class="text-ellipsis"><time></a></li>
</ul>
</div>
<div class="sidebar-block">
<h3>大家在学</h3>
<ul class="sidebar-list">
<li><a href="https://www.ebingou.cn/biancheng/html/header-tag.html" class="text-ellipsis"><header></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/br-tag.html" class="text-ellipsis"><br></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/link-tag.html" class="text-ellipsis"><link></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/spacer-tag.html" class="text-ellipsis"><spacer></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/span-tag.html" class="text-ellipsis"><span></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/body-tag.html" class="text-ellipsis"><body></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/main-tag.html" class="text-ellipsis"><main></a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/strong-tag.html" class="text-ellipsis">strong</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/charset.html" class="text-ellipsis">HTML 字符编码</a></li>
<li><a href="https://www.ebingou.cn/biancheng/html/html-building-blocks.html" class="text-ellipsis">HTML 结构</a></li>
</ul>
</div>
<div class="sidebar-block">
<h3>热门标签</h3>
<div class="tags-cloud">
<a href="/topic/zhimengcmsmima.html" class="tag">织梦cms密码</a>
<a href="/topic/zhimengcmshoutai.html" class="tag">织梦cms后台</a>
<a href="/topic/zhimengcmsfangzhan.html" class="tag">织梦cms仿站</a>
<a href="/topic/zhimengcmsjianzhan.html" class="tag">织梦cms建站</a>
<a href="/topic/zhimengcmsbiaoqian.html" class="tag">织梦cms标签</a>
<a href="/topic/zhimengcmscaiji.html" class="tag">织梦cms采集</a>
<a href="/topic/zhimengcms.html" class="tag">织梦cms</a>
<a href="/topic/diguocmsyoujianpeizhi.html" class="tag">帝国cms邮件配置</a>
<a href="/topic/diguocmswoijingtai.html" class="tag">帝国cms伪静态</a>
<a href="/topic/diguocmsdaohangdiaoyong.html" class="tag">帝国cms导航调用</a>
<a href="/topic/diguocmsbiaoti.html" class="tag">帝国cms标题</a>
<a href="/topic/diguocmsxiangguandiaoyong.html" class="tag">帝国cms相关调用</a>
<a href="/topic/diguocmshuiyuanxitong.html" class="tag">帝国cms会员系统</a>
<a href="/topic/diguocmsziduan.html" class="tag">帝国cms字段</a>
<a href="/topic/diguocmsgongnengkaifa.html" class="tag">帝国cms功能开发</a>
<a href="/topic/diguocmschangjianbaocuo.html" class="tag">帝国cms常见报错</a>
<a href="/topic/diguocmsshujubiao.html" class="tag">帝国cms数据表</a>
<a href="/topic/diguocmsshoujizhan.html" class="tag">帝国cms手机站</a>
<a href="/topic/diguocmsanquanshezhi.html" class="tag">帝国cms安全设置</a>
<a href="/topic/diguocmschangjianwenti.html" class="tag">帝国cms常见问题</a>
</div>
</div>
</aside>
</div>
<footer>
<div class="footer-container">
<div class="footer-declaration">
<p><b>站点声明：</b></p>
<p>1、本站中涉及的专业知识仅属于个人见解，用户自行甄别可行性，本站不负任何责任。</p>
<p>2、所有文章未经授权禁止转载、摘编、复制或建立镜像，如有违反，追究法律责任。廉正举报站内留言</p>
<p>3、标注「原创」作品受《著作权法》保护，禁止任何形式未经书面授权的篡改、商业使用或镜像复制。</p>
</div>
<div class="copyright">
<p>Copyright © <a href="https://www.ebingou.cn/" title="代码号" rel="nofollow" target="_blank">代码号</a>原创设计 All Rights Reserved | <a rel="nofollow" href="https://beian.miit.gov.cn/" target="_blank">皖ICP备2022014118号-1</a></p>
<p><a href="/about-us/" rel="nofollow" target="_blank">关于我们</a> | <a href="/about-us/join-us/" rel="nofollow" target="_blank">加入我们</a> | <a href="/about-us/nrsm/" rel="nofollow" target="_blank">内容声明</a> | <a href="/about-us/statement/" rel="nofollow" target="_blank">版权声明</a> | <a href="https://www.ebingou.cn/latest/" target="_blank">最新文章</a></p>
</div>
</div>
</footer>
<div class="fixed-buttons">
<div class="fixed-btn wechat">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
</svg>
<div class="wechat-qrcode">
<img src="https://www.ebingou.cn/skin/ebingou/images/wx.png" alt="微信公众号">
</div>
</div>
<div class="fixed-btn fullscreen" onclick="toggleFullScreen()">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="15 3 21 3 21 9"></polyline>
<polyline points="9 21 3 21 3 15"></polyline>
<line x1="21" y1="3" x2="14" y2="10"></line>
<line x1="3" y1="21" x2="10" y2="14"></line>
</svg>
</div>
<a href="#header" class="fixed-btn">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="18 15 12 9 6 15"></polyline>
</svg>
</a>
</div>
<script src="https://www.ebingou.cn/skin/program/js/biancheng.js" type="text/javascript"></script>
<script src="https://www.ebingou.cn/skin/suosuo/tiao.js"></script>
</body>
</html>]]>