Wednesday, March 7, 2012

Cara Buat Logo Windows 8

Cara Buat Logo Windows 8 - Ini buat Anda yang ingin Mencoba coba buat Logo pada windows 8, kali ini Ali Bloggers akan bagikan Tutorial Cara Buat Logo Windows 8 dan silahkan disimak dibawah ini (kalau ngerti Juga :D)V�ib Nagu te teate, Microsoft on kinnitanud suur uuendus Windows Logo. Ettev�te on kaotades 4-v�rvi lipu See on osa Windows logo k�ivitamisest alates Windows XP 2001.

Uus logo Windows sisaldab 4 plaadid loodud �hev�rviline.Ametlik v�rv oleks sinine, kuid v�rvi muutus s�ltuvalt Could kasutaja personaalse valikuid.Plaadid on antud perspektiivi ja on paigutatud vasakule k�ljele tekst "Windows 8"

Newly styled Windows Logo

Logo on muutunud lihtsamaks ja veebidisainerid on saanud rohkem v�imu l�bi CSS3-nii, entusiast nimega Vasiliy Zubach Windows 8 loonud logo kasutada ainult HTML ja CSS! Pange t�hele, et kood t��tab korralikult ainult t�ielikult toetada CSS3 brauserid ... Pole ime, et Internet Explorer ei ole �ks neist. Aga see peaks t��tama teiste brauseritega ilma igasuguste probleemideta (Kui teil on viimane versioon neist)

Siin on kood, mis trikk:


HTML Part

Windows 8
CSS for Design
.window {
position: relative;
float: left;
margin-left: 50px;
width: 200px;
height: 150px;
background: #00adef;
-webkit-transform: perspective(400px) rotateY(-25deg);
-moz-transform: perspective(400px) rotateY(-25deg);
-ms-transform: perspective(400px) rotateY(-25deg);
-o-transform: perspective(400px) rotateY(-25deg);
transform: perspective(400px) rotateY(-25deg);
-webkit-animation: windows_animation 5s infinite;
-moz-animation: windows_animation 5s infinite;
-ms-animation: windows_animation 5s infinite;
}
.window::after, .window::before {
content: '';
background: #fff;
height: 100%; width: 10px;
left: 50%;
margin-left:-5px;
top:0;
position: absolute;
}
.window::before {
left: 0;
top: 50%;
margin-top: -5px;
margin-left: 0;
height: 10px;
width: 100%;
position: absolute;
}
.logo_text {
color: #00adef;
line-height: 150px;
font-size: 130px;
padding-left: 20px;
float: left;
}
CSS for Animation
@-webkit-keyframes windows_animation {
0%, 100% {
-webkit-transform: perspective(400px) rotateY(-25deg);
}
50% {
-webkit-transform: perspective(400px) rotateY(-35deg);
}
}
@-moz-keyframes windows_animation {
0%, 100% {
-moz-transform: perspective(400px) rotateY(-25deg);
}
50% {
-moz-transform: perspective(400px) rotateY(-35deg);
}
}
@-ms-keyframes windows_animation {
0%, 100% {
-ms-transform: perspective(400px) rotateY(-25deg);
}
50% {
-ms-transform: perspective(400px) rotateY(-35deg);
}
}
Kira Kira Paham dan Ngerti gak gan Cara Buat Logo Windows 8 nya?
rating 5