テキストフィールド等のStyle
ツリー構造順で表示
|
投稿の古いものから
|
投稿の新しいものから
テキストフィールド等のStyle
msg# 1
投稿日時 2008-10-1 14:10 |
投稿者: apptaro
下記のようなコードで確認してみたところ、
・DoCoMo SO902i、SB 820P→どのフォントサイズも同じ
・AU W61T→div指定したfont-sizeはinputやtextareaに継承
されないが、inputやtextareaに直接指定したfont-sizeは
効果がある
・エミュレータ→divや直接指定したfont-sizeがいずれも
効果がある
という結果でした。
------------------------------------------------------
<form action="action" method="get">
<input type="text" value="あいうえお" /><br/>
<textarea rows="2">あいうえお</textarea><br/>
<div style="font-size:8px;">
<input type="text" value="あいうえお" /><br/>
<textarea rows="2">あいうえお</textarea><br/>
</div>
<input type="text" value="あいうえお" style="font-size:8px;"/><br/>
<textarea rows="2" style="font-size:8px;">あいうえお</textarea><br/>
</form>
・DoCoMo SO902i、SB 820P→どのフォントサイズも同じ
・AU W61T→div指定したfont-sizeはinputやtextareaに継承
されないが、inputやtextareaに直接指定したfont-sizeは
効果がある
・エミュレータ→divや直接指定したfont-sizeがいずれも
効果がある
という結果でした。
------------------------------------------------------
<form action="action" method="get">
<input type="text" value="あいうえお" /><br/>
<textarea rows="2">あいうえお</textarea><br/>
<div style="font-size:8px;">
<input type="text" value="あいうえお" /><br/>
<textarea rows="2">あいうえお</textarea><br/>
</div>
<input type="text" value="あいうえお" style="font-size:8px;"/><br/>
<textarea rows="2" style="font-size:8px;">あいうえお</textarea><br/>
</form>
Re: テキストフィールド等のStyle
msg# 1.1
投稿日時 2008-10-2 14:15 |
投稿者: DevX (管理者)
報告ありがとうございます。
現象を確認しました。修正いたします。
通常font-sizeは子要素に継承されますが、実機ではinputやtextareaにデフォルトのfont-size指定があって、直接指定で上書きしなければ継承よりデフォルト指定が優先する。
というところでしょうか。
現象を確認しました。修正いたします。
通常font-sizeは子要素に継承されますが、実機ではinputやtextareaにデフォルトのfont-size指定があって、直接指定で上書きしなければ継承よりデフォルト指定が優先する。
というところでしょうか。
Re: テキストフィールド等のStyle
msg# 1.2
投稿日時 2008-10-6 17:42 |
投稿者: DevX (管理者)
バージョン1.0.1.66で、inputやtextareaへのフォントサイズの継承/直接指定について、実機調査の結果を反映して一部修正しました。
しかし調査しきれていない部分も多こ、この件は再度修正する予定です。
しかし調査しきれていない部分も多こ、この件は再度修正する予定です。
Re: Re: テキストフィールド等のStyle
msg# 1.2.1
投稿日時 2008-10-6 19:08 |
投稿者: apptaro
確認しました。ありがとうございます。
Re: Re: テキストフィールド等のStyle
msg# 1.2.2
投稿日時 2008-10-7 0:28 |
投稿者: apptaro
元の質問に関連して試した結果を報告します。
元の報告のSBの結果については一部間違いもありました。
下記のXHTMLで試しました。DoCoMoの場合や「32px」を
「x-large」にして試しました。
--------------------------------------------------
<form action="action" method="get">
<div><input type="text" value="テキスト" /></div>
<div style="font-size:32px;"><input type="text" value="テキスト" /></div>
<div><input type="text" value="テキスト" style="font-size:32px;" /></div>
<br/>
<div><textarea rows="2">エリア</textarea></div>
<div style="font-size:32px;"><textarea rows="2">エリア</textarea></div>
<div><textarea rows="2" style="font-size:32px;">エリア</textarea></div>
<div><input type="password" value="PASSWORD" /></div>
<div style="font-size:32px;"><input type="password" value="PASSWORD" /></div>
<div><input type="password" value="PASSWORD" style="font-size:32px;" /></div>
<br/>
<div><input type="checkbox" value="チェック" /></div>
<div style="font-size:32px;"><input type="checkbox" value="チェック" /></div>
<div><input type="checkbox" value="チェック" style="font-size:32px;" /></div>
<br/>
<div><input type="radio" value="ラジオ" /></div>
<div style="font-size:32px;"><input type="radio" value="ラジオ" /></div>
<div><input type="radio" value="ラジオ" style="font-size:32px;" /></div>
<br/>
<div><input type="submit" value="送信" /></div>
<div style="font-size:32px;"><input type="submit" value="送信" /></div>
<div><input type="submit" value="送信" style="font-size:32px;" /></div>
<br/>
<div><input type="reset" value="リセット" /></div>
<div style="font-size:32px;"><input type="reset" value="リセット" /></div>
<div><input type="reset" value="リセット" style="font-size:32px;" /></div>
<br/>
<div><select><option>セレクト</option></select></div>
<div style="font-size:32px;"><select><option>セレクト</option></select></div>
<div><select style="font-size:32px;"><option>セレクト</option></select></div>
<br/>
<div>文字列</div>
<div style="font-size:32px;">文字列</div>
<div><span style="font-size:32px;">文字列</span></div>
<br/>
</form>
--------------------------------------------------
【DoCoMo SO902i】
実機もエミュレータも同一の動作(divや直接指定した
styleのfont-sizeはフォーム項目には効果がない。)
【AU W61T】
実機で直接指定したstyleのfont-sizeのみ適用されるもの:
input type="text"、textarea、input type="password"、
select
実機でdivや直接指定したfont-sizeが適用されるもの:
input type="submit"、input type="reset"
実機でfont-sizeが全く適用されないもの:
input type="checkbox"、input type="radio"
エミュレータで動作が異なるもの:
input type="checkbox"、input type="radio"
→直接指定のstyleのfont-sizeが効いてしまう
input type="submit"、input type="reset"
→divで指定したfont-sizeが効かない(継承されない)
【SB 820P】
実機で直接指定したstyleのfont-sizeのみ適用されるもの:
input type="text"、textarea、input type="password"、
input type="checkbox"、input type="radio"、
input type="submit"、input type="reset"、
select
エミュレータで動作が異なるもの:
select
→divで指定したfont-sizeが効いてしまう(継承されてしまう)
元の報告のSBの結果については一部間違いもありました。
下記のXHTMLで試しました。DoCoMoの場合や「32px」を
「x-large」にして試しました。
--------------------------------------------------
<form action="action" method="get">
<div><input type="text" value="テキスト" /></div>
<div style="font-size:32px;"><input type="text" value="テキスト" /></div>
<div><input type="text" value="テキスト" style="font-size:32px;" /></div>
<br/>
<div><textarea rows="2">エリア</textarea></div>
<div style="font-size:32px;"><textarea rows="2">エリア</textarea></div>
<div><textarea rows="2" style="font-size:32px;">エリア</textarea></div>
<div><input type="password" value="PASSWORD" /></div>
<div style="font-size:32px;"><input type="password" value="PASSWORD" /></div>
<div><input type="password" value="PASSWORD" style="font-size:32px;" /></div>
<br/>
<div><input type="checkbox" value="チェック" /></div>
<div style="font-size:32px;"><input type="checkbox" value="チェック" /></div>
<div><input type="checkbox" value="チェック" style="font-size:32px;" /></div>
<br/>
<div><input type="radio" value="ラジオ" /></div>
<div style="font-size:32px;"><input type="radio" value="ラジオ" /></div>
<div><input type="radio" value="ラジオ" style="font-size:32px;" /></div>
<br/>
<div><input type="submit" value="送信" /></div>
<div style="font-size:32px;"><input type="submit" value="送信" /></div>
<div><input type="submit" value="送信" style="font-size:32px;" /></div>
<br/>
<div><input type="reset" value="リセット" /></div>
<div style="font-size:32px;"><input type="reset" value="リセット" /></div>
<div><input type="reset" value="リセット" style="font-size:32px;" /></div>
<br/>
<div><select><option>セレクト</option></select></div>
<div style="font-size:32px;"><select><option>セレクト</option></select></div>
<div><select style="font-size:32px;"><option>セレクト</option></select></div>
<br/>
<div>文字列</div>
<div style="font-size:32px;">文字列</div>
<div><span style="font-size:32px;">文字列</span></div>
<br/>
</form>
--------------------------------------------------
【DoCoMo SO902i】
実機もエミュレータも同一の動作(divや直接指定した
styleのfont-sizeはフォーム項目には効果がない。)
【AU W61T】
実機で直接指定したstyleのfont-sizeのみ適用されるもの:
input type="text"、textarea、input type="password"、
select
実機でdivや直接指定したfont-sizeが適用されるもの:
input type="submit"、input type="reset"
実機でfont-sizeが全く適用されないもの:
input type="checkbox"、input type="radio"
エミュレータで動作が異なるもの:
input type="checkbox"、input type="radio"
→直接指定のstyleのfont-sizeが効いてしまう
input type="submit"、input type="reset"
→divで指定したfont-sizeが効かない(継承されない)
【SB 820P】
実機で直接指定したstyleのfont-sizeのみ適用されるもの:
input type="text"、textarea、input type="password"、
input type="checkbox"、input type="radio"、
input type="submit"、input type="reset"、
select
エミュレータで動作が異なるもの:
select
→divで指定したfont-sizeが効いてしまう(継承されてしまう)