404页⾯模板php,Thinkphp5⽼司机⽹站报错404页⾯模板源码来，来，来，学习下怎么做前端页⾯，分享个⽼司机⽹站报错404页⾯模板源码，
另外给提个建议，最好是有个地⽅可以上传源码⽂件的，这样⼦格式就不会有什么问题了。⼀般复制出去⼤家最好都⽤UTF-8格式。
Html代码如下：html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
⽼司机动画⽹站访问出错404页⾯模板
哎呦~ ⽼司机居然累倒了!
※ 别急，⼯程师正在紧急处理，马上就好。
※ 您可QQ:826096331，通知⼆当家的开发⼈员!
※ 感谢您对阳光好车的⽀持，请您耐⼼等待!
返回⾸页
返回⾸页
返回⾸页
返回⾸页
CSS样式代码如下：html, body {margin:0px;height:100%; font-family:"微软雅⿊";}i{ font-
style:normal;}.pr{ position:relative;}.pa{ position:absolute;}.fl{ float:left;}.mb15{ margin-
bottom:15px;}.error_new_bg { height: 100%; width: 100%; }.error_new_content { width: 100%; height: 100%; text-
align: center; margin: 0 auto; background: url(/images/error.png) no-repeat center center; min-
width: 1000px; }.error_new { top: 50%; left: 50%; margin: -185px 0 0 -
500px; height: 371px; width: 1000px; }.error_new_left { width: 56%; text-align: right; -webkit-animation: desc_link ease-in-out 1.5s infinite }
@-webkit-keyframes desc_link { 0% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
-0-transform:translateY(0);
-moz-transform:translateY(0);transform:translateY(0);
}
50% {
-webkit-transform:translateY(1em);
-ms-transform:translateY(1em);
-0-transform:translateY(1em);
-moz-transform:translateY(1em);transform:translateY(1em);
}
100% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
-0-transform:translateY(0);
-moz-transform:translateY(0);transform:translateY(0);
}
}.error_new_right { width: 40%; text-align: left; margin-top:7%; margin-left: 4%; vertical-align: middle }
.error_new_right_btn { width: 150px; height: 46px; background: #F96900; display: inline-block; color: #fff; line-
height: 46px; border-radius: 3px; text-align: center; z-index: 10 }
.error_new_right_btn a { color: #fff; text-align: center; font-size: 16px; width: 150px; height: 46px; display: inline-
block; }.error_detail { margin:0px; height: auto; }.error_detail .error_p_title{ font-
size: 28px; color: #fff;}.error_detail .error_p_con{ font-size:14px; margin-top:10px; line-height: 20px; color:#fff;}.type-
2 { background: #F96900; text-indent: 0; height: 46px; width: 150px; border-radius: 3px; }.type-
3 { background: #F96900; text-indent: 0; height: 46px; width: 150px; border-radius: 3px; }.type-
2 i { position: absolute; width: 150px; height: 46px; line-height: 46px; display: block; top: 0; opacity: 1; left: 0; box-
sizing: border-box; -moz-box-sizing: border-box; -webkit-transition: all 0.3s linear; transition: all 0.3s linear; text-
align: center; color: #ffe8e8; border-radius: 3px; }.type-2 i:nth-of-type(2), .type-2 i:nth-of-type(3) { -webkit-
transform: rotateY(-90deg); transform: rotateY(-90deg); transform-origin: 0 0; -webkit-transform-
origin: 0 0; clip: rect(0,60px,9999px,0); border-shadow: 4px; }.type-2 i:nth-of-type(3) { transform-origin: 100% 100%; -webkit-transform-origin: 100% 100%; -webkit-
transform: rotateY(90deg); transform: rotateY(90deg); clip: rect(0,9999px,9999px,60px); border-shadow: 4px; }.type-2:hover i:nth-of-type(2), .type-2:hover i:nth-of-type(3) { -webkit-
transform: rotateY(0); transform: rotateY(0); background: #fff; color: #fff; }.type-2:hover i:first-of-
type { background: #fff; }.type-2 i:last-of-type { opacity: 0; background: #fff; color: #ff464b; -webkit-
borderboxtransition: none; transition: none; }.type-3 i:last-of-type { color: #F96900; }.type-2:hover i:last-of-type { opacity: 1; -webkit-transition: all 0.05s linear 0.3s; transition: all 0.05s linear 0.3s; }
整个页⾯只⽤到了⼀个图⽚：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。