2010-05-07 27 views
18

IE ile ilgili bir sorun çalışmıyor (başka ne?):Rengi "saydam"

Ben de bir arka plan-imajı vardır CSS ile içerik oluşturmak. Öyle görünüyor:

#nav ul li:after { 
    content: "--"; 
    position: relative; 
    z-index: 99; 
    background: transparent url(image.png); 
    color: transparent; 
} 

metin rengi şeffaf olmayan IE-tarayıcılarda olduğu, ancak tüm IE tarayıcıları (IE6-IE8) içinde siyah ve bunu görebiliyordu. Metni şeffaf/görünmez hale nasıl getirebilirim?

Zaten denedim: görünürlük - opaklık - filtre - metin girintisi ... Ama hiçbiri işini doğru yapmadı, ya yok oldu (ihtiyacım olan arka plan ile) veya öznitelik geçerli değil.

+1

Hangi IE sürümünde? Açıklığa kavuşturmak için, siyah bir '' 've istemediğin şey bu değil mi?Siyah bir arka plana sahip olan her şey değil mi? –

+0

Evet. IE-Versiyon: Bkz. – Poru

cevap

5

Anladım: Doğru dolgu ve sıfır yazı boyutu ile! Dolgu-sol değerini görüntü genişliğinin ötesinde bir piksel olacak şekilde ayarlayın.

+1

Bu cevabı daha fazla detay ile genişletmek isteyebilirsiniz. –

+0

Projeyi çevrimiçi kullanmıyorum ancak bunun CSS: '#nav li: after {content:”. dolgu: 5px 0px 3px 0px; renk: şeffaf; arkaplan: şeffaf url (bg-nav.png) no-repeat 0px 0px; konum: göreli; z-endeksi: 1; } ' – Poru

0

IE, sürekli olarak li:after desteklemez. Hangi IE'den bahsediyorsun? IE6? IE7? Her ikisi de?

+0

IE6'dan IE8'ye kadar – Poru

-1

Arka plan resminiz olarak bir PNG kullandığınızı görüyorum. Normalde, IE 6 kullanıyorsanız, PNG şeffaflığı için bir düzeltme var (http://www.twinhelix.com/css/iepngfix/). Yine de, bu arka plan görüntüleri ile çalışmayacak. Yani IE 6 kullanıyorsanız, gerçekten bir düzeltme yoktur.

+0

Eğer doğru bir şekilde anlarsam, o arka planda değil, çalışmayan “color: transparent” hakkında konuşuyor. –

+3

@Pekka: Evet, ben de öyle düşündüm, ama eğer BG'nin şeffaf olmasını istiyorsanız, neden arka plan üzerinde bir görüntü var? Neden "renk" özelliğini de şeffaf olarak ayarlıyorsunuz? Bu hiç mantıklı değil. Ve kaplar zaten varsayılan olarak şeffaftır. Burada çok fazla bağlantı var. – Robusto

+1

Bunun eski bir soru olduğunu biliyorum, ancak OP'nin şeffaf bir PNG kullandığı nerede? –

1

IE'nin hiçbir sürümü color: transparent 'u desteklemez. Belki de jQuery veya bunun gibi bir şey yapmayı deneyebilirsiniz.

1

Bunu zaten çözdüğünüzü kabul ediyorum, ancak son zamanlarda metin girintisi, taşma ile ilgili olarak sayfa düzeni düzeni sorunları verirken çok büyük bir çizgi yüksekliği kullanıyorum: metni gizlemek için gizli. line-height

line-height:0;

kullanma hakkında benim durumumda çalıştı neyi

7

.

+0

Başar, benim için de çalıştı. Şerefe. –

+0

Eski cevap, ama harika! – MHibbin

42

ne yapmaya çalıştığını arka plan olarak resim göstermek ve metin kullanımını

çalıştığını

font-size:0px

gösteren değilse! Bu Internet Explorer çalışmazsa

+0

Sadece bu basit cevap için teşekkür etmek istedim. Altta yatan kod erişimi olmayan bir düğmenin istenmeyen değerini gizlemeye çalışıyordu ve bu çalıştı. – matt

+0

OMG bu sadece dizüstü bilgisayarımı pencereden dışarı atmamı engelledi. Teşekkürler =] – Brade

+1

Bu, erişilebilirlik sorunlarına neden olur ve bazı eski tarayıcılarda küçük bir metin satırı gösterir. Daha fazla bilgi için CSS püf noktaları görüntü değiştirme galerisine bakın. – RobW

4
font-size: 0; 

geçerli bir Doctype'ı kullandığınızdan emin olun:

<!DOCTYPE html> 
2

Bu çalışması gerekir. Beni renk için blok veya inline-block

.transparent { 
    text-indent: 100%; 
    overflow: hidden; 
    white-space: nowrap; 
} 
+0

Otomatik olarak vücut taşması ayarladım. Bu, kromda bir açısal bileşen için saydamlık oluşturan saydam bir soruna neden oluyordu. Tekrar görünür hale getirmek (varsayılan taşma ayarı) sorunu çözdü. – Soggiorno

0

: o ekran eklemek etmezse şeffaf IE8 çalışma değildi ve bu varsayılan renk ile metin gösteriyordu. Görünür kullandım: gizli; IE8 için sadece metin gösterilmemelidir.

Öğenin görüntülenmesi gerekmiyorsa bu yardımı umuyoruz.