色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css3動態菜單

阮建安1年前7瀏覽0評論

CSS3動態菜單可以為網站添加更多的交互性和生動性,讓用戶更加方便快捷地獲取到網站提供的內容。

.nav {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #232323;
padding: 10px;
}
.nav a {
color: #fff;
font-size: 16px;
text-decoration: none;
text-transform: uppercase;
margin-right: 20px;
transition: all 0.3s ease;
}
.nav a:hover {
color: #8b8b8b;
}
.dropdown {
position: relative;
}
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
width: 150px;
background-color: #fff;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
display: none;
}
.dropdown:hover .dropdown-menu {
display: block;
}
.dropdown-menu a {
color: #232323;
font-size: 14px;
padding: 10px;
display: block;
text-decoration: none;
}
.dropdown-menu a:hover {
background-color: #f2f2f2;
}

以上是一個簡單的CSS3動態菜單的代碼,其中通過使用偽類:hover來實現鼠標懸停時的菜單展開和收縮效果。這個菜單還加入了下拉菜單功能,可以方便地展示子菜單。通過這個代碼,我們可以實現一個簡潔實用的網站導航菜單。