CSS aşkına ! transparan DIV alanları ile ilgili soru

**üstad** · 22.08.2008 16:15

Merhabalar
CSS'de transparan işlerle alakalı bir sorum olacak.
Aşağıda görmüş olduğunuz style kodlarını bir <div> alanına uyguladığınızda transparan arka planın transparan bir hal aldığını göreceksiniz.

Fakat içine yazı yazdığınızda yazının da transparan olduğunu göreceksiniz.

Transparan tasarımlarla uğraşan CSS sevdalıları için yazının transpara hal alması biraz sıkıntılı bir durum. Bunu önlemenin yolu var mıdır ?

Özetle div alanının arka plan rengi transparan yapılıyor ancak içindeki metin de transparan oluyor.

#menu{
width:300px;
height:300px;
background-color:#0066FF;
opacity: 0.5;
filter: progidXImageTransform.Microsoft.Alpha(opacity=50 );
color:white;
}

**hasantayyar** · 23.08.2008 10:26

Üzerine bir div daha konumlandırabilirsiniz.Böyle bir çözüme gitmiştim ben. Bu "div" arkaplan rengi ve imajı olmayan bir div olursa altındaki div görünecektir.
Üzerine bir div daha getirmek için ben "position:absolute" ile başlayarak konumlandırmıştım. Ancak esnek tasarımlarda daha sıkıntılı olabilir üzeribe bir div daha koymak (tagın içine değil, pozisyon olarak üzerine)

**David Wenham** · 21.01.2009 04:28

hasantayyar tarafından gönderilen mesaj:

Üzerine bir div daha konumlandırabilirsiniz.Böyle bir çözüme gitmiştim ben. Bu "div" arkaplan rengi ve imajı olmayan bir div olursa altındaki div görünecektir.
Üzerine bir div daha getirmek için ben "position:absolute" ile başlayarak konumlandırmıştım. Ancak esnek tasarımlarda daha sıkıntılı olabilir üzeribe bir div daha koymak (tagın içine değil, pozisyon olarak üzerine)

Buna bir örnek verebilir misiniz?

**hasantayyar** · 21.01.2009 11:23

temel ve ilkel bir çözüm olarak söylemiştim:

ekran:
http://easycaptures.com/?a=describe&image=6979370270

kod:

HTML Kodu:

<HTML>
<head>
<style>
#menu {
	width:300px;
	height:300px;
	background-color:#0066FF;
	opacity: 0.5;
filter: progidXImageTransform.Microsoft.Alpha(opacity=50 );
	padding:10px 5px;
	z-index:5;
}


#ust_icKatman {
	position:absolute;
	width:200px;
	height:115px;
	z-index:10;
	left: 46px;
	top: 45px;
	background-color:#542121;
	padding:5px;

}
</style>
</head>
<body>
<div id="ust_icKatman"> icerde bi yazi </div>
<div id="menu"> disarda bi yazi. transparent </div>
</body>
</HTML>

**Janberka** · 21.01.2009 11:31

hasantayyar'ın çözümü dışında bir çözüm daha var bunun için. Eğer div'de arkaplan kullanmayacaksanız arkaplan olarak div'e transparan bir png koyabilirsiniz. IE PNG Fix yapmayı da unutmuyuruz tabii... Kolay gelsin...

**erkanceran** · 13.04.2009 13:55

Bir dive transparan verirseniz içindeki objelerinde bu transparan durumdan etkilenmesi olasıdır. Aynı şekilde opacity değerinide değiştirdiğinizde bu o div içindeki tüm nesnelere uygulanacaktır. Çözüm olarak 1px lik bir png dosyası herşeyi halleder bunu yapan unitpngfix.js dosyası var googleda kolayca bulabilirsiniz. Bu dosya içinde bir png ile gelir ve sitenize yerleştirdiğiniz tüm png leri ie için transparan yapar.

En kolay ve basit çözüm yolu bu diye düşünüyorum.

Kolay Gelsin.

Konu Başlığı: CSS aşkına ! transparan DIV alanları ile ilgili soru

Konuyu Paylaş

Seçenekler

CSS aşkına ! transparan DIV alanları ile ilgili soru

Re: CSS aşkına ! transparan DIV alanları ile ilgili soru

Re: CSS aşkına ! transparan DIV alanları ile ilgili soru

Re: CSS aşkına ! transparan DIV alanları ile ilgili soru

Re: CSS aşkına ! transparan DIV alanları ile ilgili soru

Bu konu başlığı için etiketler

Mesaj Seçenekleri