Blogger Information
Blog 36
fans 0
comment 0
visits 28051
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
HTML之链接、列表、表格、表单 2020.4.3作业
小程_武汉_214945
Original
573 people have browsed it

链接

  1. <a href="https://www.php.cn">php中文网</a>

无序列表

  1. <ul>
  2. <li>c</li>
  3. <li>c++</li>
  4. <li>java</li>
  5. <li>php</li>
  6. </ul>

有序列表

  1. <ol>
  2. <li>张三</li>
  3. <li>李四</li>
  4. <li>王五</li>
  5. <li>赵六</li>
  6. </ol>

表格

  1. <table
  2. border="1"
  3. cellpadding="5"
  4. cellspacing="0"
  5. width="400px"
  6. align="center"
  7. >
  8. <colgroup>
  9. <col bgcolor="lightgreen" />
  10. <col bgcolor="lightyellow" span="2" />
  11. <col bgcolor="red" />
  12. </colgroup>
  13. <caption style="font-size: 30px; margin-bottom: 6px;">
  14. 成绩单
  15. </caption>
  16. <tr bgcolor="lightblue">
  17. <th>学号</th>
  18. <th>姓名</th>
  19. <th>性别</th>
  20. <th>成绩</th>
  21. </tr>
  22. <tr>
  23. <td>0101</td>
  24. <td>李华</td>
  25. <td></td>
  26. <td>100</td>
  27. </tr>
  28. <tr>
  29. <td>0102</td>
  30. <td>张磊</td>
  31. <td></td>
  32. <td>98</td>
  33. </tr>
  34. <tr>
  35. <td>0103</td>
  36. <td>田甜</td>
  37. <td></td>
  38. <td>100</td>
  39. </tr>
  40. <tr bgcolor="yellow">
  41. <td>说明</td>
  42. <td colspan="3" align="center">本次成绩仅作为参考</td>
  43. </tr>
  44. </table>

表单

  1. <form action="demo1.php" method="GET">
  2. <section>
  3. <label for="user">账号</label>
  4. <input
  5. type="text"
  6. name="user"
  7. id="user"
  8. placeholder="请输入账号"
  9. required
  10. autofcous
  11. />
  12. </section>
  13. <section>
  14. <label for="password">密码</label>
  15. <input
  16. type="password"
  17. name="password"
  18. id="password"
  19. placeholder="请输入密码"
  20. required
  21. />
  22. </section>
  23. <section>
  24. <div class="box">
  25. <label for="secret">性别</label>
  26. <input type="radio" name="gender" value="male" id="male" />
  27. <label for="male"></label>
  28. <input type="radio" name="gender" value="female" id="female" />
  29. <label for="female"></label>
  30. <input
  31. type="radio"
  32. name="gender"
  33. value="secret"
  34. id="secret"
  35. checked
  36. />
  37. <label for="gender">保密</label>
  38. </div>
  39. </section>
  40. <section>
  41. <div class="box">
  42. <label for="">兴趣</label>
  43. <input type="checkbox" name="hobby[]" value="program" id="program" />
  44. <label for="program">编程</label>
  45. <input type="checkbox" name="hobby[]" value="sport" id="sport" />
  46. <label for="sport">运动</label>
  47. <input type="checkbox" name="hobby[]" value="music" id="music" />
  48. <label for="music">音乐</label>
  49. <input
  50. type="checkbox"
  51. name="hobby[]"
  52. value="sleep"
  53. id="sleep"
  54. checked
  55. />
  56. <label for="sleep">睡觉</label>
  57. </div>
  58. </section>
  59. <button>提交</button>
  60. </form>

效果展示

0403作业

Correcting teacher:天蓬老师天蓬老师

Correction status:qualified

Teacher's comments:效果图不错
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post