2017-08-11 80 views
-1

我試着去選擇基於alt屬性的img標籤上移動屬性選擇器不工作

問題加載正確的背景圖像是不是不管我用什麼屬性選擇的組合似乎它不工作,我不能即使選擇我想用它

我用這些

img[alt="Chelo Kebab"] {opacity: 0.5} 
img[alt*="Chelo Kebab"] {opacity: 0.5} 
img[alt^="Chelo Kebab"] {opacity: 0.5} 

我用所有組合,資本,甚至正常的我試過

img[alt] {opacity: 0.5} 
標籤

,但沒有成功 也是我試過的img

你可以看到代碼進出口工作在這個地址之前把父類的名字 here

我試着去選擇每個img標籤

這裏是我寫出一切正確的證據 enter image description here

UPDATE它現在明顯是它的一個CACHEING問題,我試着去解決

+1

代碼中的選擇器部分在哪裏?添加一個示例/基本示例,而不是指向工作網站的鏈接。 – Dekel

+0

鏈接正在工作 –

+0

我從來沒有說過鏈接不工作...... – Dekel

回答

0

有與CSS屬性選擇器iamges沒有問題:

img[alt="abc"] { 
 
    opacity: 0.8 !important; 
 
} 
 
img[alt="def"] { 
 
    opacity: 0.5 !important; 
 
} 
 
img[alt="ghi"] { 
 
    opacity: 0.3 !important; 
 
} 
 
img[alt] { 
 
    opacity: 0.1; 
 
}
<img src="https://dummyimage.com/200x100/000/fff" /><br /> 
 
<img alt="abc" src="https://dummyimage.com/200x100/000/fff" /><br /> 
 
<img alt="def" src="https://dummyimage.com/200x100/000/fff" /><br /> 
 
<img alt="ghi" src="https://dummyimage.com/200x100/000/fff" /><br />

需要注意的是,因爲你有一個更普遍的選擇您的代碼(img[alt])我將!important添加到屬性以覆蓋常規選擇器中的不透明度。

+0

我試圖搞清楚,因爲當我添加這樣的div.someClass img [alt =「Chelo Kebab」]它不起作用,當我添加時!重要的是它也可以工作......失敗 –

+0

也許你的'img'在你的DOM中的'div.someClass'裏面不是** – Dekel

+0

我修飾符將會與alt很好的接觸,但在IE/Edge alas([demo](https://codepen.io/PhilippeVay/pen/brRPvy))中不支持作爲筆| [支持](https://developer.mozilla)。 org/en-US/docs/Web/CSS/Attribute_selectors $編輯#Browser_compatibility)在MDN上) – FelipeAls