bildirgec.org

css hakkında tüm yazılar

Hangi siteleri gezdiğini biliyorum!

admin | 02 April 2010 11:49

Web sitenize birisi geldi ve bu kullanıcı daha önceleri hangi sitelere girmiş, acaba hürriyet’e girmiş mi, ntvmsnbc’ye ya da digg’e girmiş mi, peki ya facebook’a ya da bbc.co.uk’ye girmiş mi, ya google’a (tamam, ona kesin girmiştir), yetmedi wikipedia’nın Türkiye sayafasına girmiş mi? Gibi sorular sormuş olabilirsiniz, ve kendi kendinize tabii ki bunları bilemeyiz diyeceksiniz ama yanılıyorsunuz, hepsini öğrenebiliriz.

CSS kullanarak bir ziyaretçilerin hangi web sitelerine (daha doğrusu adrese) girdiğini öğrenmek mümkün. Buna CSS açığı da diyorlar ve hala bu açığın nasıl düzeltileceği konusunda bir çözüm bulunabilmiş değil. Hemen olayın nasıl işlediğine geçeyim. Bunu PHP kullanarak göstereceğim, fakat Javascript kullanarak da yapılabilir bir yöntem. Önce HTML sayfamızı oluşturalım (gecmisiogren.html olsun):

1
2
3
4
5
6
7
8
9
 
<head>

 <style type="text/css">

  #kodamanpizbt:visited {

  background: url(takip.php); }

 </style>

</head>

<body>

 <a id="kodamanpizbt" href="http://arsiv.pilli.com/yazi/php-ile-ziyaretci-bilgilerini-tespit"></a>

</body>

CSS3 please !

enjoys | 18 March 2010 16:11

cssplease
cssplease

paul irish ve jonathan neal kodlar üzerinde değişiklik yapabileceğiniz ve bu değişiklikleri anında görebileceğiniz eğlenceli bir css uygulaması hazırlamışlar. uygulamada görebileceğiniz etiketler ;

  • border-radius
  • box shadow
  • gradients
  • rgba support in backgrounds
  • transforms
  • font-face

gerçekten de eğlenceli ve bilgilendirici bir olan bu çalışmaya buradan ulaşabilirsiniz.

İnteraktif CSS3 Oluşturma Araçları

trampfd | 17 March 2010 15:36

Sitelerimizde henüz rahatlıkla css3 kullanabilmek için zaman biraz erken olsa da, css3 kod yazımını kolaylaştıracak ve kimi yerde ilham kaynağı olabilecek bu uygulamaları takip etmekte fayda var.

css3 generator
css3 generator

CSS3 Generator basit ve hoş arayüzü ile, siz tıklayarak css3 özelliklerini belirlerken, interaktif olarak çıktısını da göstererek kodunuzu kullanıma sunuyor.

CSS3 Please!
CSS3 Please!

css3 please! sitesi ise, direk tüm tarayıcılarla uyumlu olarak yazılmış css3 stil dosyası arayüzü ile karşımıza çıkıyor. Özellikleri kapatıp açarak, yine interaktif olarak sağdaki kutucuktan o kodun ne işe yaradığını görüyoruz.

CSS3 Gradient Generator
CSS3 Gradient Generator

css3 gradient generator, css3 ile birlikte gelen gradient efektinin kullanımına yoğunlaşmış bir araç.

CSS3 Generator
CSS3 Generator

Widgetpad tarafından yapılan bu araç, webkit motoru kullanan tarayıcılar için özel olarak hazırlanmış css3 uygulaması.

* Bonus

Anigma
Anigma

Anigma css3 kullanılarak hazırlanmış hoş bir tarayıcı oyunu. Öncelikli olarak Webkit motoru kullanan tarayıcılar için tasarlandığı belirtilmiş.

tüm tarayıcılara uyumlu yan sanayi css3 ürünleri

basarozcan | 11 March 2010 11:02

css3 please ile tüm tarayıcılarda css3 kodları uyumluluğu
css3 please ile tüm tarayıcılarda css3 kodları uyumluluğu

Büyük bir heyecanla beklememize karşın tüm tarayıcıların desteklemesi için uzun süreer beklememiz gerekecek olan CSS3‘ün tasarım dünyasına getirdiği bazı yenilikleri şimdiden kullanabileceğinizi biliyor muydunuz? Evet belki hepsinden haberiniz vardı, belki bir kısmını kullanıyorsunuz ama CSS3 Please! uygulaması ile tüm tarayıcılarda bazı CSS3kodlarını şimdiden kullanabilmek mümkün.

CSS3 Clean uygulaması yuvarlak köşeler , gölge (shadow), renk geçişi (gradient), RGBA, obje çevirme (rotation) ve font-face kullanımı için tüm tarayıcılarla uyumlu css kodunu otomatik olarak oluşturuyor.

Bu Web Bileşenlerini Denemek Lazım: Alloy UI

algoz | 04 March 2010 17:12

Html ile yapılandırılmış, Css ile biçimlendirilmiş ve JavaScript’le de hareketlendirilmiş bir kullancı arayüzü (User Interface/UI) kütüphanesi/çatısı olan Alloy UI, bünyesindeki şık tasarımlı ve çok işlevli bileşenleri ile, dinamik ve zengin içerikli web uygulamalarının/sitelerinin, çok daha kısa sürelerde tamamlanmasını sağlamakta.


Web uygulamalarınızda kullanabilmeniz için sadece YUI Library’e ihtiyaç duyan Alloy UI bünyesindeki bileşenlerden bazıları:

AutoComplete: otomatik tamamlama.

Treeview Ağaç görünümlü menü.

Dialog Diyalog/İletişim pencereleri.

Ratings Puanlama.

Loading Mask Yükleniyor maskesi.

35+ CSS3 & Javascript Uygulaması

siriusbee | 03 March 2010 15:22

Henüz bütün tarayıcılar tarafından bütün özellikleriyle desteklenmese de, bir çok web tasarımcı CSS 3’ü Jquery, Mootools gibi javascript kütüphaneleriyle bir arada kullanarak neler yapılabileceğini denemeye başladılar bile.

Bir çoğu şimdilik sadece Safari ve Chrome tarafından desteklense de bu uygulamaları gördüğümüzde şaşırmamak elde değil gerçekten. CSS adeta aldı başını gidiyor.

CSS 3’ü öğrenmek için hala geç değilken bir an önce bu uygulamaları gözden geçirerek CSS 3’e başlangıç yapmanızda fayda var. Diğer yandan CSS 3’ü kullanmaya başlamak, Internet Explorer 6’yı tamamen terk etmek için de önemli bir adım bence.

Web Sayfa Yerleşimleri (Layouts) İçin: EZ-CSS

algoz | 22 February 2010 19:07

Web sayfalarınızın yerleşim düzenleri (Layouts) + için kullanabileceğiniz EZ-CSS, bu işlemi Table yerine CSS (div) ile yapabilmeniz için geliştirilmiş ve dosya boyutu sadece 1kb olan bir CSS çatısı (CSS framework).


Çoklu sütun ve sıra oluşturabilme, farklı genişlik ve yüksek değerleri kullanabilme ve web sayfalarına kolayca ekleyebilme gibi daha birçok özelliği, avantajlar/özellikler listesinde barındıran EZ-CSS’yi farklı projeleriniz için kullanabilirsiniz.

EZ-CSS’nin ana sayfasına buradan ve farklı örneklerin bulunduğu demo sayfasına da buradan ulaşabilirsiniz.

Birbirinden Farklı CSS3 Uygulamaları

angelsdemos | 22 February 2010 14:24

CSS3 ile css ve web tasarımı birbirinden farklı birçok özellik kazandı. Her türlü yazı tipini web sayfalarında kullanabilme, css ile oluşturulan animasyonlar, şık buton tasarımları gibi birçok örnek bulunmakta. Bu örnek ve uyguları öğrenmek ve css3’ü tamamen tanımak için birçok uygulama ve makale bulunmakta. Fakat css3 tarayıcıların eski sürümşerinde çalışmıyor. Bunu dikkate alarak da web sayfanızı şekillendirmelisiniz. İşte birbirinden farklı css3 uygulamaları;

11 classic CSS Techniques Made Simple with CSS3 | Demo

Klasik css‘den farklı olarak css3’teki farklılıkları açıklayan bu yazıyı css3’e geçen herkesin okuması gerek. Css3’teki animasyon, yazı tipi değişimi ve vurgusu, köşesiz blok yapımı gibi konularda içinde bulunan çok eğitici bir yazı.

Mock-Up Interface Using CSS3 Colour | Demo

Css3 ile transparan bloklar yapabileceğinizi gösteren çok hoş bir uygulama. İstediğimiz herhangi bir bölümü ya da sayfanın tümünü transparan hale getirmek mümkün.

web tasarımcılar ve geliştiriciler için google chrome eklentileri

GokhanKARAKAS | 15 February 2010 17:00

google chrome bildiğiniz gibi artık eklenti desteğine kavuştu. Web developer ve web tasarımcılar için aşağıda google chrome için 14 adet kullanışlı eklenti bulunmakta. şimdi özelliklerine göre eklentilere göz atalım.

1. firebug for google chrome
firebug, html ve css’de düzeltmeler yapabileceğiniz bir editör. javascript desteği bulunmamakta.

2. Pendule
web uygulama geliştiricileri için araç çubğunu inşa için ayarlar. stylesheets, formlar, resimler, html ile çalışma imkanı sunar.

3. html validator
w3c standarlarına göre html kodunu kontrol eder.