CSS’ Etiketi

CSS ile resim boyutlandırma

18 Temmuz 2008 | Kategori : CSS

Daha önce resim boyutlandırma için bir JavaScript kodu yayınlamıştım… Daha pratik ve daha hızlı bir çözüm olarak CSS ile resim boyutlandırma yapabiliyormuşuz :) Ayrıca CSS sayesinde belli bölgeler içinde bu stili sağlayabiliyoruz.

Kod için Natu ya teşekkürler.

[css]#Ajans img {
max-width: 260px;
max-height: 260px;
letter-spacing: expression(((this.width>260)?this.width=260:null)?”normal”:”normal”);
word-spacing: expression(((this.height>260)?this.height=260:null)?”normal”:”normal”);
}[/css]

Yukarıdaki kod ile #Ajans ID sinin içindeki resimlerin boyutunu küçültüyor.

Linklerinizi ikonlandırın

28 Şubat 2008 | Kategori : CSS

iconize.gif

Iconize; IE7, Firefox, Safari, Opera, Camino gibi browserlarda başarıyla çalışan bir uygulama… Çeşitli uzantılarda verilen linkleri ikonlandırarak linkleri anlaşılır hale getirip sınıflandırmanızı sağlıyor. Ziyaretçileriniz için güzel birşey bence bu.

Tek sorun IE6 da çalışmaması… Iconize sadece bir .css dosyasıyla çalışıyor :)

İşte bir .pdf için kullanılan sınıf;

[css]a[href$='.pdf'] {
 padding: 5px 20px 5px 0;
 background: transparent url(icons/icon_pdf.gif) no-repeat center right;
}[/css]

Sadece 4kb lık bu uygulama sıkıştırılmış olarak sunulmamış. Fakat bunu siz yapabilirsiniz

CSS PNG-Hack

17 Şubat 2008 | Kategori : CSS

CSS PNG-Hack| Transparan PNG resimler IE6 da saçmalıyordu, arkaplan cins cins renklerde çıkıyordu. Kısa bir çözüm olarak çok gerekli, önemli birşey değilse .gif haline getiriyordum. Daha sonra ise birkaç javascript kodu bulup onları kullanmaya başladım ama yüksek boyuttalardı. Ayrıca sayfa yüklendikten sonra bile bir süre ağırlık oluyordu.

Daha etkili bir çözüm olarak şu geçti elime, fakat yinede hala istediğim gibi değil :)

[css].ie-png {
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’resim.png’,sizingMethod=’scale’);
height: 50px;
width: 257px;
}

.ie-hide{
border:0px solid #FFFFFF;
_display:none;
}[/css]

[html]

Andrew Sellick DOT COM

[/html]