css实现立体凹凸导航条导航栏效果代码

代码语言:html

所属分类:菜单导航

代码描述:css实现立体凹凸导航条导航栏效果代码

代码标签: css 立体 凹凸 导航条 导航栏

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
        .cf:before,.cf:after {
	content:"";
	display:table;
}
.cf:after {
	clear:both;
}
body {
	background:#a9b6c8;
	color:#fff;
	font:14px/18px Arial,sans-serif;
	text-align:center;
}
p {
	bottom:10px;
	left:10px;
	position:absolute;
}
a {
	color:#fff;
}
/*--------------------------------------------------------------1.0 - TOOLBAR--------------------------------------------------------------*/.toolbar {
	left:50%;
	margin:-60px 0 0 -140px;
	position:absolute;
	top:50%;
	width:280px;
	border-radius:.........完整代码请登录后点击上方下载按钮下载查看

网友评论0