本文概括HTML常用标记列表、名称和意义以及详细解释，包括文件标记、排版标记、字体标记、清单标记、表格标记、表单标记、图形标记、链接标记、框架标记、影像地图、多媒体标记和其它标记，特别声明，本文转自网络
HTML标记一览表
| 标记 | 类型 | 名称或意义 | 作用 | 备注 |
| 文件标记 |
| ● | 文件宣告 | 让浏览器知道这是 HTML 文件 | |
| ● | 开头 | 提供文件整体信息 | |
| </td><td>●</td><td>标题</td><td>定义文件标题，将显示于浏览器顶端</td><td> </td></tr><tr><td><body></td><td>●</td><td>主体</td><td>设计文件格式及内容所在</td><td> </td></tr><tr><td colspan="5"><strong>排版标记</strong></td></tr><tr><td><!--注解--></td><td>○</td><td>说明标记</td><td>为文件加上说明，但不被显示</td><td> </td></tr><tr><td><p></td><td>○</td><td>段落标记</td><td>为字、图、表格等之间留下一空白行</td><td> </td></tr><tr><td><br></td><td>○</td><td>换行标记</td><td>令字、图、表格显示于下一行</td><td> </td></tr><tr><td><hr></td><td>○</td><td>水平线</td><td>插入一水平线</td><td> </td></tr><tr><td><center></td><td>●</td><td>居中</td><td>令字、图、表格等显示于中间</td><td>反对</td></tr><tr><td><pre class="brush:php;toolbar:false"></td><td>●</td><td>预设格式</td><td>令文件按原代码的排列方式显示</td><td> </td></tr><tr><td><div></td><td>●</td><td>定位标记</td><td>设定字、图、表格等的摆放位置</td><td> </td></tr><tr><td><nobr></td><td>●</td><td>不换行</td><td>令文字不因太长而换行</td><td> </td></tr><tr><td><wbr></td><td>●</td><td>建议换行</td><td>预设换行部位</td><td> </td></tr><tr><td colspan="5">字体标记</td></tr><tr><td><strong></td><td>●</td><td>加重语气</td><td>产生字体加粗 Bold 的效果</td><td> </td></tr><tr><td><b></td><td>●</td><td>粗体标记</td><td>产生字体加粗的效果</td><td> </td></tr><tr><td><em></td><td>●</td><td>强调标记</td><td>字体出现斜体效果</td><td> </td></tr><tr><td><i></td><td>●</td><td>斜体标记</td><td>字体出现斜体效果</td><td> </td></tr><tr><td><tt></td><td>●</td><td>等宽字体</td><td>Courier字体，字母宽度相同</td><td> </td></tr><tr><td><u></td><td>●</td><td>加下划线</td><td>加下划线</td><td>反对</td></tr><tr><td><h1></td><td>●</td><td>一级标题标记</td><td>将字体变大，级数越高越小</td><td> </td></tr><tr><td><h2></td><td>●</td><td>二级标题标记</td><td>将字体变大</td><td> </td></tr><tr><td><h3></td><td>●</td><td>三级标题标记</td><td>将字体变大</td><td> </td></tr><tr><td><h4></td><td>●</td><td>四级标题标记</td><td>将字体变大</td><td> </td></tr><tr><td><h5></td><td>●</td><td>五级标题标记</td><td>将字体变大</td><td> </td></tr><tr><td><h6></td><td>●</td><td>六级标题标记</td><td>将字体变大</td><td> </td></tr><tr><td><font></td><td>●</td><td>字体标记</td><td>设定字体、大小、颜色</td><td>反对</td></tr><tr><td><basefont></td><td>○</td><td>基准字体标记</td><td>设定所有字体、大小、颜色</td><td>反对</td></tr><tr><td><big></td><td>●</td><td>字体加大</td><td>令字体稍微变大</td><td> </td></tr><tr><td><small></td><td>●</td><td>字体缩小</td><td>令字体稍微缩小</td><td> </td></tr><tr><td><strike></td><td>●</td><td>加删除线</td><td>为文字加删除线</td><td>反对</td></tr><tr><td><code></td><td>●</td><td>程式码</td><td>字体稍微加宽如<tt></td><td> </td></tr><tr><td><kbd></td><td>●</td><td>键盘字</td><td>字体稍微加宽，单一空白</td><td> </td></tr><tr><td><samp></td><td>●</td><td>范例</td><td>字w稍榧如<tt></td><td> </td></tr><tr><td><var></td><td>●</td><td>变量</td><td>斜体效果</td><td> </td></tr><tr><td><cite></td><td>●</td><td>斜体标记</td><td>斜体效果</td><td> </td></tr><tr><td><blockquote></td><td>●</td><td>向右缩排</td><td>文字向右缩排</td><td> </td></tr><tr><td><dfn></td><td>●</td><td>述语定义</td><td>斜体效果</td><td> </td></tr><tr><td><address></td><td>●</td><td>地址标记</td><td>斜体效果</td><td> </td></tr><tr><td><sub></td><td>●</td><td>下标字</td><td>文字下标</td><td> </td></tr><tr><td><sup></td><td>●</td><td>上标字</td><td>文字上标</td><td> </td></tr><tr><td colspan="5"><strong>清单标记</strong></td></tr><tr><td><ol></td><td>●</td><td>顺序清单</td><td>清单项目将以数字、字母顺序排列</td><td> </td></tr><tr><td><ul></td><td>●</td><td>无序清单</td><td>清单项目将以实心圆点作为符号排列</td><td> </td></tr><tr><td><li></td><td>○</td><td>清单项目</td><td>清单中的项目，一个标记一行</td><td> </td></tr><tr><td><menu></td><td>●</td><td>选项清单</td><td>可用type参数指定项目符号。</td><td>反对</td></tr><tr><td><dir></td><td>●</td><td>目录清单</td><td>与<menu>相同</td><td>反对</td></tr><tr><td><dl></td><td>●</td><td>定义清单</td><td>清单分两层出现</td><td> </td></tr><tr><td><dt></td><td>○</td><td>定义条目</td><td>清单项标题</td><td> </td></tr><tr><td><dd></td><td>○</td><td>定义内容</td><td>清单项内容</td><td> </td></tr><tr><td colspan="5"><strong>表格标记</strong></td></tr><tr><td><table></td><td>●</td><td>表格标记</td><td>设定该表格的各项参数</td><td> </td></tr><tr><td><caption></td><td>●</td><td>表格标题</td><td>做成一打通列以填入表格标题</td><td> </td></tr><tr><td></td></tr><tr></td><td>●</td><td>表格列</td><td>设定该表格的列</td><td> </td></tr><tr><td></td><td></td><td>●</td><td>表格栏</td><td>设定该表格的栏</td><td> </td></tr><tr><td></td><th></td></th><td>●</td><td>表格标头</td><td>相等于</td><td>，但其内文字字体会变粗</td><td> </td></tr><tr><td colspan="5"><strong>表单标记</strong></td></tr><tr><td><form></td><td>●</td><td>表单标记</td><td>决定该表单的运作模式</td><td> </td></tr><tr><td><textarea></td><td>●</td><td>文字框</td><td>提供文字输入栏</td><td> </td></tr><tr><td><input></td><td>○</td><td>输入标记</td><td>决定输入形式</td><td> </td></tr><tr><td><select></td><td>●</td><td>选择标记</td><td>建立弹出卷动清单</td><td> </td></tr><tr><td><option></td><td>○</td><td>选项</td><td>每一个清单选项</td><td> </td></tr><tr><td colspan="5"><strong>图形标记</strong></td></tr><tr><td></td><td>○</td><td>图形标记</td><td>用来插入图形及设定图形属性</td><td> </td></tr><tr><td colspan="5"><strong>链接标记</strong></td></tr><tr><td><a></td><td>●</td><td>链接标记</td><td>加入链接</td><td> </td></tr><tr><td><base></td><td>○</td><td>基准标记</td><td>可将相对 URL 转绝对及指定链接</td><td> </td></tr><tr><td colspan="5"><strong>框架标记</strong></td></tr><tr><td><frameset></td><td>●</td><td>框架设定</td><td>设定框架</td><td> </td></tr><tr><td><frame></td><td>○</td><td>窗口设定</td><td>设定框架中的窗口</td><td> </td></tr><tr><td><iframe></td><td>○</td><td>页内框架</td><td>于网页中插入框架</td><td>IE</td></tr><tr><td><noframes></td><td>●</td><td>不支持框架</td><td>设定浏览器不支持框架时的提示</td><td> </td></tr><tr><td colspan="5"><strong>影像地图</strong></td></tr><tr><td><map></td><td>●</td><td>影像地图名称</td><td>设定影像地图名称</td><td> </td></tr><tr><td><area></td><td>○</td><td>链接区域</td><td>设定各链接区域</td><td> </td></tr><tr><td colspan="5"><strong>多媒体</strong></td></tr><tr><td><bgsound></td><td>○</td><td>背景声音</td><td>令背景播放音乐或声音</td><td>IE</td></tr><tr><td><embed></td><td>○</td><td>多媒体</td><td>加入声音、音乐或影像</td><td> </td></tr><tr><td colspan="5"><strong>其他标记</strong></td></tr><tr><td><marquee></td><td>●</td><td>走马灯</td><td>令文字走动</td><td>IE</td></tr><tr><td><blink></td><td>●</td><td>闪烁文字</td><td>令文字闪烁</td><td>NC</td></tr><tr><td><isindex></td><td>○</td><td>页内寻找器</td><td>可输入关键字寻找该页</td><td>反对</td></tr><tr><td><meta></td><td>○</td><td>开头说明</td><td>提供关于此页的信息给浏览器</td><td> </td></tr><tr><td><link></td><td>○</td><td>关系定义</td><td>定义该文件与其他 URL 的关系</td><td> </td></tr><tr><td colspan="5">StyleSheet</td></tr><tr><td><style></td><td>●</td><td>式样表</td><td>控制网页版面</td><td> </td></tr><tr><td><span></td><td>●</td><td>自订标记</td><td>独立使用或与样式表一起用</td><td> </td></tr></tbody></table><p><strong>备 注： </strong></p><p>1、● 表示该标记属于围堵标记，即需要结束标记</标记>。</p><p>2、○ 表示该标记属空标记，即不需要结束标记。</p><p>3、IE 表示该标记只适应于 Internet Explorer。</p><p>4、NC 表示该标记只适用于 Netscape Communicator。</p><p>5、反对 表示该标记不为 W3C 所赞同，通常这标记是微软或网景自订，且已被大家支持，只是 HTML 标准中有其它功能相同或更好的选择。</p><p>6、弃用 表示该标记已被 W3C 所抛弃，是过时的标记，但 HTML 有向下兼容性，所以浏览器仍然支持。</p><p>7、新 表示该标记是 HTML 4.0 中新增的。<br/><br/>如果感觉不是很详细可以参考下下面的文章 <a target="_blank" href="">HTML元素(标签)大全及使用介绍</a> 都可以参考下</p><p><span style="COLOR: rgb(255,0,0)">——本文早期转自网络，无法溯源，未标明出处，特别说明。</span></p></div><p>以上就是HTML标记一览表及用法说明的详细内容，更多请关注0133技术站其它相关文章！</p></article><div class="post-actions"><a href="javascript:;" etap="like" class="post-like action action-like" data-pid="0"><i
class="fa fa-thumbs-o-up"></i>赞(<span>0</span>)</a><a href="javascript:;"
class="action action-rewards"
data-event="rewards"><i
class="fa fa-jpy"></i> 打赏</a></div><div class="post-copyright">未经允许不得转载：<a href="/">0133技术站首页</a> » <a href="/cate72/">HTML 教程</a></div><!--<div class="article-tags">标签：<a href="/archives/tag/javascript" rel="tag">JavaScript</a><a
href="/archives/tag/%e5%be%ae%e4%bf%a1" rel="tag">微信</a><a
href="/archives/tag/%e5%be%ae%e4%bf%a1%e7%9a%84%e7%89%88%e6%9c%ac%e5%8f%b7" rel="tag">微信的版本号</a><a
href="/archives/tag/%e7%89%88%e6%9c%ac%e5%8f%b7" rel="tag">版本号</a><a
href="/archives/tag/%e8%af%ad%e4%b9%89%e5%8c%96" rel="tag">语义化</a></div>--><nav class="article-nav"><span class="article-nav-prev">上一篇<br><a href="/cate72/11208629657600.html" rel="prev">纯css实现（无脚本）Html指令式tooltip文字提示效果</a></span><span class="article-nav-next">下一篇<br><a href="/cate72/11209292485225.html" rel="next">用简单的jquery+CSS创建自定义的a标签title提示tooltip</a></span></nav><div class="relates relates-thumb"><div class="title"><h3>相关文章</h3></div><ul><li><a href="/cate72/112882576100.html"><img data-src="https://ss.0133.cn/upload/article/000/000/006/5d44e0ed4c761884.jpg-160" alt="Canvas的绚烂起点" class="thumb"></a><a href="/cate72/112882576100.html">Canvas的绚烂起点</a></li><li><a href="/cate72/113285542400.html"><img data-src="https://ss.0133.cn/upload/article/000/000/006/5d5defa17baf4889.jpg-160" alt="初学指南之Canvas使用" class="thumb"></a><a href="/cate72/113285542400.html">初学指南之Canvas使用</a></li><li><a href="/cate72/113811787600.html"><img data-src="https://ss.0133.cn/upload/article/000/000/006/5d819cd9a2bf9992.jpg-160" alt="水波图实现原理" class="thumb"></a><a href="/cate72/113811787600.html">水波图实现原理</a></li><li><a href="/cate72/114273850625.html"><img data-src="https://ss.0133.cn/upload/article/000/000/013/5da524852b6e6613.jpg-160" alt="适用于任何项目的基本HTML5模板" class="thumb"></a><a href="/cate72/114273850625.html">适用于任何项目的基本HTML5模板</a></li><li><a href="/cate72/114496333025.html"><img data-src="https://ss.0133.cn/upload/article/000/000/006/5db8f13daaa98745.jpg-160" alt="10个你不知道你需要的html元素" class="thumb"></a><a href="/cate72/114496333025.html">10个你不知道你需要的html元素</a></li><li><a href="/cate72/115419128225.html"><img data-src="https://ss.0133.cn/upload/article/000/000/014/5def6610b2661508.jpg-160" alt="常见的类名id名命名参考规范" class="thumb"></a><a href="/cate72/115419128225.html">常见的类名id名命名参考规范</a></li><li><a href="/cate72/115643725625.html"><img data-src="https://ss.0133.cn/upload/article/000/000/013/5df9a2116ae78158.jpg-160" alt="HTML中16个全局属性介绍" class="thumb"></a><a href="/cate72/115643725625.html">HTML中16个全局属性介绍</a></li><li><a href="/cate72/115679089600.html"><img data-src="https://ss.0133.cn/upload/article/000/000/006/5dfae766776ca458.jpg-160" alt="html5不常用标签应用场景" class="thumb"></a><a href="/cate72/115679089600.html">html5不常用标签应用场景</a></li></ul></div><!--
<div class="title" id="comments"><h3>评论
<small>抢沙发</small></h3></div><div id="respond" class="no_webshot"><form action="return false;" method="post" id="commentform"><div class="comt"><div class="comt-title"><img data-src="https://secure.gravatar.com/avatar/?s=100&d=mm" class="avatar avatar-100"
height="50" width="50"><p><a id="cancel-comment-reply-link" href="javascript:;">取消</a></p></div><div class="comt-box"><textarea placeholder="你的评论可以一针见血" class="input-block-level comt-area" name="comment"
id="comment" cols="100%" rows="3" tabindex="1"
onkeydown="if(event.ctrlKey&&event.keyCode==13){document.getElementById('submit').click();return false};"></textarea><div class="comt-ctrl"><div class="comt-tips"><input type='hidden' name='comment_post_ID' value='6053'
id='comment_post_ID'/><input type='hidden' name='comment_parent' id='comment_parent' value='0'/><p style="display: none;"><input type="hidden" id="akismet_comment_nonce"
name="akismet_comment_nonce" value="40dd7081eb"/></p><label for="comment_mail_notify" class="checkbox inline hide"
style="padding-top:0"><input type="checkbox" name="comment_mail_notify"
id="comment_mail_notify"
value="comment_mail_notify"
checked="checked"/>有人回复时邮件通知我</label><p style="display: none;"><input type="hidden" id="ak_js" name="ak_js" value="245"/></p></div><button type="button" name="submit" id="submit" tabindex="5">提交评论</button>--><!-- <span data-type="comment-insert-smilie" class="muted comt-smilie"><i class="icon-thumbs-up icon12"></i> 表情</span> --><!--
</div></div><div class="comt-comterinfo" id="comment-author-info"><ul><li class="form-inline"><label class="hide" for="author">昵称</label><input class="ipt" type="text" name="author" id="author" value="" tabindex="2" placeholder="昵称"><span class="text-muted">昵称 (必填)</span></li><li class="form-inline"><label class="hide" for="email">邮箱</label><input class="ipt" type="text" name="email" id="email" value="" tabindex="3" placeholder="邮箱"><span class="text-muted">邮箱 (必填)</span></li><li class="form-inline"><label class="hide" for="url">网址</label><input class="ipt" type="text" name="url" id="url" value="" tabindex="4" placeholder="网址"><span class="text-muted">网址</span></li></ul></div></div></form></div>--></div></div><div class="sidebar"><div class="widget widget_ui_tags"><h3>前端开发</h3><div class="items"><a href="/cate72/">HTML 教程</a><a href="/cate73/">CSS 教程</a><a href="/cate74/">JavaScript 教程</a><a href="/cate79/">Vue.js 教程</a><a href="/cate80/">Node.js 教程</a></div></div><form method="get" class="search-form clearfix" id="search-formhybrid-search" target="_blank" action="/search/article/"><div class="search-input-wrap"><input type="text" class="search-text" placeholder="来搜我" name="word" id="search-texthybrid-search"
value="" data-placeholder=""><b class="search-liaosheji"></b><button type="submit" class="search-button"><i class="icon-search"></i></button></div></form><div style="text-align:center;margin:0 auto;"><ul class='hot-search layui-clear'><li style="float:left;margin-right:20px;">热门搜索：</li><li style="float:left;margin-right:20px;"><a href='/search/article/?word=HTML标记'>HTML标记</a></li><li style="float:left;margin-right:20px;"><a href='/search/article/?word=能说明一下GETROWS的用法吗？'>能说明一下GETROWS的用法吗？</a></li><li style="float:left;margin-right:20px;"><a href='/search/article/?word=HTML标签及ASP函数速查表'>HTML标签及ASP函数速查表</a></li><li style="float:left;margin-right:20px;"><a href='/search/article/?word=关于HTML及UBB标记的闭合'>关于HTML及UBB标记的闭合</a></li><li style="float:left;margin-right:20px;"><a href='/search/article/?word=使用说明'>使用说明</a></li></ul></div><br/><div class="widget widget_ui_posts"><h3>置顶推荐</h3><ul><li><a href="/cate99/113247636454400.html"><span class="thumbnail"><img data-src="https://ss.0133.cn/upload/article/000/000/001/61c030e32e4d9281.jpg" alt="qq火花是过了24小时断吗" class="thumb"></span><span class="text">qq火花是过了24小时断吗</span><span
class="muted">2021-12-20</span></a></li></ul></div><div class="widget widget_recent_entries"><h3>猜你喜欢</h3><ul><li><a href="/cate72/118201979225.html" target="_blank">HTML中五种网页跳转的方法</a><span class="post-date">2020-04-28</span></li><li><a href="/cate72/111273072133025.html" target="_blank">搜索引擎免费收录网站入口小集</a><span class="post-date">2021-10-20</span></li><li><a href="/cate72/111105725816225.html" target="_blank">前端开发必备：12款浏览器兼容性测试工具推荐</a><span class="post-date">2021-10-17</span></li><li><a href="/cate72/119004350485625.html" target="_blank">限制input输入类型(多种方法实现)</a><span class="post-date">2023-09-05</span></li><li><a href="/cate72/11191397460100.html" target="_blank">浅谈HTML的语义化和一些简单优化</a><span class="post-date">2021-09-25</span></li><li><a href="/cate72/111983224352900.html" target="_blank">HTML中的图象标签属性</a><span class="post-date">2021-11-10</span></li><li><a href="/cate72/11197020536900.html" target="_blank">html固定标题列、标题头table具体实现代码</a><span class="post-date">2021-09-25</span></li><li><a href="/cate72/112313562641600.html" target="_blank">推荐深入理解css中的position定位和z-index属性</a><span class="post-date">2021-11-16</span></li></ul></div><!--<div class="widget widget_ui_tags"><h3>热门标签</h3><div class="items"><a href="/archives/tag/javascript">JavaScript (324)</a></div></div><div class="widget widget_ui_comments"><h3>最新评论</h3><ul><li><a href="" title=""><img data-src="" class="avatar avatar-100" height="50" width="50"><strong></strong></a></li></ul></div>--></div><div id="leftbar" class="leftbar"><div class="leftbar-con"><div style="text-align: center; width: 160px;"></div></div></div></section><footer class="footer"><div class="container"><p>© 2022 <a href="/">WEB前端开发</a></p><p><a href="/cate88/">工具教程</a> | <a href="/cate71/">前端开发</a> | <a href="/cate61/">常见问题</a> | <a
href="/cate129/">操作系统</a> | <a href="/cate103/">编程</a> | <a href="/cate108/">网络安全</a> | <a href="/cate120/">设计</a> | <a href="/cate137/">站长技巧</a></p><div class="footer-gav" style="margin-bottom: 10px ;font-size: 12px;"><img
src="https://ss.0133.cn/newimg88/2016/06/beian-gov-cn.png" style="vertical-align: middle; height: 14px;"/><a href="https://beian.miit.gov.cn/" target="_blank">鄂ICP备2021014202号-2</a></div><div class="footer-qrcode"></div></div></footer><script> window.jsui = {
www: '',
uri: '/wp-content/themes/dux',
ver: '5.2.5',
roll: ["1", "2"],
ajaxpager: '0',
url_rp: '/about'
};
</script><script type='text/javascript' src='/wp-content/themes/dux/js/libs/bootstrap.min.js?ver=5.2.5'></script><script type='text/javascript' src='/wp-content/themes/dux/js/loader.js?ver=5.2.5'></script><script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=5.0.2'></script><script async="async" type='text/javascript' src='/wp-content/plugins/akismet/_inc/form.js?ver=4.0.8'></script><script type="text/javascript"> var $win = jQuery(window);
var $WindowW = $win.width();
var $threebar = jQuery("#leftbar");
if ($threebar.length) {
var offsetT = $threebar.offset().top;
$win.on("scroll.leftbar", function () {
if ($WindowW >= 1200) {
if ($win.scrollTop() >= (offsetT)) {
$threebar.find(".leftbar-con").css({
"position": "fixed",
"top": 0
});
} else {
$threebar.find(".leftbar-con").css("position", "static")
}
}
});
}
// Array
var imagesArr = [];
$('#article-content').find("img").each(function (index, Element) {
imagesArr.push(Element)
});
mediumZoom(imagesArr, {
margin: 24,
background: '#FFFFFF',
scrollOffset: 0
})
</script><script> (function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-3448069-1', 'css88.com');
ga('send', 'pageview');
</script><script> var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?08985692e4db1e8be1cff8097c2979b7";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</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></body></html> |