下拉欄是網頁開發中常用的一個元素，其主要作用是在有限的空間內展示大量的內容。下面介紹下拉欄的 HTML 與 CSS 實現方法。

<div class="dropdown">
<button class="dropdown__button">下拉菜單</button>
<ul class="dropdown__content">
<li><a href="#">選項1</a></li>
<li><a href="#">選項2</a></li>
<li><a href="#">選項3</a></li>
</ul>
</div>

上述代碼使用 div 元素作為下拉欄容器，其中包括一個按鈕元素和一個無序列表元素。按鈕元素作為下拉欄的觸發器，無序列表元素則是下拉欄的內容。

.dropdown {
position: relative;
display: inline-block;
}
.dropdown__button {
background-color: #eee;
border: none;
color: #333;
padding: 10px;
font-size: 16px;
}
.dropdown__content {
display: none;
position: absolute;
background-color: #fff;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown__content li {
display: block;
}
.dropdown:hover .dropdown__content {
display: block;
}

上述 CSS 代碼設置了下拉欄的樣式。其中 .dropdown 元素設置為相對定位以方便設置 .dropdown__content 的絕對定位。.dropdown__button 元素設置了按鈕的樣式；.dropdown__content 元素使用了 display: none，隱藏了下拉欄內容；.dropdown__content li 用于設置下拉欄內的列表項樣式；最后一個:hover 選擇器用于設置鼠標滑過后展示下拉欄內容的效果。

通過以上 HTML 與 CSS 代碼的組合，我們可以實現一個簡單的下拉欄，供用戶查看網頁內容。