在網頁設計中，二級導航是一個常見的設計元素。你可以使用HTML和CSS輕松地創建二級導航，下面我們來談一談如何設置。

HTML代碼如下：

<ul class="nav">
<li><a href="#">導航一</a></li>
<li class="dropdown">
<a href="#" class="dropbtn">導航二</a>
<div class="dropdown-content">
<a href="#">子導航一</a>
<a href="#">子導航二</a>
<a href="#">子導航三</a>
</div>
</li>
<li><a href="#">導航三</a></li>
<li><a href="#">導航四</a></li>
</ul>

代碼解釋：

• 使用無序列表<ul>和列表項<li>來創建導航欄
• 使用<a>元素來創建導航鏈接
• 使用class屬性來為導航和子導航添加樣式
• 使用<div>元素來創建子導航
• 使用CSS來顯示和隱藏子導航

CSS代碼如下：

.nav {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a, .dropbtn {
display: inline-block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover, .dropdown:hover .dropbtn {
background-color: red;
}
li.dropdown {
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
z-index: 1;
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {
background-color: #f1f1f1;
}
.dropdown:hover .dropdown-content {
display: block;
}

代碼解釋：

• 使用class選擇器來為導航欄和子導航添加樣式
• 使用float屬性來讓導航鏈接浮動在左側
• 使用:hover偽類來為鼠標懸停時添加樣式
• 使用absolute定位屬性來為子導航設置位置
• 使用display屬性來控制子導航的顯示和隱藏

通過以上代碼即可輕松實現二級導航的設計。