设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 编程语言专区 › Web开发 › Web密训营 › 0 0 1 9 - 表格（表单他二哥）
12
返回列表 发新帖
楼主: 不二如是

[庖丁解牛] 0 0 1 9 - 表格（表单他二哥）

[复制链接]
soulwyb
发表于 2018-10-15 23:53:04 | 显示全部楼层
  1. <!doctype>
  2. <html>

  4. <head>
  5.     <title>19</title>
  6.     <meta charset="utf-8">
  7.     <style type="text/css">
  8.         thead {
  9.             color: red;
  10.         }
  11.         
  12.         tbody {
  13.             color: blue;
  14.             height: 50px;
  15.         }
  16.     </style>
  17. </head>

  19. <body>
  20.     <table border="16" width="66%" align="center">
  21.         <thead>
  22.             <caption>标题</caption>
  23.             <tr>
  24.                 <td colspan="2">鱼C信息表</td>
  25.             </tr>
  26.             <tr>
  27.                 <td>姓名</td>
  28.                 <td>年龄</td>
  29.             </tr>
  30.         </thead>
  31.         <tbody>
  32.             <tr>
  33.                 <td>小甲鱼</td>
  34.                 <td>28</td>
  35.             </tr>
  36.             <tr>
  37.                 <td>不二如是</td>
  38.                 <td>18</td>
  39.             </tr>
  40.         </tbody>
  41.     </table>
  42. </body>

  44. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

QiaoaiMen
发表于 2018-11-15 19:17:16 | 显示全部楼层
交作业，终于知道怎么发图片了。
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <meta charset="utf-8">
  5.         <title>019练习（表格）</title>
  6.         <style type="text/css">
  7.                 thead{color: green}
  8.                 tbody{
  9.                         color: blue;
  10.                         height: 500px;
  11.                 }
  12.         </style>
  13. </head>
  14. <body>
  15.         <table border="16" width=66%" align="center">   <!--border控制的应该是外边框线，width是占页面宽度的比例*/-->
  16.                 <thead align="center">
  17.                         <tr>
  18.                                 <td colspan="2">鱼C信息表</td>
  19.                         </tr>
  20.                         <caption>鱼C信息表</caption>
  21.                         <tr>
  22.                                 <th>姓名</th>
  23.                                 <th>年龄</th>
  24.                         </tr>
  25.                 </thead>

  27.                 <tbody align="center">
  28.                         <tr>
  29.                                 <td>小甲鱼老湿：</td>
  30.                                 <td>28</td>
  31.                         </tr>
  32.                         <tr>
  33.                                 <td>不二如是：</td>
  34.                                 <td>18</td>
  35.                         </tr>
  36.                 </tbody>
  37. </body>
  38. </html>
  39. <img src="https://fishc.com.cn/forum.php?mod=image&aid=104811&size=300x300&key=aa4648f036eb3f1b&nocache=yes&type=fixnone" aid="attachimg_104811" alt="" border="0">
复制代码



019表格练习

019表格练习
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

guohuo888meng@1
发表于 2019-2-12 16:38:50 | 显示全部楼层
刮刮乐
100万
1000万
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

guohuo888meng@1
发表于 2019-2-12 16:39:50 | 显示全部楼层
刮刮乐
100万
1000万
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

phszhuli
发表于 2019-4-23 15:50:50 | 显示全部楼层
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <title>表格</title>
  5.         <meta charset="utf-8">
  6.         <style type="text/css">
  7.                 thead {color:blue;}
  8.                 tbody {color:red;height: 50px}
  9.                 caption{color:green;}
  10.         </style>
  11. </head>
  12. <body>
  13.         <table border="1" width="50%" align="center">
  14.                 <!--border用来设置表格线宽宽度-->
  15.                 <caption>鱼C表</caption><!--作为标题，只能有一个-->
  16.                 <thead align="center">
  17.                 <tr>
  18.                         <td colspan="2">鱼C信息表</td>
  19.                         <!--colspan的值就是合并几个单元格的意思-->
  20.                 </tr>
  21.                 <tr>
  22.                         <th>姓名</th><!--th用做二级标题-->
  23.                         <th>年龄</th>
  24.                 </tr>
  25.                 </thead>

  27.                 <tbody align="center">
  28.                 <tr><!--tr，代表一行表格-->
  29.                         <td>小甲鱼老师：</td>
  30.                         <td>28</td><!--td,代表单元格-->
  31.                 </tr>
  32.                 <tr>
  33.                         <td>不二如是：</td>
  34.                         <td>18</td>
  35.                 </tr>
  36.                 </tbody>
  37.                 <!--为了区分表头和表格内容，使用thead、tbody类似区块-->
  38.         </table>
  39. </body>
  40. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

fangfangfengfei
发表于 2019-6-14 09:12:32 | 显示全部楼层
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.     <title>Document</title>
  8. </head>
  9. <body>
  10.     <table border="10px" cellpadding='20px'  cellspacing='15' align='center'>
  11.             <caption>nihao鱼C信息表</caption>
  12.         <tr align="center">
  13.             <td colspan="2">鱼C信息表</td>   <!--列-->
  14.         </tr>
  15.         <tr>
  16.             <td rowspan="2">1行1列</td>  <!--行-->
  17.             <td>1行2列</td>
  18.         </tr>
  19.         
  20.         <tr>
  21.            
  22.             <td>2行二列</td>
  23.         </tr>
  24.         
  25.     </table>
  26. </body>
  27. </html>
复制代码

点评

我很赞同！: 5.0
不二如是
我很赞同！: 5
  发表于 2019-6-14 09:15

评分

参与人数 1鱼币 +5 收起 理由
不二如是 + 5 鱼C有你更精彩^_^

查看全部评分

小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

克里斯保罗
发表于 2019-8-14 16:21:46 | 显示全部楼层
交作业！
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.         <meta charset="UTF-8">
  5.         <title>table</title>
  6.         <style type="text/css">
  7.                 thead{
  8.                         color: blue
  9.                 }
  10.                 tbody{
  11.                         color: green;
  12.                         height: 50px
  13.                 }
  14.         </style>
  15. </head>
  16. <body>
  17.         <table border="1">
  18.                 <thead>
  19.                 <tr>
  20.                 <td colspan="2">假期学习内容</td>
  21.                 </tr>
  22.                 <caption>假期学习内容</caption>
  23.                 <tr>
  24.                         <td>名称</td>
  25.                         <td>好感度</td>
  26.                 </tr>
  27.                 </thead>
  28.                 <tbody>
  29.                 <tr>
  30.                         <td >HTML</th>
  31.                         <td>99</td>
  32.                 </tr>
  33.                 <tr>
  34.                         <td>Python</td>
  35.                         <td>99</td>
  36.                 </tr>
  37.         </tbody>
  38.         </table>
  39. </body>
  40. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

huanghuiyv
发表于 2020-8-17 22:29:45 | 显示全部楼层
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <title>表格</title>
  6.     </head>

  8.     <body>
  9.         <table border="16" width="66%" align="center">
  10.             <caption>鱼C信息表</caption>
  11.             <tr>
  12.                 <td colspan="2">鱼C信息表</td>
  13.             </tr>
  14.             <tr>
  15.                 <td>姓名</td>
  16.                 <td>年龄</td>
  17.             </tr>
  18.             <tr>
  19.                 <td>小甲鱼</td>
  20.                 <td>18</td>
  21.             </tr>
  22.             <tr>
  23.                 <td>不二如是</td>
  24.                 <td>18</td>
  25.             </tr>
  26.         </table>
  27.     </body>
  28. </html>
复制代码
Snipaste_2020-08-15_13-44-34.png
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

12
返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2025-6-8 00:14

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表