jquery.fullPage+bootstrap实现全屏幻灯片式个人简历网站代码
代码语言:html
所属分类:布局界面
代码描述:jquery.fullPage+bootstrap实现全屏幻灯片式个人简历网站代码
代码标签: jquery.fullPage bootstrap 全屏 幻灯片 个人 简历 网站 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<meta name="description" content="Web designer and front-end developer">
<link href='https://fonts.googleapis.com/css?family=Raleway:100,200,400,600' rel='stylesheet' type='text/css'>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/jquery.fullPage.2.9.5.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/animate.3.5.1.css">
<style>
/* general styles */
body {
font-family: "Raleway", sans-serif !important;
}
ul {
list-style-type: none;
}
a {
text-decoration: none !important;
}
h1 {
color: #ff6363;
font-weight: bold;
}
p {
font-size: 20px;
color: #484848;
}
.section {
text-align: center;
}
.skillbar {
cursor: pointer;
}
.hide {
display: none;
}
.display {
display: block;
}
/* flash alert styles */
.flash-container {
width: 100%;
position: fixed;
z-index: 700;
padding-top: 20px;
font-weight: bold;
}
.alert {
text-align: center !important;
width: 500px !important;
margin-left: auto !important;
margin-right: auto !important;
color: #211809 !important;
}
/* Nav Screen */
.nav-screen {
height: 100%;
z-index: 500;
position: fixed;
background-color: #000;
opacity: 1;
right: -285px; /* start off behind the scenes */
-webkit-font-smoothing: antialiased;
position: fixed;
width: 285px;
}
.nav-screen .active {
display: block;
}
/* nav header links */
.nav-brand {
position: fixed;
left: 0;
z-index: 600;
padding: 10px;
}
.nav-brand img {
width: 50px;
}
.fa-bars {
display: none !important;
color: #ff6363;
float: right;
padding: 20px;
position: fixed;
right: 0;
z-index: 500;
cursor: pointer;
}
.fa-times {
color: #ff6363;
float: right;
padding: 20px;
right: 0;
z-index: 600;
cursor: pointer;
}
.header-links {
position: fixed;
width: 100%;
z-index: 500;
}
.header-links li {
color: white;
display: inline;
float: right;
padding: 15px;
font-size: 16px;
}
.header-links a {
color: #757575;
-webkit-transition: all 0.2s ease-in;
}
.header-links a:hover {
color: #ff6363 !important;
}
/* slide out nav menu styles */
.nav-container {
padding-top: 10%;
}
.nav-links {
width: 250px;
text-align: center;
margin-left: auto;
margin-right: auto;
}
.nav-links ul {
margin-top: 15%;
text-align: center;
padding-top: 10%;
}
.nav-links a {
color: #ffffff;
font-size: 30px;
line-height: 2.5;
font-weight: bold;
text-decor.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0