CSS3 IE9點擊僞元素？

我有以下的小提琴設置樣本如何樣式與CSS3的選擇框。我在IE9遇到問題。 label:before和label:after僞元素阻止了它們位於其上的下拉箭頭的「單擊」操作。這在除IE9以外的每個瀏覽器都可以正常工作。有沒有人有任何想法如何調整這個工作？我都是耳朵！CSS3 IE9點擊僞元素？

http://jsfiddle.net/CXJTv/

P.S.我只對css的想法感興趣。我不想讓JavaScript成爲正確工作的要求。

來源

2012-08-08 SublymeRick

這是迄今爲止我所見過的最好的純css解決方案....可以在webkit和Gecko上運行。你最終是否找到了IE9的解決方案？ – Danield 2012-12-19 13:38:34

使用第二個零不透明度選擇：

<!DOCTYPE html> 
 
    <html> 
 
     <head> 
 
     <style> 
 
      #real { position: absolute; clip:rect(2px 51px 19px 2px); z-index:2; } 
 
      #fake { position: absolute; opacity: 0; } 
 
      
 
      body > span { display:block; position: relative; width: 64px; height: 21px; background: url(http://www.stackoverflow.com/favicon.ico) right 1px no-repeat; } 
 
     </style> 
 
     </head> 
 
     <span> 
 
     <select id="real"> 
 
      <option value="">Alpha</option> 
 
      <option value="">Beta</option> 
 
      <option value="">Charlie</option> 
 
     </select> 
 
     <select id="fake"> 
 
      <option value="">Alpha</option> 
 
      <option value="">Beta</option> 
 
      <option value="">Charlie</option> 
 
     </select> 
 
     </span> 
 
    </html>

來源

2012-10-07 18:39:49

我只是想接受這個，因爲它在技術上是有效的，我不喜歡有未解決的問題。它不是我理想的答案，因爲每次我這樣做時都重複選擇是不可取的。我認爲所有瀏覽器都不支持不透明度（例如，舊版瀏覽器仍然處於瘋狂狀態）。 – SublymeRick 2013-01-09 03:24:40

如果IE是您當前的實現問題，你總是可以使用現代化主義者或conditional statements，使IE恢復到內置標準下降的箭頭。

這是a fiddle這裏我使用條件語句來解析一個類，如果它是一個不是IE的瀏覽器。

Over here我回答了一個問題，它可能會幫助您使用純CSS選擇下拉菜單的自定義樣式。

來源

2012-12-20 10:56:44 Danield

CSS3 IE9點擊僞元素？

回答

相關問題