发表于： 2019-03-05 22:32:52
2 649
一、今天学习的东西
1.Text input(文本输入框)是用来获得用户输入的绝佳方式。
可以用如下方法创建：
<input type="text">
注意，input元素是自关闭的
2.占位符(placeholder text)是用户在input(输入)框输入任何东西之前放置在input(输入)框中的预定义文本。
可以用如下方式创建占位符：
<input type="text" placeholder="this is placeholder text">
3.使用HTML来构建可以跟服务器交互的Web表单(form)，通过给form元素添加一个action属性来达到此目的。
action属性的值指定了表单提交到服务器的地址。
例如：
<form action="/url-where-you-want-to-submit-form-data"></form>
4.为form添加一个submit(提交)按钮，点击这个按钮，表单中的数据将会被发送到你通过action属性指定的地址上。
下面是submit按钮的例子：
<button type="submit">this button submits the form</button>
5.当设计表单时，可以指定某些选项为必填项(required)，只有当用户填写了该选项后，用户才能够提交表单。
例如，如果想把一个文本输入字段设置为必填项，在input元素中加上required属性就可以了，可以使用：
<input type="text" required>
注意：required属性在Safari浏览器中不起作用，请用其他浏览器来学习，推荐使用Chrome。
6.多选一的场景就用radio button(单选按钮)
单选按钮只是input输入框的一种类型。
每一个单选按钮都应该嵌套在自己的label(标签)元素中。
注意：所有关联的单选按钮应该使用相同的name属性。
下面是一个单选按钮的例子：
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
7.当你在大学选课时，面对几百门课程，而因为时间和精力，你只能从中选择十几门。
这样的场景就用checkboxes（复选按钮）。
复选按钮是input的输入框的另一种类型。
每一个复选按钮都应该嵌套进label元素中。
所有关联的复选按钮应该具有相同的name属性。
下面是复选按钮的例子：
<label><input type="checkbox" name="personality"> Loving</label>
8.使用checked属性，可以设置复选按钮和单选按钮默认被选中。
为此，只需在input元素中添加属性checked
<input type="radio" name="test-name" checked>
二、明日计划
1.尝试为html添加更多的标签。
2.继续学习css的编写。
三、今天遇到的问题
暂无
四、收获
1.初步学会了制作form表单。
2.初步了解了css。
返回列表
评论