3.表单标签.html 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  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. <title>Document</title>
  7. </head>
  8. <body>
  9. <!--
  10. 表单标签:form
  11. 属性:action 将表单上的内容提交到服务端上
  12. label 表单提示信息
  13. placeholder 提示信息
  14. input: 行内块元素
  15. 属性:
  16. 值: value
  17. 分类:type
  18. text 输入框
  19. password 密码
  20. submit 提交按钮
  21. reset 重置按钮
  22. button 按钮 可搭配value属性使用
  23. radio 单选 设置相同的name属性
  24. checkbox 多选
  25. disabled 禁止选择
  26. checked 默认选择
  27. 下拉框:
  28. select与option组成
  29. value 值
  30. disabled 禁止选择
  31. selected 默认选择
  32. 文本域:
  33. textarea
  34. value 值
  35. cols 列
  36. rows 行
  37. -->
  38. <form action="">
  39. <!-- <input style="width: 300px;height: 300px;" type="text"> -->
  40. <label>用户名:</label><input type="text" placeholder="nih ">
  41. <br>
  42. <label>密码:</label><input type="text">
  43. <br>
  44. <input type="password">
  45. <br>
  46. <input type="submit">
  47. <br>
  48. <input type="reset">
  49. <br>
  50. <input type="button" value="自定义">
  51. <br>
  52. <input type="radio" name="sex">男
  53. <input type="radio" name="sex">女
  54. <br>
  55. <input type="checkbox">足球
  56. <input type="checkbox" disabled>台球
  57. <input type="checkbox">羽毛球
  58. <input type="checkbox" checked>网球
  59. <input type="checkbox">蓝球
  60. <input type="checkbox">乒乓球
  61. <br>
  62. <select>
  63. <option value="1">小学</option>
  64. <option value="2" disabled>初中</option>
  65. <option value="3" selected>高中</option>
  66. <option value="4">大学</option>
  67. </select>
  68. <br>
  69. <textarea value="" placeholder="请输入一段自我介绍" cols="30" rows="30"></textarea>
  70. </form>
  71. </body>
  72. </html>