测试你的技能:其他控件

本技能测试的目的是评估您是否理解了我们关于 其他表单控件 的文章。

注意:您可以在此页面的交互式编辑器或在线编辑器(如 CodePenJSFiddleGlitch)中尝试解决方案。

如果您遇到困难,可以通过我们提供的 沟通渠道 与我们联系。

其他控件 1

在我们的第一个“其他控件”评估中,我们将让您创建一个多行文本输入。

  1. 创建一个基本的文本输入。
  2. 通过语义方式将其与提供的“评论”标签相关联。
  3. 为输入分配 35 列和 10 行的空间,用于添加评论。
  4. 为评论设置最大长度为 100 个字符。

要创建输入,请更新下方编辑器中的 HTML 代码。

下载此任务的起点,并在您自己的编辑器或在线编辑器中进行操作。

其他控件 2

现在,让我们尝试实现一个下拉选择菜单,以允许用户从提供的选项中选择他们最喜欢的食物。

  1. 创建您的基本选择框结构。
  2. 通过语义方式将其与提供的“食物”标签相关联。
  3. 在列表中,将选项分成两个子组 - “主食”和“零食”。

要创建菜单,请更新下方编辑器中的 HTML 代码。

下载此任务的起点,并在您自己的编辑器或在线编辑器中进行操作。

其他控件 3

在本组的最后一个任务中,我们从几乎相同的食物选择列表开始。但是,这次我们要做不同的事情。

  1. 创建一个基本的文本输入,并通过语义方式将其与提供的标签相关联。
  2. 将食物选项放入一个列表中,该列表可以与表单输入相关联。
  3. 将列表与您的文本输入相关联,以便在您键入字符时,任何与字符序列匹配的列表选项都将以下拉列表的形式作为自动完成建议显示。

要创建输入,请更新下方编辑器中的 HTML 代码。

下载此任务的起点,并在您自己的编辑器或在线编辑器中进行操作。