測試你的技能:其他控制元件

本技能測試的目的是評估您是否理解了我們關於 其他表單控制元件 的文章。

注意:您可以在此頁面的互動式編輯器或線上編輯器(如 CodePenJSFiddleGlitch)中嘗試解決方案。

如果您遇到困難,可以透過我們提供的 溝通渠道 與我們聯絡。

其他控制元件 1

在我們的第一個“其他控制元件”評估中,我們將讓您建立一個多行文字輸入。

  1. 建立一個基本的文字輸入。
  2. 透過語義方式將其與提供的“評論”標籤相關聯。
  3. 為輸入分配 35 列和 10 行的空間,用於新增評論。
  4. 為評論設定最大長度為 100 個字元。

要建立輸入,請更新下方編輯器中的 HTML 程式碼。

下載此任務的起點,並在您自己的編輯器或線上編輯器中進行操作。

其他控制元件 2

現在,讓我們嘗試實現一個下拉選擇選單,以允許使用者從提供的選項中選擇他們最喜歡的食物。

  1. 建立您的基本選擇框結構。
  2. 透過語義方式將其與提供的“食物”標籤相關聯。
  3. 在列表中,將選項分成兩個子組 - “主食”和“零食”。

要建立選單,請更新下方編輯器中的 HTML 程式碼。

下載此任務的起點,並在您自己的編輯器或線上編輯器中進行操作。

其他控制元件 3

在本組的最後一個任務中,我們從幾乎相同的食物選擇列表開始。但是,這次我們要做不同的事情。

  1. 建立一個基本的文字輸入,並透過語義方式將其與提供的標籤相關聯。
  2. 將食物選項放入一個列表中,該列表可以與表單輸入相關聯。
  3. 將列表與您的文字輸入相關聯,以便在您鍵入字元時,任何與字元序列匹配的列表選項都將以下拉列表的形式作為自動完成建議顯示。

要建立輸入,請更新下方編輯器中的 HTML 程式碼。

下載此任務的起點,並在您自己的編輯器或線上編輯器中進行操作。