1.表单.html 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  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. <style>
  8. /* input {
  9. width: 200px;
  10. height: 100px;
  11. } */
  12. </style>
  13. </head>
  14. <body>
  15. <!--
  16. form 表单
  17. 属性:action 讲表单上的内容提交到服务端 一般不去使用
  18. 1.input 输入框 行内块元素
  19. 属性:
  20. placeholder 提示信息
  21. value 值
  22. type类型
  23. text 文本
  24. password 密码
  25. submit 提交按钮
  26. reset 重置
  27. radio 单选框 必须保证name属性名字相同
  28. checkbox 复选框 disabled 禁用 checked选中
  29. 2.select与option共同组成下拉框
  30. 有多少可选项 就有多少option
  31. value属性 内容不显示在页面上 而是为了方便提交
  32. selected 默认选择
  33. disabled 禁止选择
  34. 3.textarea 文本域
  35. placeholder 提示信息
  36. rows 行数
  37. cols 列数
  38. maxlength 最大字符
  39. -->
  40. <form action="">
  41. <input type="text" placeholder="你好 星期日">
  42. <input type="text" placeholder="你好 星期日">
  43. <input type="text" placeholder="你好 星期日">
  44. <input type="password">
  45. <br>
  46. <br>
  47. <input type="submit">
  48. <input type="reset">
  49. <input type="button" value="哈哈">
  50. <br><br>
  51. <input type="radio" name="111">男
  52. <input type="radio" name="111">女
  53. <br><br>
  54. <input type="checkbox">篮球
  55. <input type="checkbox" disabled>足球
  56. <input type="checkbox">羽毛球
  57. <input type="checkbox" checked>排球
  58. <br><br>
  59. <select>
  60. <option disabled value="a">1</option>
  61. <option selected value="b">2</option>
  62. <option value="c">3</option>
  63. </select>
  64. <br><br>
  65. <textarea placeholder="请输入一段自我介绍" maxlength="10" rows="100" cols="200"></textarea>
  66. </form>
  67. </body>
  68. </html>