/* Css Sifirlama */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,  caption, tbody, tfoot, thead, th {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; text-decoration:none;}

ol, ul { list-style: none; }
blockquote, q { quotes: none; }
/* remember to define focus styles! */
:focus, a:focus, a:active{    outline: 0; }

/* remember to highlight inserts somehow! */
ins{ text-decoration: none; }
del{ text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table{border-collapse: collapse; border-spacing: 0;}

/* float uygulanan elemanlari kapsayamama sorunu */
.kapsayamamaSorunu:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.kapsayamamaSorunu {display: inline-block;}
/* IE-mac de bu bolumu sakla \ */
* html .kapsayamamaSorunu {height: 1%;}
.kapsayamamaSorunu {display: block;}
/* IE-mac bu bolumu saklam artik */

/* Css Sifirlama */

Aşağıdaki linkten diğer 5 adayı görebilirsiniz
http://www.altinorumcek.com/halkoylamasi/halkinfavorileri2009.html#bilgi_teknolojileri_donanim_yazilim

Türkiye’de böyle bir mantıkla kurulmuş ilk proje olan cssaddons.com zaman geçtikçe içindeki bilgiler ile internette yerini gitgide sağlamlaştırmakta. Bizim gibi duyarlı internet kullanıcıları sayesinde çok daha iyi yerlere geleceğinden eminim.

Projeye destek vermek istiyorsanız ve oylamak istiyorsanız cep telefonunuzun mesaj bölümüne girip ALTIN yazıp bir boşluk bırakarak 150 yazıp 3969 ‘a kısa mesaj olarak yollayabilirsiniz.
Destekleriniz için teşekkürler.

Browserlab Özellikleri

• 2-up View ile 2 farklı browserdaki görünümü görebiliyoruz
• Onion skin özelliği ise 2 görüntüyü üst üste getiriyor ve ikisinin arasındaki farkı daha kolay görmemizi sağlıyor
• Farklı işletim sistemlerindeki ve farklı browserlardaki önizleme görüntülerini görebiliyoruz.
• Browser Sets ile hızlı erişim için kullanmak istediğimiz browserları listeliyoruz.

Bu sayede bilgisayarınıza tüm browserları yüklemenize gerek kalmıyor. Kullanım için üye olmanız yeterli. Adobebrowserlab

• Text Shadow,
• Border Radius
• Box shadow
• Opacity
• Multi Column
• Border image
• Font-face

Text Shadow:

Photoshopta kullandığımız drop shadow etkisini pratik bir şekilde uygulayabiliyoruz.

text-shadow:1px 1px 1px #eee;

1. değer x ekseninde aralık vermek için

2. değer y ekseninde aralık vermek için

3. değer ise verdiğimiz etkinin bulanıklaşması için kullandık

4. değer #fff verdiğimiz gölge etkisinin rengi için kullandık

Border Radius

Border radius web 2.0 stili tasarımlarda en çok kullanılan özelliklerden birisi tablo ve div lerde verdiğimiz kenarlıkları ovalleştirerek daha şık bir görünüm vermemizi sağlıyor.

border:2px solid #ccc;
-moz-border-radius:4px 4px 4px;//firefox için
-webkit-border-radius:4px 4px 4px;//safari ve chrome için

Border ImageBazı tasarımlarda gördüğüm kenarlıklar yerine resim kullanılıyor. Css 3 ile bunu yapmak mümkünmüş…

Round özelliği için

border:1.0em double; -moz-border-image: url(border.png) 28 round round;

Stretch border için

border:1.0em double; -moz-border-image: url(border.png) 28 stretch stretch;

Box ShadowText shadow tekniğine benzer bir örnek

-moz-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.7);

1. değer x ekseni için

2. değer y ekseni için

3. değer blur

4. değer ise renk kodu

Opacity

Web 2.0 ile birlikte tasarımlarda yer yer transparan objelerde kullanılmaya başlandı eskiden transparan background için transparan png dosyasını kullanıyorduk fakat css3 opacity ile tasarımlarımızdaki transparan alanlar oluşturabiliyoruz.

opacity:0.2//%20 lik bir görünürlük değeri vermiş olduk.

Multi Column

Tasarımlarımızda kolonlu yapı için genellikle div, span ile ya da table ile kolonlu yapılar oluşturabiliyoruz fakat dinamik yapı kullandığımız zaman kolondan taşan yazının devamının bir sonraki kolonda çıkması problem oluşturabiliyor. Bu sorunu Multi Column ile çözebiliyoruz.

-moz-column-count:3;/* Kolon Sayısı*/
-moz-column-rule: solid 1px #fff; /*Kolonlar arasında aytaç için beyaz border kullandım */
-moz-column-gap:20px; /*kolonlar arası boşluk*/

@Font-Face

Web tasarımlarında yenilenen tasarım trendleriyle birlikte tipografide öne çıkmaya başladı dolayısıyla font seçimi önem kazandı ve sistem fontları yetersiz kalmaya başladı. Ancak web tasarımında özgürce font kullanılamıyor ya sistem fontu olması gerekiyor ya da resim olarak fontu siteye eklememiz gerekiyordu. Sistemde olmayan fontların kullanılmasını sağlamak için javascript ve flash kullanılarak bir çok teknik geliştirildi (sIFR, Cufon, Typeface…). Yalnız bu teknikler tam anlamıyla verimli olamıyor ya css desteği tam olmuyor ya da google tarafından indexlenmesinde problem çıkıyordu.Css 3 ile de artık sistem fontu olmayan fontlar eklenebiliyor. Fakat halen problemler devam ediyor…

dipnot:@font-face Css2 ile gelmişti fakat bazı problemlerden dolayı Css 2.1 de kaldırıldı Css3 ile tekrar geldi. – Fatih Hayrioğlu

style dosyamızda tanımlamamızı yapıyoruz

@font-face { font-family: Delicious; src: url('Delicious-Roman.otf'); }
@font-face { font-family: Delicious; font-weight: bold; src: url('Delicious-Bold.otf'); }

Kullanımı

h3 { font-family: Delicious, sans-serif; }

Not: Bir kaç şekilde renk kodunu verebilirsiniz. rgb(0,0,0) = black = #000

Örnek Sayfa

Faydalı Linkler:

http://www.fatihhayrioglu.com/

http://www.css3.info

http://sixrevisions.com/css/basic-css3-techniques-that-you-should-know/

http://www.1stwebdesigner.com/css/css3-techniques/

• Win xp / vista / 7  işletim sistemlerini destekliyor.
• Bilgisayarın dil ve 64 bit desteğini kontrol ediyor

Çok Sayıda RAW Dosyayı Hızlıca ve Kolayca JPG Formatına Dönüştürme from Halid Özgür on Vimeo.

Umarım bu tarz anlatımlar devam eder. Raylı eğitim sisteminin devamlı olması dileyiğle…

kaynak:http://www.camoglu.net/?p=415&cpage=1#comment-1267

Shank PAX2009 Demo Playthrough from Jamie Cheng on Vimeo.