svg+css实现简洁404页面代码
代码语言:html
所属分类:布局界面
代码描述:svg+css实现简洁404页面代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
@import url("https://fonts.googleapis.com/css?family=Fira+Sans");
/*Variables*/
.left-section .inner-content {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
* {
box-sizing: border-box;
}
html, body {
margin: 0;
padding: 0;
}
body {
font-family: "Fira Sans", sans-serif;
color: #f5f6fa;
}
.background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(#0C0E10, #446182);
}
.background .ground {
position: absolute;
bottom: 0;
width: 100%;
height: 25vh;
background: #0C0E10;
}
@media (max-width: 770px) {
.background .ground {
height: 0vh;
}
}
.container {
position: relative;
margin: 0 auto;
width: 85%;
height: 100vh;
padding-bottom: 25vh;
display: flex;
flex-direction: row;
justify-content: space-around;
}
@media (max-width: 770px) {
.container {
flex-direction: column;
padding-bottom: 0vh;
}
}
.left-section, .right-section {
position: relative;
}
.le.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0