博主信息
博文 5
粉丝 0
评论 0
访问量 4485
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
demo 自己瞎搞 表格
1999权限的博客
原创
812人浏览过

QQ截图20180813145551.png实例

<!DOCTYPE HTML>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>8.12菜单</title>

    <link type="text/css" rel="stylesheet" href="8.12%20zuo.css">
</head>

<body>

<!-- 1、<table>...</table>定义表格

     2、caption标签,为表格添加标题和摘要

     3、table border=# width=# height=# 边框尺寸|cellspacing=# 表格间隙 | summary=# 表格摘要

     4、<caption>...</caption>表格标题-->
<div class="beijin">

<table border="1" width="400" height="200" cellspacing="1" summary="表格摘要" class="bbb1">

    <caption>菜单</caption>

    <!-- tbody 标记用于定义表格主体,改善网页浏览速度 -->

    <tbody>

    <!-- 1、tr th td align=#  #=left, center, right 文字对齐

                 2、<th>…</th>:表格表头

                 3、<td>…</td>:表格的一个单元格

                 4、<tr>…</tr>:表格的一行  -->

    <tr align="center">

        <th align="center">序号</th>

        <th align="center">菜名</th>

        <th align="center">价格</tth>

    </tr>

    <tr align="center">

        <td align="center">1</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    <tr align="center">

        <td align="center">2</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    </tr>

    <tr align="center">

        <td align="center">3</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    <tr align="center">

        <td align="center">4</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    </tr>

    <tr align="center">

        <td align="center">5</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    <tr align="center">

        <td align="center">6</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    </tr>

    <tr align="center">

        <td align="center">7</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    <tr align="center">

        <td align="center">8</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    </tr>

    <tr align="center">

        <td align="center">9</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    <tr align="center">

        <td align="center">10</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    </tr>

    <tr align="center">

        <td align="center">11</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    <tr align="center">

        <td align="center">12</td>

        <td align="center">表格</td>

        <td align="center">表格</td>

    </tr>


</table>
</div>
</body>

</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

<!DOCTYPE HTML>

<html>

<head>

   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

   <title>8.12菜单</title>

   <link type="text/css" rel="stylesheet" href="8.12%20zuo.css">
</head>

<body>

<!-- 1、<table>...</table>定义表格

    2、caption标签,为表格添加标题和摘要

    3、table border=# width=# height=# 边框尺寸|cellspacing=# 表格间隙 | summary=# 表格摘要

    4、<caption>...</caption>表格标题-->
<div class="beijin">

<table border="1" width="400" height="200" cellspacing="1" summary="表格摘要" class="bbb1">

   <caption>菜单</caption>

   <!-- tbody 标记用于定义表格主体,改善网页浏览速度 -->

   <tbody>

   <!-- 1、tr th td align=#  #=left, center, right 文字对齐

                2、<th>…</th>:表格表头

                3、<td>…</td>:表格的一个单元格

                4、<tr>…</tr>:表格的一行  -->

   <tr align="center">

       <th align="center">序号</th>

       <th align="center">菜名</th>

       <th align="center">价格</tth>

   </tr>

   <tr align="center">

       <td align="center">1</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   <tr align="center">

       <td align="center">2</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   </tr>

   <tr align="center">

       <td align="center">3</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   <tr align="center">

       <td align="center">4</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   </tr>

   <tr align="center">

       <td align="center">5</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   <tr align="center">

       <td align="center">6</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   </tr>

   <tr align="center">

       <td align="center">7</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   <tr align="center">

       <td align="center">8</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   </tr>

   <tr align="center">

       <td align="center">9</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   <tr align="center">

       <td align="center">10</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   </tr>

   <tr align="center">

       <td align="center">11</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   <tr align="center">

       <td align="center">12</td>

       <td align="center">表格</td>

       <td align="center">表格</td>

   </tr>


</table>
</div>
</body>

</html>

批改状态:未批改

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学