<table>_HTML 参考手册_HTML/CSS_教程_教程_JSON在线解析及格式化验证_CPU中文网

Tool.cpu.com.cn

在线开发工具

程序员教程

图形图像工具

文字处理工具

HTML 参考手册

HTML 标签列表(字母排序)
HTML 标签列表（功能排序）
HTML 全局属性
HTML 事件
HTML 画布
HTML 音频/视频
HTML 有效DOCTYPES
HTML 颜色名
HTML 拾色器
HTML 颜色混搭
HTML 字符集
HTML ASCII
HTML ISO-8859-1
HTML 符号
HTML URL 编码
HTML 语言代码
HTTP 消息
HTTP 方法
Px/Em 换算工具
键盘快捷键
HTML 标签
- </a> </li> <li class=""> <a href="/jiaocheng/co-1055.html"> <img></a> </li> <li class=""> <a href="/jiaocheng/co-1056.html"> <input></a> </li> <li class=""> <a href="/jiaocheng/co-1057.html"> <ins></a> </li> <li class=""> <a href="/jiaocheng/co-1058.html"> <kbd></a> </li> <li class=""> <a href="/jiaocheng/co-1059.html"> <keygen></a> </li> <li class=""> <a href="/jiaocheng/co-1060.html"> <label></a> </li> <li class=""> <a href="/jiaocheng/co-1061.html"> <legend></a> </li> <li class=""> <a href="/jiaocheng/co-1062.html"> <li></a> </li> <li class=""> <a href="/jiaocheng/co-1063.html"> <link></a> </li> <li class=""> <a href="/jiaocheng/co-1064.html"><main></a> </li> <li class=""> <a href="/jiaocheng/co-1065.html"> <map></a> </li> <li class=""> <a href="/jiaocheng/co-1066.html"> <mark></a> </li> <li class=""> <a href="/jiaocheng/co-1067.html"> <menu></a> </li> <li class=""> <a href="/jiaocheng/co-1068.html"> <meta></a> </li> <li class=""> <a href="/jiaocheng/co-1069.html"> <meter></a> </li> <li class=""> <a href="/jiaocheng/co-1070.html"> <nav></a> </li> <li class=""> <a href="/jiaocheng/co-1071.html"> <noframes></a> </li> <li class=""> <a href="/jiaocheng/co-1072.html"> <noscript></a> </li> <li class=""> <a href="/jiaocheng/co-1073.html"> <object></a> </li> <li class=""> <a href="/jiaocheng/co-1074.html"> <ol></a> </li> <li class=""> <a href="/jiaocheng/co-1075.html"> <optgroup></a> </li> <li class=""> <a href="/jiaocheng/co-1076.html"> <option></a> </li> <li class=""> <a href="/jiaocheng/co-1077.html"> <output></a> </li> <li class=""> <a href="/jiaocheng/co-1078.html"> <p></a> </li> <li class=""> <a href="/jiaocheng/co-1079.html"> <param></a> </li> <li class=""> <a href="/jiaocheng/co-1080.html"> <pre></a> </li> <li class=""> <a href="/jiaocheng/co-1081.html"> <html></a> </li> <li class=""> <a href="/jiaocheng/co-1082.html"><picture></a> </li> <li class=""> <a href="/jiaocheng/co-1083.html">progress</a> </li> <li class=""> <a href="/jiaocheng/co-1084.html">q </a> </li> <li class=""> <a href="/jiaocheng/co-1085.html"> <rp></a> </li> <li class=""> <a href="/jiaocheng/co-1086.html"> <rt></a> </li> <li class=""> <a href="/jiaocheng/co-1087.html"> <ruby></a> </li> <li class=""> <a href="/jiaocheng/co-1088.html"> <s></a> </li> <li class=""> <a href="/jiaocheng/co-1089.html"> <samp></a> </li> <li class=""> <a href="/jiaocheng/co-1090.html"><script> </a> </li> <li class=""> <a href="/jiaocheng/co-1091.html"> <section></a> </li> <li class=""> <a href="/jiaocheng/co-1092.html"> <select></a> </li> <li class=""> <a href="/jiaocheng/co-1093.html"> <small></a> </li> <li class=""> <a href="/jiaocheng/co-1094.html"> <source></a> </li> <li class=""> <a href="/jiaocheng/co-1095.html"> <span></a> </li> <li class=""> <a href="/jiaocheng/co-1096.html"> <strike></a> </li> <li class=""> <a href="/jiaocheng/co-1097.html"> <strong></a> </li> <li class=""> <a href="/jiaocheng/co-1098.html"> <style></a> </li> <li class=""> <a href="/jiaocheng/co-1099.html"> <sub></a> </li> <li class=""> <a href="/jiaocheng/co-1100.html"> <summary></a> </li> <li class=""> <a href="/jiaocheng/co-1101.html"> <sup></a> </li> <li class="active"> <a href="/jiaocheng/co-1102.html"> <table></a> </li> <li class=""> <a href="/jiaocheng/co-1103.html"> <tbody></a> </li> <li class=""> <a href="/jiaocheng/co-1104.html"> <td></a> </li> <li class=""> <a href="/jiaocheng/co-1105.html"> <textarea></a> </li> <li class=""> <a href="/jiaocheng/co-1106.html"> <tfoot></a> </li> <li class=""> <a href="/jiaocheng/co-1107.html"> <th></a> </li> <li class=""> <a href="/jiaocheng/co-1108.html"> <thead></a> </li> <li class=""> <a href="/jiaocheng/co-1109.html"> <time></a> </li> <li class=""> <a href="/jiaocheng/co-1110.html"> <title></a> </li> <li class=""> <a href="/jiaocheng/co-1111.html"> <tr></a> </li> <li class=""> <a href="/jiaocheng/co-1112.html"> <track></a> </li> <li class=""> <a href="/jiaocheng/co-1113.html"> <tt></a> </li> <li class=""> <a href="/jiaocheng/co-1114.html"> <u></a> </li> <li class=""> <a href="/jiaocheng/co-1115.html"> <ul></a> </li> <li class=""> <a href="/jiaocheng/co-1116.html"> <var></a> </li> <li class=""> <a href="/jiaocheng/co-1117.html"> <video></a> </li> <li class=""> <a href="/jiaocheng/co-1118.html"> <wbr></a> </li> </ul> </div>  <div id='write' class='is-node'> <h1 class="border-b-none"><a name="" class="md-header-anchor"></a><span> <table></span></h1> <div class="pre-and-next"> <a href="co-1101.html">上一篇： <sup></a> <a href="co-1103.html" >下一篇： <tbody> </a> </div> <div class="article-intro" id="content"><div class="example"> <h2 class="example">实例</h2> <p>一个简单的 HTML 表格，包含两列两行：</p> <div class="example_code notranslate"> <table border="1"><br/> <tr><br/> <th>Month</th><br/> <th>Savings</th><br/> </tr><br/> <tr><br/> <td>January</td><br/> <td>$100</td><br/> </tr><br/> </table> </div> <br/><br/>（更多实例见页面底部） </div><hr/><h2>浏览器支持</h2><p> <img alt="Internet Explorer" height="30" src="/uploadfile/up/4e/a4/5d/6de56157646f895dc3df5461415da44e.jpg" title="Internet Explorer" width="31"/><img alt="Firefox" height="30" src="/uploadfile/up/00/0c/91/2b336d55073fa6256944bff0e3910c00.jpg" title="Firefox" width="31"/><img alt="Opera" height="30" src="/uploadfile/up/6f/c9/2f/2fde4bf7adb5ab30bcc93bcca92fc96f.jpg" title="Opera" width="28"/><img alt="Google Chrome" height="30" src="/uploadfile/up/6a/8e/5a/cb756c591b627ba35012a37de65a8e6a.jpg" title="Google Chrome" width="31"/><img alt="Safari" height="30" src="/uploadfile/up/a1/dc/41/cb5ba57a8254753663d18a4a0a41dca1.jpg" title="Safari" width="28"/></p><p>所有主流浏览器都支持 <table> 标签。</p><hr/><h2>标签定义及使用说明</h2><p><table> 标签定义 HTML 表格</p><p>一个 HTML 表格包括 <table> 元素，一个或多个 <a href="co-1111.html"><tr></a>、<a href="co-1107.html"><th></a> 以及 <a href="co-1104.html"><td></a> 元素。</p><p><tr> 元素定义表格行，<th> 元素定义表头，<td> 元素定义表格单元。</p><p>更复杂的 HTML 表格也可能包括 <caption>、<col>、<colgroup>、<thead>、<tfoot> 以及 <tbody> 元素。</p><hr/><h2>HTML 4.01 与 HTML5之间的差异</h2><p>在 HTML5 中，仅支持 "border" 属性，并且只允许使用值 "1" 或 ""。</p><hr/><h2>属性</h2><table class="reference notranslate"> <tbody><tr> <th align="left" width="20%">属性</th> <th align="left" width="20%">值</th> <th align="left" width="55%">描述</th> </tr> <tr> <td><a href="co-4581.html">align</a></td> <td>left<br/> center<br/> right</td> <td> <span class="deprecated">HTML5 不支持。HTML 4.01 已废弃。</span> 规定表格相对周围元素的对齐方式。</td> </tr> <tr> <td><a href="co-4582.html">bgcolor</a></td> <td><i>rgb(x,x,x)<br/> #xxxxxx<br/> colorname</i></td> <td> <span class="deprecated">HTML5 不支持。HTML 4.01 已废弃。</span> 规定表格的背景颜色。</td> </tr> <tr> <td><a href="co-4583.html">border</a></td> <td>1<br/> ""</td> <td>规定表格单元是否拥有边框。</td> </tr> <tr> <td><a href="co-4584.html">cellpadding</a></td> <td><i>pixels</i></td> <td> <span class="deprecated">HTML5 不支持。</span>规定单元边沿与其内容之间的空白。</td> </tr> <tr> <td><a href="co-4585.html">cellspacing</a></td> <td><i>pixels</i></td> <td> <span class="deprecated">HTML5 不支持。</span>规定单元格之间的空白。</td> </tr> <tr> <td><a href="co-4586.html">frame</a></td> <td>void<br/> above<br/> below<br/> hsides<br/> lhs<br/> rhs<br/> vsides<br/> box<br/> border</td> <td> <span class="deprecated">HTML5 不支持。</span>规定外侧边框的哪个部分是可见的。</td> </tr> <tr> <td><a href="co-4587.html">rules</a></td> <td>none<br/> groups<br/> rows<br/> cols<br/> all</td> <td> <span class="deprecated">HTML5 不支持。</span>规定内侧边框的哪个部分是可见的。</td> </tr> <tr> <td><a href="co-4588.html">summary</a></td> <td><i>text</i></td> <td> <span class="deprecated">HTML5 不支持。</span>规定表格的摘要。</td> </tr> <tr> <td><a href="co-4589.html">width</a></td> <td><i>pixels<br/> %</i></td> <td> <span class="deprecated">HTML5 不支持。</span>规定表格的宽度。</td> </tr> </tbody></table><hr/><h2>全局属性</h2><p><table> 标签支持 <a href="co-981.html">HTML 的全局属性</a>。</p><hr/><h2>事件属性</h2><p><table> 标签支持 <a href="co-982.html">HTML 的事件属性</a>。</p><hr/><div class="tryit_ex"> <img alt="Examples" height="46px" src="/uploadfile/up/4d/fd/07/021652adaa83eb0fee6d2a726b07fd4d.jpg" width="40"/><h2>运行代码 - 实例</h2> </div><p> <a href="/runcode/run_html5/?filename=tryhtml_table_header" target="_blank">表格中的标题</a><br/> 本例演示如何显示表格标题。</p><p> <a href="/runcode/run_html5/?filename=tryhtml_table_nbsp" target="_blank">空单元格</a><br/> 本例演示如何使用 "&nbsp;" 处理没有内容的单元格。</p><p> <a href="/runcode/run_html5/?filename=tryhtml_caption_test" target="_blank">带有标题的表格</a><br/> 本例演示一个带标题(caption)的表格。</p><p> <a href="/runcode/run_html5/?filename=tryhtml_table_elements" target="_blank">表格内的标签</a><br/> 本例演示如何在其他的元素内显示元素。</p><p> <a href="/runcode/run_html5/?filename=tryhtml_table_span">跨行或跨列的表格单元格</a><br/> 本例演示如何定义跨行或跨列的表格单元格。</p><hr/><h2>相关文章</h2><p>HTML 教程：<a href="/jiaocheng/co-1183.html">HTML 表格</a></p><p>HTML DOM 参考手册：<a href="/jiaocheng/co-1445.html">Table 对象</a></p></div> <div class="pre-and-next"> <a href="co-1101.html">上一篇： <sup></a> <a href="co-1103.html" >下一篇： <tbody> </a> </div> </div> <div class="right-nav-con" id="rightNavCon"> <ul id="rightNavList"> <li><strong>分类导航</strong></li> <li data-type="dropdown"> <a href="javascript:;">HTML/CSS  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/bootstrap/" class="">Bootstrap 教程</a></dd> <dd><a href="/jiaocheng/bootstrap4/" class="">Bootstrap4 教程</a></dd> <dd><a href="/jiaocheng/css/" class="">CSS 教程</a></dd> <dd><a href="/jiaocheng/css3/" class="">CSS3 教程</a></dd> <dd><a href="/jiaocheng/html/" class="">HTML 教程</a></dd> <dd><a href="/jiaocheng/html5jc/" class="">HTML5教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">JavaScript  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/ajax/" class="">Ajax 教程</a></dd> <dd><a href="/jiaocheng/googleapi/" class="">Google 地图 API 教程</a></dd> <dd><a href="/jiaocheng/jsref/" class="">JavaScript 参考手册</a></dd> <dd><a href="/jiaocheng/jeasyui/" class="">jQuery EasyUI 教程</a></dd> <dd><a href="/jiaocheng/jquery/" class="">jQuery 教程</a></dd> <dd><a href="/jiaocheng/json_t/" class="">JSON 教程</a></dd> <dd><a href="/jiaocheng/vue2/" class="">Vue.js 教程</a></dd> <dd><a href="/jiaocheng/js/" class="">Javascript 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">后端语言  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/cprogramming/" class="">C 教程</a></dd> <dd><a href="/jiaocheng/cplusplus/" class="">C++ 教程</a></dd> <dd><a href="/jiaocheng/go/" class="">Go 语言教程</a></dd> <dd><a href="/jiaocheng/java/" class="">Java 教程</a></dd> <dd><a href="/jiaocheng/nodejs/" class="">Node.js 教程</a></dd> <dd><a href="/jiaocheng/php/" class="">PHP 教程</a></dd> <dd><a href="/jiaocheng/python3/" class="">Python 3 教程</a></dd> <dd><a href="/jiaocheng/scala/" class="">Scala 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">数据库  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/memcached/" class="">Memcached 教程</a></dd> <dd><a href="/jiaocheng/mongodb/" class="">MongoDB 教程</a></dd> <dd><a href="/jiaocheng/mysql/" class="">MySQL 教程</a></dd> <dd><a href="/jiaocheng/redis/" class="">Redis 教程</a></dd> <dd><a href="/jiaocheng/sql/" class="">SQL 教程</a></dd> <dd><a href="/jiaocheng/sqlite/" class="">SQLite 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">移动开发  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/android/" class="">Android 教程</a></dd> <dd><a href="/jiaocheng/ionic/" class="">ionic 教程</a></dd> <dd><a href="/jiaocheng/ios/" class="">iOS 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">服务器相关  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/docker/" class="">Docker 教程</a></dd> <dd><a href="/jiaocheng/linux/" class="">Linux 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">开发工具  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/eclipse/" class="">Eclipse 教程</a></dd> <dd><a href="/jiaocheng/svn/" class="">SVN 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">网站建设  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/htpjc/" class="">HTTP 教程</a></dd> <dd><a href="/jiaocheng/w3c/" class="">W3C 教程</a></dd> </dl> </li> <li data-type="dropdown"> <a href="javascript:;">XML教程  <i class="opacity-5 fa fa-angle-down" aria-hidden="true"></i> </a> <dl class="height-0"> <dd><a href="/jiaocheng/xlink/" class="">XLink 教程</a></dd> <dd><a href="/jiaocheng/dom/" class="">XML DOM 教程</a></dd> <dd><a href="/jiaocheng/xml/" class="">XML 教程</a></dd> </dl> </li> </ul> </div> </div>  <footer class="relative b-large-margin"> <div class="container"> <div class="footer-gg-b"> <div class="footer-gg-b-addr">  </div> <div class="footer-gg-b-style"> <div class="footer-gg-b-link"> <a href="" class="footer-gg-b-email">联系我们</a> <a href="" class="footer-gg-b-feedback">问题反馈</a> </div> <p class="footer-gg-b-copy"><a href="https://beian.miit.gov.cn" target="_blank">鄂ICP备2023022218号-2</a> ©2023 CPU.COM.CN ALL RIGHT RESERVED</p></div> </div> <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js?id=JtK9htQUws8UhD7i&ck=JtK9htQUws8UhD7i&autoTrack=true"></script><script type="text/javascript" src="https://js.users.51.la/21804545.js"></script><script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js?id=K079qR6lFQ4UNH67&ck=K079qR6lFQ4UNH67"></script> </div></footer> <div class="xf-window"> <div class="xf-wxewm" id="showQrcode"> <i class="fa fa-qrcode icon icon-qrcode "></i> <div class="xf-qrcode" id="wxQrcode"> <p>用微信扫一扫</p> <img src="/static/202010/img/gzh_wechat.jpg" width="150"> </div> </div> <a class="fa fa-star xf-collection"> 收藏 </a> <div class="fa fa-qq xf-share " id="showQqlist"> <div class="xf-qrcode xf-qq-link " id="qqWindow" style="display: none"> <p class="xf-qq-link-tit">CPU中文网交流群</p> <p><span>QQ群：</span></p> <a target="_blank" href="">点击加入群</a> <p><span>QQ客服：</span> </p> <p>(工作日: 9:00-18:00)</p> <a target="_blank" href="https://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes">点击联系客服</a> </div> </div> <a href="/feedback.html" class="fa fa-pencil xf-myfeed" target="_blank" id="feedBack"> </a> <div class="xf-totop" id="goTop"> <i class="fa fa-caret-up icon icon-caret-up"></i> </div> </div> <script src="/static/202010/js/lang.js"></script> <script src="/static/202010/js/login.js"></script> <script src="/static/202010/js/footer.js"></script> <style> .popup-link-info-box { position: absolute; right: 58px; top: 0; background-color: #fff; -webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1); padding: 15px; display: none; } .popup-link-info-box li { float: left; margin-right: 10px; border: 1px solid #eee; text-align: center; line-height: 50px; } .popup-link-info-box li p { font-size: 14px; color: #333; } .popup-link-info-box li p span { font-size: 14px; color: #333; } .popup-link-info-box li .popup-wechat-wrapper {} .popup-link-info-box li .popup-wechat-wrapper img { height: 100%; width: 100%; object-fit: cover; } </style> <script type="text/javascript" src="/static/kj/js/jquery.js"></script> <script type="text/javascript" src="/static/kj/js/home-1589270335000-bundle.js"></script> <script type="text/javascript" src="/static/202010/js/jquery.cookie.js"></script> <script type="text/javascript" src="/static/kj/js/pre.js"></script> <script src="/static/202010/js/new-common.js"></script> <script> $(function () { //替换为 pre 标签 // $('.example_code').unwrap().wrap('<pre/>'); $('.example_code').find('br').remove() $('.example_code').replaceWith(function(){ return $("<pre />").append($(this).contents()); }); $("pre").addClass("prettyprint");//如果其他地方也要用到pre，我们可以再加一个父标签的选择器来区分 prettyPrint();//代替body上的onload事件加载该方法 $('a.tryitbtn').text('运行代码') //左导航高度 // var centHeight = $('.is-node').outerHeight() - 2 // $('.left-nav-container').height(centHeight) // $('.left-nav-container ul').height(centHeight - 36) // $('.right-nav-con').height(centHeight) }) $('#write').find('hr').remove() </script> </body> </html>