|
@ -1,5 +1,6 @@ |
|
|
<!DOCTYPE html> |
|
|
<!DOCTYPE html> |
|
|
<html lang="zh-CN"> |
|
|
<html lang="zh-CN"> |
|
|
|
|
|
|
|
|
<head> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta charset="UTF-8"> |
|
|
<title>Dnomd343</title> |
|
|
<title>Dnomd343</title> |
|
@ -14,28 +15,35 @@ |
|
|
height: 100vh; |
|
|
height: 100vh; |
|
|
margin: 0; |
|
|
margin: 0; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.full-height { |
|
|
.full-height { |
|
|
height: 100vh; |
|
|
height: 100vh; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.flex-center { |
|
|
.flex-center { |
|
|
align-items: center; |
|
|
align-items: center; |
|
|
display: flex; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
justify-content: center; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.position-ref { |
|
|
.position-ref { |
|
|
position: relative; |
|
|
position: relative; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.top-right { |
|
|
.top-right { |
|
|
position: absolute; |
|
|
position: absolute; |
|
|
right: 10px; |
|
|
right: 10px; |
|
|
top: 18px; |
|
|
top: 18px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.content { |
|
|
.content { |
|
|
text-align: center; |
|
|
text-align: center; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.title { |
|
|
.title { |
|
|
font-size: 84px; |
|
|
font-size: 84px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.links>a { |
|
|
.links>a { |
|
|
color: #636b6f; |
|
|
color: #636b6f; |
|
|
padding: 0 25px; |
|
|
padding: 0 25px; |
|
@ -44,9 +52,11 @@ |
|
|
letter-spacing: .1rem; |
|
|
letter-spacing: .1rem; |
|
|
text-decoration: none; |
|
|
text-decoration: none; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.m-b-md { |
|
|
.m-b-md { |
|
|
margin-bottom: 30px; |
|
|
margin-bottom: 30px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.title a img { |
|
|
.title a img { |
|
|
max-height: none!important; |
|
|
max-height: none!important; |
|
|
width: 120px; |
|
|
width: 120px; |
|
@ -59,13 +69,35 @@ |
|
|
-moz-transition: -moz-transform 600ms; |
|
|
-moz-transition: -moz-transform 600ms; |
|
|
transition: transform 600ms; |
|
|
transition: transform 600ms; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.title a img:hover { |
|
|
.title a img:hover { |
|
|
-webkit-transform: rotate(360deg); |
|
|
-webkit-transform: rotate(360deg); |
|
|
-moz-transform: rotate(360deg); |
|
|
-moz-transform: rotate(360deg); |
|
|
transform: rotate(360deg); |
|
|
transform: rotate(360deg); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ICP { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
left: 0px; |
|
|
|
|
|
right: 0px; |
|
|
|
|
|
bottom: 20px; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ICP a { |
|
|
|
|
|
text-decoration: none; |
|
|
|
|
|
color: #636b6f; |
|
|
|
|
|
padding: 0 25px; |
|
|
|
|
|
font-size: 12px; |
|
|
|
|
|
font-weight: 600; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.ICP a:hover { |
|
|
|
|
|
color: #343; |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |
|
|
</head> |
|
|
</head> |
|
|
|
|
|
|
|
|
<body> |
|
|
<body> |
|
|
<div class="flex-center position-ref full-height"> |
|
|
<div class="flex-center position-ref full-height"> |
|
|
<div class="content"> |
|
|
<div class="content"> |
|
@ -79,7 +111,12 @@ |
|
|
<a target="_blank" href="https://space.bilibili.com/32477702">哔哩哔哩</a> |
|
|
<a target="_blank" href="https://space.bilibili.com/32477702">哔哩哔哩</a> |
|
|
<a target="_blank" href="https://github.com/dnomd343">GitHub</a> |
|
|
<a target="_blank" href="https://github.com/dnomd343">GitHub</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="ICP"> |
|
|
|
|
|
<a target="_blank" href="http://www.beian.miit.gov.cn/">粤ICP备20041813号</a> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</body> |
|
|
</body> |
|
|
|
|
|
|
|
|
</html> |
|
|
</html> |