نوشته شده توسط : S1I2N3A4

http://s6.picofile.com/file/8209025100/Screen.png

کدphp:

موس رو روی نوشته چهار آنلاین ببرید و زیبایی رو احساس کنید

<!DOCTYPE html> 
<
html lang="en">
<
head>
    <
meta charset="UTF-8">
    <
title>4oNliNe</title>
    <
style type="text/css">
        *, *:
after, *:before {
          
box-sizingborder-box;
        }

        .
hidden {
          
height0;
          
width0;
          
overflowhidden;
          
positionabsolute;
        }

        
/* Background colors */
        
.color-background#E8E0DA; }
        
.color-background#576b67; }
        
.color-background#383A35; }
        
.color-background#333; }
        
.color-background#fda9a9; }
        
.color-background#cde7d3; }
        
.color-background#DCECDD; }
        
.color-background#dedbba; }
        
.color-10 background#222; }
        
.color-11 background#515151; }

        /* General link styles */
        
.grid {
            
text-aligncenter;
            
padding200px;
        }

        .
link {
            
outlinenone;
            
text-decorationnone;
            
positionrelative;
            
font-size8em;
            
line-height1;
            
color#9e9ba4;
            
displayinline-block;
        }

        
/* Urpi */
        
.link--urpi {
            
font-family'Oswald'sans-serif;
            
font-size10em;
            
font-weight700;
            
text-transformuppercase;
            
color#e78383;
            
-webkit-transitioncolor 0s 0.5s;
            
transitioncolor 0s 0.5s;
        }

        .
link--urpi:hover {
            
colortransparent;
            -
webkit-transitionnone;
            
transitionnone;
        }

        .
link--urpi::before,
        .
link--urpi::after {
            
contentattr(data-letters);
            
positionabsolute;
            
top0;
            
left0;
            
color#e78383;
            
overflowhidden;
            -
webkit-backface-visibilityhidden;
            -
webkit-transitioncolor 0.5s, -webkit-transform 0.5s;
            
transitioncolor 0.5stransform 0.5s;
        }

        .
link--urpi::before {
            -
webkit-clip-pathurl(#cp_up); 
            
clip-pathurl(#cp_up);
        
}

        .
link--urpi::after {
            -
webkit-clip-pathurl(#cp_down); 
            
clip-pathurl(#cp_down);
        
}

        .
link--urpi:hover::before,
        .
link--urpi:hover::after {
            
color#fff;
            
-webkit-transitioncolor 0.5s, -webkit-transform 0.5s;
            
transitioncolor 0.5stransform 0.5s;
        }

        .
link--urpi:hover::before {
            -
webkit-transformtranslate3d(4px,1px,0);
            
transformtranslate3d(4px,1px,0);
        }

        .
link--urpi:hover::after {
            -
webkit-transformtranslate3d(-4px,-1px,0);
            
transformtranslate3d(-4px,-1px,0);
        }
    </
style>
</
head>
<
body>
    <
div class="grid color-5">
        <
class="link link--urpi" href="#" data-letters="4oNliNe">4oNliNe</a>
    </
div>

    <
svg class="hidden" viewBox="0 0 390 160">
        <
defs>
            <
clippath id="cp_up">
                <
polygon id="cp_poly_up" points="0,0 390,0 390,160" />
            </
clippath>
            <
clippath id="cp_down">
                <
polygon id="cp_poly_down" points="0,0 0,160 390,160" />
            </
clippath>
        </
defs>
    </
svg>
</
body>
</
html

 

 




:: موضوعات مرتبط: نکات و دستورات چت روم , ,
:: بازدید از این مطلب : 5264
|
امتیاز مطلب : 12
|
تعداد امتیازدهندگان : 3
|
مجموع امتیاز : 3
تاریخ انتشار : دو شنبه 7 / 6 / 1394 | نظرات ()
مطالب مرتبط با این پست
لیست
می توانید دیدگاه خود را بنویسید

/weblog/file/img/m.jpg
چهار آنلاین در تاریخ : 1394/6/11/3 - - گفته است :
سلام
واقعا خوشحالم هنوز کسانی هستن که منبع رو ذکر میکنن

ممنون از شما
چهار آنلاین
www.fo4r.ir


نام
آدرس ایمیل
وب سایت/بلاگ
:) :( ;) :D
;)) :X :? :P
:* =(( :O };-
:B /:) =DD :S
-) :-(( :-| :-))
نظر خصوصی

 کد را وارد نمایید:

آپلود عکس دلخواه: