实例教程 利用html5和css3打造一款创意404页面_html5教程技巧

　　今天要脚本之家的小编要再给大家带来一款html5和css3打造的创意404页面。一起看下效果图吧：

　　实现的代码

　　html代码：

　　

复制代码

代码如下:

　　css代码：

复制代码

代码如下:

.me404 {
width: 1000px;
height: 480px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -400px;
margin-top: -240px;
}
.st0 {
fill-rule: evenodd;
clip-rule: evenodd;
fill: #E8EBED;
}
.st1 {
fill: #FFFFFF;
stroke: #89949B;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
stroke-miterlimit: 10;
}
.st2 {
fill-rule: evenodd;
clip-rule: evenodd;
fill: #DBDFE1;
}
.st3 {
fill: #FFFFFF;
}
.st4 {
fill-rule: evenodd;
clip-rule: evenodd;
fill: #E8EBED;
stroke: #89949B;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
stroke-miterlimit: 10;
}
.st5 {
fill-rule: evenodd;
clip-rule: evenodd;
fill: #FFFFFF;
stroke: #89949B;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
stroke-miterlimit: 10;
}
.st6 {
fill-rule: evenodd;
clip-rule: evenodd;
fill: none;
stroke: #89949B;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
stroke-miterlimit: 10;
}

通过以上两种代码就可以实现一款很有创意404页面。大家可以尝试一下哦。