博客列表 >课程表与表单的制作

课程表与表单的制作

一代宗师
一代宗师原创
2021年02月05日 22:19:17686浏览

课程表

  1. <html lang="en">
  2. <head>
  3. <meta charset="UTF-8">
  4. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  5. <title>某某大学课程表</title>
  6. </head>
  7. <style>
  8. .biao{
  9. margin: 0 auto;
  10. }
  11. caption{font-size: 30px;}
  12. th{width: 100px;height: 40px;}
  13. td{text-align: center;}
  14. </style>
  15. <body>
  16. <table border="1" cellspacing="0" class="biao">
  17. <caption>某某大学课程表</caption>
  18. <thead>
  19. <tr>
  20. <th colspan="2"></th>
  21. <th>星期一</th>
  22. <th>星期二</th>
  23. <th>星期三</th>
  24. <th>星期四</th>
  25. <th>星期五</th>
  26. </tr>
  27. <tr>
  28. <td rowspan="4">上午</td>
  29. <td rowspan="2">1</td>
  30. <td>计算机技术</td>
  31. <td>网络维护</td>
  32. <td>C++</td>
  33. <td>体育</td>
  34. <td>英语</td>
  35. </tr>
  36. <tr>
  37. <td>计算机技术</td>
  38. <td>网络维护</td>
  39. <td>C++</td>
  40. <td>体育</td>
  41. <td>英语</td>
  42. </tr>
  43. <tr>
  44. <td rowspan="2">2</td>
  45. <td>计算机技术</td>
  46. <td>网络维护</td>
  47. <td>C++</td>
  48. <td>体育</td>
  49. <td>英语</td>
  50. </tr>
  51. <tr>
  52. <td>计算机技术</td>
  53. <td>网络维护</td>
  54. <td>C++</td>
  55. <td>体育</td>
  56. <td>英语</td>
  57. </tr>
  58. <tr>
  59. <td colspan="7" style="background-color: beige;">午休时间</td>
  60. </tr>
  61. <tr>
  62. <td rowspan="4">下午</td>
  63. <td rowspan="2">3</td>
  64. <td>计算机技术</td>
  65. <td>网络维护</td>
  66. <td>C++</td>
  67. <td>体育</td>
  68. <td>英语</td>
  69. </tr>
  70. <tr>
  71. <td>计算机技术</td>
  72. <td>网络维护</td>
  73. <td>C++</td>
  74. <td>体育</td>
  75. <td>英语</td>
  76. </tr>
  77. <tr>
  78. <td rowspan="2">4</td>
  79. <td>计算机技术</td>
  80. <td>网络维护</td>
  81. <td>C++</td>
  82. <td colspan="2">体育</td>
  83. </tr>
  84. <tr>
  85. <td>计算机技术</td>
  86. <td>网络维护</td>
  87. <td>C++</td>
  88. <td>体育</td>
  89. <td>英语</td>
  90. </tr>
  91. </thead>
  92. </table>
  93. </body>
  94. </html>

表单

  1. <html lang="en">
  2. <head>
  3. <meta charset="UTF-8">
  4. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  5. <title>用户注册</title>
  6. </head>
  7. <style>
  8. form{
  9. position:absolute;
  10. width:300px;
  11. height:200px;
  12. left:50%;
  13. top:40%;
  14. margin:-150px 0 0 -100px;
  15. }
  16. input{margin: 5px auto;}
  17. label{width: 66px;display: inline-block;}
  18. </style>
  19. <body>
  20. <form action="" method="POST" enctype="multipart/form-data">
  21. <input type="hidden" name="url" id=""><!--隐藏域-->
  22. <div class="text">
  23. <label for="name" >用户名:</label>
  24. <input type="text" name="" id="name" placeholder="请输入用户名" required>
  25. </div>
  26. <div class="text">
  27. <label for="email" >邮箱:</label>
  28. <input type="text" name="" id="email" placeholder="请输入邮箱">
  29. </div>
  30. <div class="text">
  31. <label for="mm">密码:</label>
  32. <input type="password" name="" id="mm" placeholder="请输入密码">
  33. </div>
  34. <div class="text">
  35. <label for="">性别:</label>
  36. <input type="radio" name="sex" value="nan">
  37. <input type="radio" name="sex" value="nv">
  38. <input type="radio" name="sex" value="bm" checked>保密
  39. </div>
  40. <div class="text">
  41. <label for="">兴趣:</label>
  42. <input type="checkbox" name="xingqu[]" value="youxi" checked>游戏
  43. <input type="checkbox" name="xingqu[]" value="yinyue" checked>音乐
  44. <input type="checkbox" name="xingqu[]" value="pashan">爬山
  45. </div>
  46. <div class="text">
  47. <label for="">学历:</label>
  48. <select name="" id="">
  49. <option value="1">初中</option>
  50. <option value="2">高中</option>
  51. <option value="3" selected>大学</option>
  52. </select>
  53. </div>
  54. <div class="text">
  55. <label for="">头像:</label>
  56. <input type="file" style="width: 70%;">
  57. </div>
  58. <div class="text" style="position: relative;">
  59. <label for="" style="position: absolute;top: 0px;">备注:</label>
  60. <textarea name="" id="" cols="30" rows="5" style="width: 70%;position: absolute;left: 69px;"></textarea>
  61. </div>
  62. <div class="text2" style="position: relative;">
  63. <input type="submit" style="width:100px;position: absolute;top: 80px;" name="" value="提交">
  64. </div>
  65. </form>
  66. </body>
  67. </html>

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议
2021-02-05 22:14:141楼
好的,老师。我检查下