jquery+css实现自适应多级下拉菜效果代码
代码语言:html
所属分类:菜单导航
代码描述:jquery+css实现自适应多级下拉菜效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/modernizr.2.8.3.js"></script> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css"> <style> @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,700,800); *,html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,label,fieldset,input,p,blockquote,th,td { margin: 0; padding: 0; } article,aside,figure,footer,header,hgroup,nav,section { display: block; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { -webkit-font-smoothing: antialiased; } a { color: #BA0707; text-decoration: none; } a:hover { color: #FF675C; } body { background: #e5e5e5; color: #374147; font: 14px "Open Sans",Helvetica,Arial,sans-serif; -webkit-font-smoothing: antialiased; line-height: 1; width: 100%; } nav { display: block; background: #374147; } .menu { display: block; } .menu li { display: inline-block; position: relative; z-index: 100; } .menu li:first-child { margin-left: 0; } .menu li a { font-weight: 600; text-decoration: none; padding: 20px 15px; display: block; color: #fff; transition: all 0.2s ease-in-out 0s; } .........完整代码请登录后点击上方下载按钮下载查看
网友评论0