P30-ART


ارسال موضوع ارسال پاسخ
 
امتیاز موضوع:
  • 0 رأی - میانگین امتیازات: 0
  • 1
  • 2
  • 3
  • 4
  • 5
قالب صفحات 404 با طرح مانستر سبز
نویسنده پیام
کاربر با تجربه
*****

ارسال‌ها: 537
تاریخ عضویت: اردیبهشت 1393
اعتبار: 43
وضعیت : آفلاین
جنسیت:
سپاس ها 398
سپاس شده 294 بار در 171 ارسال
ارسال: #1
قالب صفحات 404 با طرح مانستر سبز
[تصویر:  00102.png]

 
کد php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml">
<
head>
<
meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<
title>پیدا نشد دیگهچیکار کنم</title>
<
style>
htmlbodydivspan {
    
margin:0;
    
padding:0;
    
border:0;
    
font-size:100%;
    
font:inherit;
    
vertical-align:baseline;
    
font-family:"Helvetica Neue"Helvetica
}
html {
    -
webkit-text-size-adjust:none;
}
body {
    
background:#ecebe8;
}
{
    .
promo-box {
        
width:auto
    
}
    .
player .track {
        
max-width:170px
    
}
}
.
center {
    
text-align:center;
}
#main {
    
font-family:"Lucida Grande""Helvetica Neue"Helvetica
}
#error h1 {
    
color:#1d1d1d;
    
font-size:36px;
    
font-weight:bold;
    
text-shadow:0 1px 0 #414141;
    
margin-top:150px;
    
margin-right:100px;
    
text-align:right;
    
font-family:'b yekan'tahoma;
    
direction:rtl;
}
#error-monster-1 {
    
margin-top:45px;
    
background:url(http://www.pi3idl.com/wp-content/uploads/2014/02/back-dark.png);
    
width:235px;
    
height:237px;
}
@-
webkit-keyframes swinging {
    
from {
        -
webkit-transform:rotate(-7deg)
    }
    
to {
        -
webkit-transform:rotate(7deg)
    }
}
@-
moz-keyframes swinging {
    
from {
        -
moz-transform:rotate(-7deg)
    }
    
to {
        -
moz-transform:rotate(7deg)
    }
}
@-
o-keyframes swinging {
    
from {
        -
o-transform:rotate(-7deg)
    }
    
to {
        -
o-transform:rotate(7deg)
    }
}
@
keyframes swinging {
    
from {
        
transform:rotate(-7deg)
    }
    
to {
        
transform:rotate(7deg)
    }
}
#error-monster-2 {
    
-webkit-animation:swinging 1s ease-in-out infinite alternate;
    -
moz-animation:swinging 1s ease-in-out infinite alternate;
    -
o-animation:swinging 1s ease-in-out infinite alternate;
    
animation:swinging 1s ease-in-out infinite alternate;
    
margin-left:25px;
    
margin-top:216px;
    -
webkit-transform-origin:9010px;
    -
moz-transform-origin:75% -40px;
    -
o-transform-origin:75% -40px;
    
transform-origin:75% -40px;
}
#error-monster-3 {
    
margin-top:170px;
    
float:right;
    
margin-right:100px;
}
#error h1 {
    
margin-right:0;
}
.
container {
    
position:relative;
    
width:960px;
    
margin:0 auto;
    
padding:20px 0
}
.
container .column, .container .columns {
    
float:left;
    
display:inline;
    
margin-left:10px;
    
margin-right:10px
}
.
row {
    
margin-bottom:20px
}
.
column.alpha, .columns.alpha {
    
margin-left:0
}
.
column.omega, .columns.omega {
    
margin-right:0
}
.
container .one.column, .container .one.columns {
    
width:40px
}
.
container .two.columns {
    
width:100px
}
.
container .three.columns {
    
width:160px
}
.
container .four.columns {
    
width:220px
}
.
container .five.columns {
    
width:280px
}
.
container .six.columns {
    
width:340px
}
.
container .seven.columns {
    
width:400px
}
.
container .eight.columns {
    
width:460px
}
.
container .nine.columns {
    
width:520px
}
.
container .ten.columns {
    
width:580px
}
.
container .eleven.columns {
    
width:640px
}
.
container .twelve.columns {
    
width:700px
}
.
container .thirteen.columns {
    
width:760px
}
.
container .fourteen.columns {
    
width:820px
}
.
container .fifteen.columns {
    
width:880px
}
.
container .sixteen.columns {
    
width:940px
}
.
container .one-third.column {
    
width:300px
}
.
container .two-thirds.column {
    
width:620px
}
.
container .offset-by-one {
    
padding-left:60px
}
.
container .offset-by-two {
    
padding-left:120px
}
.
container .offset-by-three {
    
padding-left:180px
}
.
container .offset-by-four {
    
padding-left:240px
}
.
container .offset-by-five {
    
padding-left:300px
}
.
container .offset-by-six {
    
padding-left:360px
}
.
container .offset-by-seven {
    
padding-left:420px
}
.
container .offset-by-eight {
    
padding-left:480px
}
.
container .offset-by-nine {
    
padding-left:540px
}
.
container .offset-by-ten {
    
padding-left:600px
}
.
container .offset-by-eleven {
    
padding-left:660px
}
.
container .offset-by-twelve {
    
padding-left:720px
}
.
container .offset-by-thirteen {
    
padding-left:780px
}
.
container .offset-by-fourteen {
    
padding-left:840px
}
.
container .offset-by-fifteen {
    
padding-left:900px
}
@
media only screen and (min-width:768px) and (max-width:959px) {
    .
container {
        
width:768px
    
}
    .
container .column, .container .columns {
        
margin-left:10px;
        
margin-right:10px
    
}
    .
column.alpha, .columns.alpha {
        
margin-left:0;
        
margin-right:10px
    
}
    .
column.omega, .columns.omega {
        
margin-right:0;
        
margin-left:10px
    
}
    .
alpha.omega {
        
margin-left:0;
        
margin-right:0
    
}
    .
container .one.column, .container .one.columns {
        
width:28px
    
}
    .
container .two.columns {
        
width:76px
    
}
    .
container .three.columns {
        
width:124px
    
}
    .
container .four.columns {
        
width:172px
    
}
    .
container .five.columns {
        
width:220px
    
}
    .
container .six.columns {
        
width:268px
    
}
    .
container .seven.columns {
        
width:316px
    
}
    .
container .eight.columns {
        
width:364px
    
}
    .
container .nine.columns {
        
width:412px
    
}
    .
container .ten.columns {
        
width:460px
    
}
    .
container .eleven.columns {
        
width:508px
    
}
    .
container .twelve.columns {
        
width:556px
    
}
    .
container .thirteen.columns {
        
width:604px
    
}
    .
container .fourteen.columns {
        
width:652px
    
}
    .
container .fifteen.columns {
        
width:700px
    
}
    .
container .sixteen.columns {
        
width:748px
    
}
    .
container .one-third.column {
        
width:236px
    
}
    .
container .two-thirds.column {
        
width:492px
    
}
    .
container .offset-by-one {
        
padding-left:48px
    
}
    .
container .offset-by-two {
        
padding-left:96px
    
}
    .
container .offset-by-three {
        
padding-left:144px
    
}
    .
container .offset-by-four {
        
padding-left:192px
    
}
    .
container .offset-by-five {
        
padding-left:240px
    
}
    .
container .offset-by-six {
        
padding-left:288px
    
}
    .
container .offset-by-seven {
        
padding-left:336px
    
}
    .
container .offset-by-eight {
        
padding-left:348px
    
}
    .
container .offset-by-nine {
        
padding-left:432px
    
}
    .
container .offset-by-ten {
        
padding-left:480px
    
}
    .
container .offset-by-eleven {
        
padding-left:528px
    
}
    .
container .offset-by-twelve {
        
padding-left:576px
    
}
    .
container .offset-by-thirteen {
        
padding-left:624px
    
}
    .
container .offset-by-fourteen {
        
padding-left:672px
    
}
    .
container .offset-by-fifteen {
        
padding-left:720px
    
}
}
@
media only screen and (max-width:767px) {
    .
container {
        
width:300px
    
}
    .
container .columns, .container .column {
        
margin:0
    
}
    .
container .one.column, .container .one.columns, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column {
        
width:300px
    
}
    .
container .offset-by-one, .container .offset-by-two, .container .offset-by-three, .container .offset-by-four, .container .offset-by-five, .container .offset-by-six, .container .offset-by-seven, .container .offset-by-eight, .container .offset-by-nine, .container .offset-by-ten, .container .offset-by-eleven, .container .offset-by-twelve, .container .offset-by-thirteen, .container .offset-by-fourteen, .container .offset-by-fifteen {
        
padding-left:0
    
}
}
@
media only screen and (min-width:480px) and (max-width:767px) {
    .
container {
        
width:420px
    
}
    .
container .columns, .container .column {
        
margin:0
    
}
    .
container .one.column, .container .one.columns, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column {
        
width:420px
    
}
}
.
container:after {
    
content:"\0020";
    
display:block;
    
height:0;
    
clear:both;
    
visibility:hidden
}
.
clearfix:before, .clearfix:after, .row:before, .row:after {
    
content:'\0020';
    
display:block;
    
overflow:hidden;
    
visibility:hidden;
    
width:0;
    
height:0
}
.
row:after, .clearfix:after {
    
clear:both
}
.
row, .clearfix {
    
zoom:1
}
.
clear {
    
clear:both;
    
display:block;
    
overflow:hidden;
    
visibility:hidden;
    
width:0;
    
height:0
}
</
style>
</
head>
<
body>
<
h2><a href="http://www.pi3idl.com" style="position:fixed; top:10000%">مرجع کد و آموزش</a></h2>
<
h2><a href="http://www.pi3idl.com/2014/02/monester-404-page-template/" style="position:fixed; top:11000%">قالب صفحات 404 با طرح مانستر سبز</a></h2>
<
div id="main">
    <
div class="container">
        <
div id="error" class="sixteen columns clearfix">
            <
div id="error-monster-1" class="five columns alpha">
                <
img id="error-monster-2" src="http://www.pi3idl.com/wp-content/uploads/2014/02/single.png" />
            </
div>
            <
div class="eleven columns omega">
                    <
h1>شرمنده وقت شریفت ، محتوایی پیدا نکردم!!!</h1>
 
                <
img id="error-monster-3" src="http://www.pi3idl.com/wp-content/uploads/2014/02/footer.png" />
            </
div>
        </
div>
    </
div>
</
div>
</
body>
</
html
منبع : پی سی دی

ســیــتــی فــانــــ

انجمن تفریحی تک آرام


انجمن تک آرام به دنبال گروه مدیریت میگردد ... !!!

پس کلیک کنین ...

02-22-1393 07:27 ب.ظ
مشاهده‌ی وب‌سایت کاربر یافتن تمامی ارسال‌های این کاربر نقل قول این ارسال در یک پاسخ
ارسال موضوع ارسال پاسخ


پرش به انجمن:


کاربرانِ درحال بازدید از این موضوع: 1 مهمان