October, 2012 | Engin Polat'ın Windows, Web, Mobile ve Game içerikli programcılık sitesi

Arşiv

2012 October ayı için arşiv

CSS kullanarak şekiller oluşturmak

18 October 2012 Yorum yapılmamış

Güncelleme: CSS3 ile birlikte aşağıdaki liste ve stiller güncellendi

CSS stillerini kullanarak web sayfalarına çeşitli şekiller ekleyebiliriz.

Aşağıdaki listede kullanabileceğiniz birçok şekil bulunmakta;

#square { width: 100px; height: 100px; background: red; }

#rectangle { width: 200px; height: 100px; background: red; }

#circle { width: 100px; height: 100px; background: red; border-radius: 50%; }

#oval { width: 200px; height: 100px; background: red; border-radius: 100% / 50%; }

#triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; }

#triangle-down { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-top: 100px solid red; }

#triangle-left { width: 0; height: 0; border-top: 50px solid transparent; border-right: 100px solid red; border-bottom: 50px solid transparent; }

#triangle-right { width: 0; height: 0; border-top: 50px solid transparent; border-left: 100px solid red; border-bottom: 50px solid transparent; }

#triangle-topleft { width: 0; height: 0; border-top: 100px solid red; border-right: 100px solid transparent; }

#triangle-topright { width: 0; height: 0; border-top: 100px solid red; border-left: 100px solid transparent; }

#triangle-bottomleft { width: 0; height: 0; border-bottom: 100px solid red; border-right: 100px solid transparent; }

#triangle-bottomright { width: 0; height: 0; border-bottom: 100px solid red; border-left: 100px solid transparent; }

#star-six { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; position: relative; } #star-six:after { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-top: 100px solid red; position: absolute; content: ""; top: 30px; left: -50px; }

#pacman { width: 0px; height: 0px; border-right: 60px solid transparent; border-top: 60px solid red; border-left: 60px solid red; border-bottom: 60px solid red; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-left-radius: 60px; border-bottom-right-radius: 60px; }

#talkbubble { width: 120px; height: 80px; background: red; position: relative; border-radius: 10px; } #talkbubble:before { content:""; position: absolute; right: 100%; top: 26px; width: 0; height: 0; border-top: 13px solid transparent; border-right: 26px solid red; border-bottom: 13px solid transparent; }

Kaynak: Shapes of CSS

Windows Phone 8 Tema Renkleri

14 October 2012 Yorum yapılmamış

Windows Phone 7‘de eksik bulduğumuz konulardan biri tema renklerindeki azlık idi. Windows Phone 8‘de eski tema renklerinde değişiklikler var ve yeni tema renkleri ile birlikte gelerek Windows Phone 7‘deki eksiği kapatıyor.

MSDN‘de yer alan Themes for Windows Phone sayfasında Windows Phone 7 ve Windows Phone 8‘deki tema renklerine göz atabilirsiniz.

MSDN‘deki sayfada renk kodlarında hata yakaladığım için Windows Phone 8 ile gelen tema renklerini aşağıda veriyorum;

Windows Phone 8 Renkler