css自适应多级导航菜单效果代码
代码语言:html
所属分类:菜单导航
代码描述:css自适应多级导航菜单效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css"> <style> @font-face { font-family: 'Varela Round'; font-style: normal; font-weight: 400; src: url(https://fonts.gstatic.com/s/varelaround/v20/w8gdH283Tvk__Lua32TysjIfp8uK.ttf) format('truetype'); } * { box-sizing: border-box; } :root { --accent-color: #45494E; --gradient-color: #FBFBFB; } a:focus { outline: none; position: relative; } a:focus:after { width: 50px; } a:after { content: ""; background: #FBFBFB; position: absolute; bottom: 5px; left: 15px; height: 3px; width: 0; transition: 0.5s; transition-delay: 0.2s; } body { background: #45494E; font-family: "Varela Round", Nunito, Montserrat, sans-serif; margin: 0; padding: 0; text-transform: capitalize; } .menu { margin: 15px; } .menu > ol { list-styl.........完整代码请登录后点击上方下载按钮下载查看
网友评论0