Hướng dẫn làm menu đa cấp sử dụng hiệu ứng CSS3 cực đẹp
Các bạn có thể để lại email để nhận file code mẫu
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
Đăng ký kênh để nhận thông báo video mới nhất từ SUNTECH:
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
Link chi tiết các video học lập trình tại SUNTECH:
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
Các thẻ hash tag quan trọng của bài học
#hochtmlcss #hoclaptrinhweb #hoclaptrinhmienphi
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
Mọi chi tiết xin liên hệ:
Name: Phạm Kỳ Khôi
Email: daotaolaptrinhsuntech@gmail.com
Phone: 0942 668 586
Zalo: 0942 668 586
Website:
Facebook:
Group Facebook:
Nguồn: https://new-weekend.com/
Xem thêm bài viết khác: https://new-weekend.com/meo-vat/
cảm ơn anh!!!
Mình xin code: Huynhbkhn@gmail.com
cho em xin file code mẫu vs ạ hoangsociu18@gmail.com
cho em xin code ạ: tranxuanthaimino@gmail.com
cho em xin code với ạ!
mr.minhoan@gmail.com
cho em xin code với ak phuongnoo2001@gmail.com
video rất hay, e cảm ơn a nhiều
cho em xin code với ạ. nguyenxuan05101999@gmail.com
anh ơi, cho em xin code vs ạ. hoangminhzxzx@gmail.com ….. em code giống anh nhưng cái submenu không hiện ra khi em trỏ chuột vào li cha là sao vậy a, em cám ơn ạ
cho em xin file mẫu ạ : nguyenthilyly0903@gmail.com
a ơi cho e xin code vs ạ: thaoat12@gmail.com
cho em xin code voi a trannhoanh99@gmail.com
cho e xin code ạ. nguyenhung15112001@gmail.com .E cảm ơn ạ
cho em xin code ạ: truongvanthuan45@gmail.com
Cho em xin code mẫu với ạ phuocducmaihong@gmail.com
cho em xin code ạh. quangklynk@gmail.com
<!DOCTYPE html>
<html>
<head>
<title>Hướng dẫn làm menu đa cấp bằng CSS</title>
</head>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body{
font-family: sans-serif;
font-size: 18px;
}
.container{
width: 680px;
height: 40px;
background: #6d136a;
margin: 50px auto;
}
ul.root > li {
list-style: none;
float: left;
position: relative;
}
ul.root > li > a{
text-decoration: none;
color: #fff;
padding: 0px 12px 0px 12px;
line-height: 40px;
display: block;
}
ul.root > li > a:hover{
background-color: yellow;
color: red;
transform: ease-in 0.35s;
}
ul.submenu
{
width: 250px;
background: #6d136a;
min-height: 80px;
display: none;
position: absolute;
}
ul.submenu li
{
list-style: none;
}
ul.submenu li a
{
text-transform: none;
text-decoration: none;
color: #fff;
display: block;
border: 1px solid #ccc;
line-height: 40px;
text-indent: 10px;
}
ul.root > li:hover ul.submenu{
display: block;
background-color: #6d136a;
color: red;
transform: ease-in 0.35s;
}
ul.submenu li a:hover{
background-color: yellow;
color: red;
transform: ease-in 0.35s;
}
</style>
<body>
<div class="container">
<div class="menu" >
<ul class="root">
<li><a href="#">Home</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Shop</a>
<ul class="submenu">
<li><a href="#">Women</a></li>
<li><a href="#">Man</a></li>
<li><a href="#">Kid</a></li>
</ul>
</li>
<li><a href="#">Game</a></li>
<li><a href="#">Container</a></li>
</ul>
</div>
</div>
</body>
</html>
huynhtanthuvip@gmail.com cho e xin file mẫu ạ. Thanks
cho e xin file mẫu với ạ toiluonlatoi100@gmail.com. a cho e hỏi thêm là trang của e xem trên máy tính thì rê chon trỏ vào sẽ hiện ra menu đa cấp, nhưng trên giao diện mobile thì e click vào sẽ hiện ra menu đấy, nhưng e click lần nữa nó ko mất đi ạ (phải nhấn chuột ra chỗ khác thì menu đa cấp mới thu lại), e ko biết e thiếu thuộc tính gì ạ, a có thể cho e biết được không ạ
Cho mình xin file psd ạ
ngocphuc1399@gmail.com cho e xin với ạ
cho em xin file ạ gmail: tuanho37na@gmail.com
doankien99th@gmail.com
Cho e xin code mẫu với ạ.
Em cảm ơn