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