2009-04-06 11 views
0

は、あなたが言う、タイプ=ファイルのあるボタンにCSSプロパティを割り当てる方法私を見ることができます。ファイルアップロードボタンのプロパティにアクセスする方法は?

<input type="file" name="coolFile"> 

私は、CSSでこれを実行する必要があることを知っている:

input[type=file]{ 
    background:#ccf; 
//and so on 
} 

行う方法私はボタンの値を割り当てますか?

+0

となりました。基本的にあなた自身の質問に答えました。これは、CSSプロパティを割り当てる方法とまったく同じです。何か不足していますか? –

+0

あなたはすでにCSSセレクタを知っているようです。ボタンに値を割り当てることはどういう意味ですか? CSSはスタイリング専用です。 CSSを使用してボタンのテキストを変更することはできません。それにはJavaScriptが必要です。 – Calvin

+0

ああ、そうです。それはCSSを使って行うことができませんでした。私は、ボタンのボーダーと背景を変更したい。 – chosta

答えて

1

残念ながら、主流のブラウザでは、設計者が直接、スタイルファイルの入力フィールド許可されていません。ファイル入力フィールドのスタイルが複雑な場合は、ユーザーがファイルをアップロードする可能性があるため、これを「セキュリティ機能」と見なすことができます。

2番目の入力フィールドを作成し、その後ろに実際のファイル入力を隠す解決策があります。次は、http://www.quirksmode.org/dom/inputfile.htmlから

div.fileinputs { 
    position: relative; 
} 

div.fakefile { 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    z-index: 1; 
} 

input.file { 
    position: relative; 
    text-align: right; 
    -moz-opacity:0 ; 
    filter:alpha(opacity: 0); 
    opacity: 0; 
    z-index: 2; 
} 

<div class="fileinputs"> 
    <input type="file" class="file" /> 
    <div class="fakefile"> 
     <input /> 
     <img src="search.gif" /> 
    </div> 
</div> 
+0

ありがとう、私はこの解決策を見たが、私はボタンをそのまま残すと思う。 – chosta

1

あなたはボタンのテキストを変更したいと仮定すると、ここでそれを行う方法についての1つのチュートリアルがあります:

http://www.quirksmode.org/dom/inputfile.html

それがカラー/ボーダー/などのような単なるCSSプロパティだ場合、あなたはすでに答えを持っていますなぜそれが機能していないのかを調べるためには、何かをチェックする必要があります。あなたがDOM/JavaScript、例えばを使用

0

document.getElementById("id").style.property="value" 
関連する問題