在網頁開發中，我們經常需要使用菜單來導航網站內容。一種比較常見的菜單樣式就是向上彈出菜單樣式。如下圖：

<ul class="menu">
<li>首頁</li>
<li>產品分類
<ul class="sub-menu">
<li>電子產品</li>
<li>生活用品</li>
</ul>
</li>
<li>關于我們</li>
</ul>

使用CSS實現向上彈出菜單，需要先隱藏子菜單，然后通過:hover偽類來實現鼠標滑過時顯示子菜單。以下是實現向上彈出菜單的CSS樣式：

.menu li {
position: relative;
display: inline-block;
padding: 0 10px;
}
.sub-menu {
display: none;
position: absolute;
top: -100%;
left: 0;
background-color: #fff;
border: 1px solid #ccc;
padding: 10px;
}
.menu li:hover .sub-menu {
display: block;
}

以上代碼中，我們給.menu li添加了position: relative屬性，使其成為相對定位元素，以便給子元素.sub-menu創建絕對定位時的參考點。然后給.sub-menu添加了position: absolute屬性，使其成為絕對定位元素，top: -100%把子菜單放到父元素上方，實現向上彈出效果。

最后，在.menu li:hover .sub-menu使用:hover偽類來實現鼠標滑過時顯示子菜單。

通過以上CSS樣式，我們就可以實現一個簡單的向上彈出菜單了。