css实现淡入淡出效果的多级下拉菜单效果代码
代码语言:html
所属分类:菜单导航
代码描述:css实现淡入淡出效果的多级下拉菜单效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Karla'> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css"> <style> html, body{ padding:0px; margin:0px; background:#222; font-family: 'Karla', sans-serif; width:100vw; } body * { margin:0; padding:0; } /* HTML Nav Styles */ /* HTML Nav Styles */ /* HTML Nav Styles */ nav menuitem { position:relative; display:block; opacity:0; cursor:pointer; } nav menuitem > menu { position: absolute; pointer-events:none; } nav > menu { display:-webkit-box; display:-ms-flexbox; display:flex; } nav > menu > menuitem { pointer-events: all; opacity:1; } menu menuitem a { white-space:nowrap; display:block; } menuitem:hover > menu { pointer-events:initial; } menuitem:hover > menu > menuitem, .........完整代码请登录后点击上方下载按钮下载查看
网友评论0