0

さて、単純なゴルフ スコア カード アプリで jQuery Mobile を使用しています。このコードを使用して、フォームの最後に合計を取得します。

<input id="total" type="text" name="total" value="" readonly="readonly" /> 
<p><input type="button" value="=" onclick="total.value=getTotalB(this.form)" />
<p><input type="reset" onClick="reset()" value="-"/>
</form>

input type="button" と約 10px のリセットが必要です。style="width" を試してみました。これらのボタンのサイズを変更する最も簡単な方法が何であるかはわかりません。何か助けはありますか？

4

4 に答える 4

0 
input[type=button],input[type=reset] {
 width:10px;
}

コード内の他のタイプのボタンのサイズを変更したくない場合は、これを使用できます。これは、タイプボタンとタイプリセットでのみ機能します...またはクラスを使用します。

于 2013-08-16T04:49:03.310 に答える
0

最も単純なケースでは、次を試すことができます。

input {
    width: 10px;
}

または、クラスを追加してより具体的にします。

デモ フィドル: http://jsfiddle.net/audetwebdesign/jV8FV/

于 2013-08-16T02:30:46.767 に答える
0

同様のクラスを与えてから、CSS を使用してスタイルを設定します。

作業例:

<html><head>

<style type='text/css'>
input.small {
    width:10px;  /* Apply to input tags with class "small" */
}

</style>

</head><body><form>

<input id="total" type="text" name="total" value="" readonly="readonly" />
<input class='small' type="button" value="=" onclick="total.value=getTotalB(this.form)" />
<input class='small' type="reset" onClick="reset()" value="-"/>

</form></body></html>

そうすれば、両方のボタンを同時に変更することができ、見た目も同じになります (一貫性を保つことをお勧めします)。

それらを楽しんでください：

<style type='text/css'>
input.small {
    border:1px solid #ccc;
    cursor:pointer;
    padding:0;
    text-align:center;
    width:10px;
}

input.small:hover {
    background:dodgerblue;
}
</style>

ちなみに、 の問題style="width"は、ボタンに「 で自分をスタイルする 」と伝えていることですwidth。

ボタンには、「いくらwidthですか？わかりません。通常の方法で行います」と表示されています。

これを修正するには、幅を指定する必要がありstyle="width:10px;" ます。これで満足のいくボタンができました。

于 2013-08-16T02:31:33.057 に答える