六边形动态特效404单页HTML源码

CSDN专家-微编程

于 2024-07-17 05:47:33 发布

阅读量582

点赞数 21

分类专栏： HTML项目文章标签： html 前端

本文链接：https://blog.csdn.net/technologist_28/article/details/140482855

版权

源码介绍

动态悬浮的六边形，旁边404文字以及跳转按钮，整体看着像科技二次元画风，页面简约美观，可以做网站错误页或者丢失页面，将下面的代码放到空白的HTML里面，然后上传到服务器里面，设置好重定向即可

效果预览

在这里插入图片描述

完整源码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Saransh Sinha 404</title>
		<style>body {
     
  background-color: #2F3242;
}
svg {
     
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -250px;
  margin-left: -400px;
}
.message-box {
     
  height: 200px;
  width: 380px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -100px;
  margin-left: 50px;
  color: #FFF;
  font-family: Roboto;
  font-weight: 300;
}
.message-box h1 {
     
  font-size: 60px;
  line-height: 46px;
  margin-bottom: 40px;
}
.buttons-con .action-link-wrap {
     
  margin-top: 40px;
}
.buttons-con .action-link-wrap a {
     
  background: #68c950;
  padding: 8px 25px;
  border-radius: 4px;
  color: #FFF;
  font-weight: bold;
  font-size: 14px;
  transition:

最低0.47元/天解锁文章

CSDN专家-微编程

关注

21
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
六边形动态特效404单页HTML源码

动态悬浮的六边形，旁边404文字以及跳转按钮，整体看着像科技二次元画风，页面简约美观，可以做网站错误页或者丢失页面，将下面的代码放到空白的HTML里面，然后上传到服务器里面，设置好重定向即可
复制链接

扫一扫