Css’in Opacity Özelliği İle Uygulama
(Değerlendir)
bir diğer örnekte sesebian.com
Css her zamanki gibi ilgimi çekmeye devam ediyor. Bende her geçen gün Css hakkında daha çok bilgi öğrenmeye çalışıyor ve öğreniyorum. Şuanda birçok blog sitesinde bulunan “Bağlantı Kutuları” denilen şeyin Css ile nasıl yapıldığını kısaca anlatacağım. Yapacağımız çalışmanın nasıl birşey olacağını merak ediyorsanız Alişko‘nun hazırlamış olduğu ve benimde sitemde severek kullandığım, sitemdeki “Tavsiye Bağlantılar” alanına bakabilirsiniz. Ya da başka bir alternatif olarak buraya tıklayabilir ve yapacağımız örneği inceleyebilirsiniz.
Size direkt olarak kodları vereceğim ve uygulamayı göstereceğim. İlk olarak Css’imizi oluşturuyoruz. Css kodları aşağıdaki gibidir.
<*style type="text/css">
.saydam img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
-moz-opacity: 0.5;
}
.saydam:hover img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity: 1;
}
<*/style>
Yukarıdaki Css kodumuzu <head>…</head> tagları arasına yerleştirelim. (Kodlardaki ilk satır ve son satırda bulunan * işaretini kaldırın öyle çalışmanıza dahil edin.)
index.html adında bir dosya oluşturalım ve içerisinede;
<*a href="http://www.renkliteneke.com/" class="saydam"><*img src="2.png" width="51" height="50" border="0" /> <*/a>
şeklinde bağlantılı resimlerimizi ekleyelim. (Kodlardaki ilk satır ve ikinci satırda bulunan * işaretini kaldırın öyle çalışmanıza dahil edin.)
Çalışmamız hazır durumda. İstediğiniz gibi değiştirerek kullanabilirsiniz.
Belki bir daha bakmak istersiniz: Canlı Örnek
Sitenizin hayranıyım :p Çok seviyorum bu yazınızı çaldım biraz
Teşekkürler :)
Teşekkür ederim Ahmet. Bir çok blog metin olarak bağlantı kullanıyor. Fakat bu özelliği kullanarak daa şık bağlantılar verilebilir. Sırf bu yüzden bağlantı değişimi yapmak isteyen bile çıkar.
Evet. Bunlardan biriside benim :)
[...] bağlantılarla ilgili farklı bir uygulama içinde Renkliteneke.com sitesine [...]
[...] Kaynak: renkliteneke [...]
Yukarıdaki yazı hakkında kendi düşüncelerinizi yazın!
Lütfen yukarıdaki yazı hakkında düşüncelerini paylaş. Senin düşündüklerin bazen bu blogdaki yeni yayınlanacak yazının hangi konuda yazı yazılması gerektiğini belirliyor.renkliteneke.com'u takip edenler :)
Reklam
Kategoriler
Üye Paneli
Bağlantılar
Arşiv
En Çok Oy Alanlar
Tavsiye Bağlantılar
Etiketler
ücretsiz İnternet & Teknoloji 2008 bilgisayar bilişim blog blogger css ders download flash fotoğraf google html indir internet iPhone javascript jQuery Kültür & Sanat Müzik makale photoshop php program Renkli Teneke resim rss sinema Sizin İçin Seçilenler Türk Türkçe Türkiye teknoloji tema theme Video webmaster Web Programlama web sitesi web tasarım web tasarımı web tasarım & grafik Wordpress yenison yapılan yorumlar
en çok yorumlananlar
en çok okunanlar