css实现菜单点击锚点页面过渡切换动画效果代码
代码语言:html
所属分类:布局界面
代码描述:css实现菜单点击锚点页面过渡切换动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="" /> <meta name="keywords" content="" /> <meta name="author" content="Your name" /> <style> /* CSS reset */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; } html,body { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } input { border: 1px solid #b0b0b0; padding: 3px 5px 4px; color: #979797; width: 190px; } address,caption,cite,code,dfn,th,var { font-style: normal; font-weight: normal; } ol,ul { list-style: none; } caption,th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } q:before,q:after { content: ''; } abbr,acronym { border: 0; } /* General Demo Style */ body { font-family: 'Electrolize', Arial, sans-serif; font-weight: 400; font-size: 15px; color: #fff; } a { text-decoration: none; } .clr { clear: both; } /* Top Bar Style */ .codrops-top { line-height: 24px; font-size: 11px; background: rgba(255, 255, 255, 1); text-transform: uppercase; z-index: 9999; position: fixed; top: 0px; left: 0px; width: 100%; height: 24px; box-shadow: 1px 0px 2px rgba(0,0,0,0.2); -.........完整代码请登录后点击上方下载按钮下载查看
网友评论0