創(chuàng)建多級選單是Web開發(fā)中常見的需求，利用CSS可以方便地實現(xiàn)這一功能，下面，我們將詳細介紹如何利用CSS創(chuàng)建多級選單。

我們需要定義HTML結(jié)構(gòu)，一個典型的多級選單包含多個層級，每個層級又包含多個選項，我們可以使用嵌套的<ul>和<li>元素來構(gòu)建這樣的結(jié)構(gòu)。

<ul class="multi-select">
    <li>
        <span>選項1</span>
        <ul>
            <li><span>子選項1</span></li>
            <li><span>子選項2</span></li>
        </ul>
    </li>
    <li>
        <span>選項2</span>
        <ul>
            <li><span>子選項3</span></li>
            <li><span>子選項4</span></li>
        </ul>
    </li>
    <li>
        <span>選項3</span>
        <ul>
            <li><span>子選項5</span></li>
            <li><span>子選項6</span></li>
        </ul>
    </li>
</ul>

我們利用CSS來美化這個選單，我們可以使用CSS的列表樣式（list-style）來隱藏默認的列表符號，并使用背景色和邊框來增強可讀性。

.multi-select {
    list-style: none;
    background-color: #f0f0f0;
    border: 1px solid #000;
}
.multi-select li {
    list-style: none;
    background-color: #fff;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
}
.multi-select li:first-child {
    border-top: 0;
}
.multi-select li > ul {
    margin-left: 20px; /* 縮進子選項 */
}

我們可以使用JavaScript來添加交互功能，例如點擊選項來展開或收起子選項，但請注意，這不在本篇文章的討論范圍內(nèi)。

利用CSS可以方便地創(chuàng)建多級選單，并通過簡單的樣式調(diào)整來美化其外觀，希望這篇文章能幫助你實現(xiàn)所需的功能。