CSS 輸入下拉菜單是一種常見的網頁設計元素，可以讓用戶在輸入框 中輸入文字時，自動顯示匹配的選項。

要創建一個 CSS 輸入下拉菜單，需要以下幾個步驟：

<label for="input">Search:</label>
<input type="text" id="input" name="input">
<ul id="list">
<li>Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
<li>Option 4</li>
</ul>

使用 CSS 樣式來隱藏選項列表：

#list li {
display: none;
}

使用 JavaScript 代碼來監聽輸入框的鍵盤事件，并根據輸入的內容來顯示匹配的選項：

var input = document.getElementById('input');
var list = document.getElementById('list');
input.addEventListener('keyup', function() {
var value = input.value.toLowerCase();
var items = list.getElementsByTagName('li');
for (var i = 0; i < items.length; i++) {
var item = items[i];
if (item.innerHTML.toLowerCase().indexOf(value) > -1) {
item.style.display = '';
} else {
item.style.display = 'none';
}
}
});

通過以上代碼，當用戶在輸入框中輸入文字時，會根據輸入的內容來動態顯示和隱藏匹配的選項。