<textarea></textarea>
作用：允许用户录入多行数据到表单控件中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <div> <form action="http://www.baidu.com" method="get"> <div> 自我介绍: <textarea></textarea> </div> </form> </div> </body> </html>
在文本输入内容
属性说明：
- name：提交给服务端
- rows：设置文本区域的列数，变相设置当前元素宽度
- cols：设置文本区域的行数，变相设置当前元素高度
- disabled：禁用
设置文本域rows高度，cols宽度
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <div> <form action="http://www.baidu.com" method="get"> <div> 自我介绍: <textarea cols="20" rows="5"></textarea> </div> </form> </div> </body> </html>
加上name 可以向服务端提交数据 设置默认值
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <div> <form action="http://www.baidu.com" method="get"> <div> 自我介绍: <textarea cols="20" rows="5" name="text">mike</textarea> </div> </form> </div> </body> </html>
加上placehodler属性
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <div> <form action="http://www.baidu.com" method="get"> <div> 自我介绍: <textarea cols="20" rows="5" name="text" placeholder="自我介绍"></textarea> </div> </form> </div> </body> </html>
