【九月打卡】第4天 前端工程师2022版 表单标签第一讲

课程名称：前端工程师2022版

课程章节：表单标签

课程讲师： elex

课程内容：

1  单行文本框

<input type="text" value="已经填写好的值" placeholder="浅色提示文本">

              还可以添加山disable 表示锁死单行文本框

2 通过type="radio"来表示单选按钮（类似于家用老式收音机 按钮  按住某个其他按钮复原）

<input type="radio" name="sex">男

<input type="radio" name="sex">女

    重点是name必须相同才能达到互斥的效果

   value=“”表示提交给服务器的实际数据

   chcked 表示初始化 默认选择

3 label标签目前存在两个版本的写法

   label主要实现效果：用户通过点击文字也能选上按钮

      html5写法

1.{<label>

<input type="radio" name="sex">男

</label>

<label>

<input type="radio" name="sex">女

</label>

直接用label包裹即可

     html4写法

<input type="radio" name="sex" id="nan"><label for="nan">男<label/>

<input type="radio" name="sex" id="nv"><label for="nv">女<label/>

通过label包裹文字文本 并且再label中添加for   input中的id  最终对应上才能完成效果

4 复选框 

<label>

<input type="checkbox" name="hobby" value="football">足球

</label>

<label>

<input type="checkbox" name="hobby" value="baskball">篮球

</label>

<label>

<input type="checkbox" name="hobby" value="glball">橄榄球

</label>

<label>

<input type="checkbox" name="hobby" value="maoball">羽毛球

</label>

虽然name没有要求一致 这样也是无妨的，

}

课程收获：

谢谢老师，讲的非常细致，很容易懂。