1

さて、私はこのコードを手に入れました：

<div class="teste">
    <input type="file" name="teste" />
    teste
</div>

CSS：

.teste {
   width:300px;
   height:100px;
   position:absolute;
   top:10px;
   right:10px;
   overflow:hidden;
   background-color:#FF0000;
   opacity:1; 
   filter:alpha(opacity=100);
}

input[type=file] {
   position:absolute;
   top:0px;
   right:0px;
   font-size:300px;
   opacity:0;
   filter:alpha(opacity=0);
}

FFとChromeでは完璧に機能しますが、つまり、テキスト「teste」が白くなると、テキスト「teste」の上にファイルを入力すると白くなることがわかりました。

誰かがそれを修正する方法を知っていますか？ありがとう。

4

1 に答える 1

10

そのソリューションがIE7/IE6で機能しない理由に非常に興味をそそられたので、Windows XP（IE6に付属）をインストールしてFiddleをテストします。

最初にこれをテストしました：ここで 述べたように動作するはずです！

フィドルを参照してください！

<div class="teste">
    <input type="file" name="teste" />
    teste
</div>

.teste {
   width:300px;
   height:100px;
   position:absolute;
   top:10px;
   right:10px;
   overflow:hidden;
   background-color:#FF0000;
   opacity:1;
   filter:alpha(opacity=100);
}

input[type=file] {
    display:block;
    width:300px;
    height:100px;
    position:absolute;
    cursor:pointer;
    opacity:0;
    filter:alpha(opacity=0);
    top:10px;
    right:10px;
}

そして、それは機能しませんでした、それで、ブラウザが地獄のMS IE cssサポートとして古いことに気づき、私はそれを削除して、それを普通の古いクラスに置き換えました 。最終結果は、OPの問題の解決に完全に成功しました。input[type=file].the_file

テスト済みのソリューションでフィドルをご覧ください！

<div class="teste">
    <input type="file" name="teste" class="the_file" />
    teste
</div>

.teste {
   width:300px;
   height:100px;
   position:absolute;
   top:10px;
   right:10px;
   overflow:hidden;
   background-color:#FF0000;
   opacity:1;
   filter:alpha(opacity=100);
}

.the_file {
    display:block;
    width:300px;
    height:100px;
    position:absolute;
    cursor:pointer;
    opacity:0;
    filter:alpha(opacity=0);
    top:10px;
    right:10px;
}

最後の注意：

これは、IE6v.6.0.2900.2180を搭載したWindowsXP Professional v2002 SP2でテストされ、その後、 IE7v.7.0.5730.13で更新およびテストされました。

IE7では、両方のソリューションが機能します。

アップデート：

現在、同じwinXPでテスト済み

  • IE 8 v8.0.6001.18702
  • オペラ11.64
  • K-Meleon 1.5.4
  • FF 3.6.16
  • Google Chrome 18.0.1025.168 m
  • Safari 5.1.2（7534.52.7）
  • Win7でのIE9v9.0.8112.16421IC

また、テキストが白くなることに言及していることに気づきました。実行されたテストのいずれでも発生しませんでした！

于 2012-05-14T01:24:20.533 に答える