HTML9(表单标签之label,select,textarea元素)

本文介绍了HTML中的表单元素,包括<input>标签的标注功能,通过<label>与for属性关联input元素提升用户体验。接着讨论了<select>下拉列表的创建和<option>的使用,以及如何设置默认选中项。最后提到了<textarea>文本域元素,适用于多行文本输入,其cols和rows属性定义字符数和行数。
摘要由CSDN通过智能技术生成

接下来讲解一下input里的最后一个“小弟”,<label>标签,<label>标签为input元素定义标注(标签)。此标签可以绑定一个表单元素,当点击此标签内的文本时,浏览器里的鼠标会转到改表单里要输入的文本内容,这样可以给用户更好的体验。

然后需要注意一下语法,input里设置的id属性必须与label的for属性里的一致

这样子我们点页面的文字,也一样可以添小圆点啦。

接下来回到表单控件类型,我们现在已经讲完了input输入表单元素,后续讲一下select下拉表单元素

select表单元素:主要用于用户在有多个选项的时候,为了节约页面的空间,我们可以采取这个标签进行添加下拉列表。

语法格式:select这个标签后面是有一个叫option的“小弟”

记住啦,这个也是表单,需要在外面包含一个<form>标签哦!

还有一个注意点:如果想要默认是哪个选项,可以在option标签后面添加一个selected。

最后讲一下<textarea>文本域元素

此元素主要针对于内容较多的情况下使用,内容较少一般用文本框表单就行了。

<textarea>标签是用于定义多行文本输入的控件

语法格式:

这个标签也是有“小弟”的,cols的意思是每行的字符数量,rows的意思是行数,后续我们也是在CSS去改变这个标签的大小,不必去记哦。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值