• ベストアンサー

maxlengthとsize

maxlenghtとsizeの関係について教えてください。 input type=textで、manxlengthとsizeに同じ値を指定しました。 入力文字によっては、フィールド内でスクロールするケースがあります。 また、使用するPCの環境によっても、スクロールするケースがあります。 これらの違いは、何故発生するのでしょうか？ 常に同じ結果を得られるようにする方法はあるのでしょうか？ 例 <input type="text" name="example3" size="10" maxlength="10"> 上記のような記述をした場合、(1)「1234567890」(半角)と(2)「llllllllll」(半角英小文字エル)を入力したときの見え方がことなります。 あるPCでは、(1)はギリギリ全部見え、(2)は半分のところまでしか使用されない。 あるPCでは、(1)は表示しきれずにスクロールし、(2)は半分くらいのところまでしか使用されない。 この違いが知りたいです。 よろしくお願いします。

  • HTML
  • 回答数6
  • ありがとう数3

質問者が選んだベストアンサー

  • ベストアンサー
  • aqucent
  • ベストアンサー率39% (78/200)
回答No.3

横から失礼します。m(_ _)m > styleのフォント指定ですが、未指定の場合は何のフォントが使用されるかご存知でしょうか？ input要素上で使用されるデフォルトのフォントってことでしょうか？ よく知らないのですが、UA(Webブラウザなど)によって変わる気がします。 > デフォルトフォントを変更することは可能なのでしょうか？ #1の方の紹介された monospace がご希望の動作に近いかと思います。 1つ付け加えますと、font-familyプロパティは、固有のフォントを指定した後に「総称ファミリ」を指定するのが一般的です。 例1) font-family : 'MS ゴシック', monospace 例2) font-family : monospace 例1は 'MS ゴシック' を指定し、'MS ゴシック' がなかったときには、UAが設定した既定の「等幅フォント」を使用します。 例2は、UAが設定した既定の「等幅フォント」を使用します。 どちらにするかは完全な好みですが、私は「フォントぐらいユーザーに設定させた方が良かろう」って事で総称ファミリのみ指定する手法を好んで用います。 どちらにしても制作者のポリシーで決まるところですね。

参考URL：
http://hp.vector.co.jp/authors/VA022006/css/fonts.html#font-family
naonosuke9
質問者

補足

分かりやすい説明、ありがとうございます。 いろいろと試しました。 脳ミソにしわが増えた感じです。

その他の回答 (5)

回答No.6

>>ブラウザに設定されているフォントが表示されます。 >>例えばWindows＆IEなら、MS Pゴシックが初期値として設定されているかと思います。 >>[ツール]→[インターネットオプション]→[全般]→[フォント]で確認してみると良いでしょう。 >試したところ、これは入力フィールドには無効のようです。 や、そうでしたか。大変失礼しました。 >日本語版Windows2000と英語版Windows2000は不明です。 >ご存知でしたら、ご教示願えればたすかります。 すみません、Windows2000を持っていないので私はわからないのですが、 Windows2000環境のある方に対して新たに質問を立ててみてはいかがでしょう？ その方が人目にも止まりますしすぐに回答が得られると思いますよ。 たいしてお役に立てずすみません。

naonosuke9
質問者

お礼

>たいしてお役に立てずすみません。 いえいえ、大変勉強になりました。 どうやら英語版は MS Sans Serif というフォントらしいことが分かりました。 いろいろとありがとうございました。

回答No.5

失礼しました、<head>～</head>内の記述ですが、正しくは↓です。 <style type="text/css"> <!-- input{ font-family: 'MS ゴシック',monospace; } --> </style>

回答No.4

同じく横から失礼します。 >styleのフォント指定ですが、未指定の場合は何のフォントが使用されるかご存知でしょうか？ ブラウザに設定されているフォントが表示されます。 例えばWindows＆IEなら、MS Pゴシックが初期値として設定されているかと思います。 [ツール]→[インターネットオプション]→[全般]→[フォント]で確認してみると良いでしょう。 >どこかにデフォルトフォントを指定し、それが使われるような気がしますが、そのデフォルトフォントを変更することは可能なのでしょうか？ 上記のブラウザのフォント設定自体をWebページ側から操作することはできませんが、 Webページ側でfont-familyを指定しておけばそちらが優先され、ブラウザのフォント設定は反映されません。 ちなみに、HTMLの<head>～</head>内に input{ font-family: MS ゴシック; } のように記述しておけば、そのページ内の全てのinput要素にMS ゴシックが適用されます。 ただ、これだと閲覧者のPCにMS ゴシックがなかった場合に、ブラウザの設定フォントが表示されてしまいますので、 No.3の方が仰られたようにmonospaceなどの総称ファミリを指定しておくと良いでしょう。 input{ font-family: 'MS ゴシック',monospace; }

naonosuke9
質問者

お礼

ご回答、ありがとうございます。感謝です。 >>styleのフォント指定ですが、未指定の場合は何のフォントが使用されるかご存知でしょうか？ >ブラウザに設定されているフォントが表示されます。 >例えばWindows＆IEなら、MS Pゴシックが初期値として設定されているかと思います。 >[ツール]→[インターネットオプション]→[全般]→[フォント]で確認してみると良いでしょう。 試したところ、これは入力フィールドには無効のようです。 現在、英語版Windows(2000)と日本語版Windows(XPと2000)が、手元にありますが、それぞれでデフォルトフォントが違うようです。 日本語版WindowsXPは、デフォルトフォントはMS UI Gothicというのを他のサイトで発見しました。 日本語版Windows2000と英語版Windows2000は不明です。 ご存知でしたら、ご教示願えればたすかります。 ちなみに、ブラウザは全てIEです。

回答No.2

#1 WizardZeroです。 スタイルシートの文字列、閉じ忘れてました。(;´▽｀A`` ※ＭＳ ゴシックを指定 <input type="text" name="example3" size="10" maxlength="10" style="font-family : 'ＭＳ ゴシック'">

naonosuke9
質問者

お礼

WizardZeroさん、ご回答ありがとうございます。 試したところ、思うような形になりました。勉強になりました。 styleのフォント指定ですが、未指定の場合は何のフォントが使用されるかご存知でしょうか？ どこかにデフォルトフォントを指定し、それが使われるような気がしますが、そのデフォルトフォントを変更することは可能なのでしょうか？

回答No.1

(1)と(2)の違いはプロポーショナルフォント（文字によって幅が変わるフォント）によるものです。 ＰＣ間での違いは、フォント自体かな？と思いました。 どちらもプロポーショナルフォントが使われていることから、ＭＳ ＰゴシックとMS UI Gothicの違いか、その類ではないでしょうか。 解決法としては、ＭＳ ゴシックなどの等幅フォントを指定すれば、(1)と(2)の違いもなくなります。（と思います・・・） ※ＭＳ ゴシックを指定 <input type="text" name="example3" size="10" maxlength="10" style="font-family : 'ＭＳ ゴシック'> ※コンピュータに定義された等幅フォントを指定 <input type="text" name="example3" size="10" maxlength="10" style="font-family : monospace">

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • 入力に関して。

    以下のソースのようにテキストボックスを４つくらい並べて、最大入力文字数になったら、自動的に右のテキストボックスに入力できるようにすることはできるのでしょうか？ <html> <head> <title></title> </head> <body> <form name="form1"> <input type="text" name="txt1" size="7" maxlength="3">． <input type="text" name="txt2" size="7" maxlength="3">． <input type="text" name="txt3" size="7" maxlength="3">． <input type="text" name="txt4" size="7" maxlength="3"> </form> </body> </html>

  • パスワード欄の"●"文字を小さくしたい

    お世話になります。 Windows XP + IE6の組み合わせでHTMLのパスワード入力欄に"●"文字が入力中に表示されますが、この"●"文字のフォントサイズを変更（小さく）する方法はありますでしょうか？ ID/パスワード入力欄がありましてそれぞれ文字を入力するのですが、パスワード入力中の"●"文字フォントサイズがやたらと大きいのです。 スタイルシートを使って何とかなりそうなのですがご存じの方おられましたらお教えください。 <input type="text" name="userId" maxlength="16" size="16"> <input type="password" name="password" maxlength="16" size="16">

    • ベストアンサー
    • HTML
  • inputボックスのサイズを指定するには？

    inputボックスのサイズ（大きさ）を指定するには？ <style type="text/css"> body { font-size:3em; } </style> としているので、文字は大きくなるのですが、 inputボックスのサイズは大きくなりません。 inputボックスのサイズも3emにするにはどうすればいいですか？ ”input サイズ text”でググったら、 <input type="text" name="example2" size="50"> 等 文字制限のサイズの方法しか見つけられませんでした。

    • ベストアンサー
    • HTML
  • Ｔａｂに関して

    以前以下のソースのようにテキストボックスを４つくらい並べて、最大入力文字数になったら、自動的に右のテキストボックスに入力できるようにすることはできるのでしょうか？ と質問をし、返答を頂いたのですが、自動的に右のテキストボックスに入力できるようにはなったのですが、キーボードのＴａｂを使ってしまうと、全てのテキストボックスが最大になっていて、はじめのボックスでタブを押すと、３つめのボックスに飛んでしまいます。何か回避する方法がありましたら教えてください。 <html> <head> <title></title> </head> <body> <form name="form1"> <input type="text" name="txt1" size="7" maxlength="3">． <input type="text" name="txt2" size="7" maxlength="3">． <input type="text" name="txt3" size="7" maxlength="3">． <input type="text" name="txt4" size="7" maxlength="3"> </form> </body> </html>

  • テキストBOXの入力制限について

    テキストBOXを下記のように設定したとします。 <input type="text"name="***" maxlength="30"> この場合は、全角・半角関係なく文字数を30文字入力することができますよね？ 今回、私がやりたいことは、バイト数の制限をやりたいんです。 例えばバイト数を30バイトにした場合は、 全角では15文字しか入力できなくて 半角では30文字入力制限をする方法を探しています。 何かよい方法はないものでしょうか？？？

  • htmlとcssについて

    input typeのテキストと文字を左揃えで表示したいのですが、cssをどのようにすればいいのでしょう？？ 普通の状態だと、 ＩＤ 　　　「文字入力欄」 のように入力欄の左横に空白ができてしまいます。 <dt>ID</dt> <dd> <input type="text" name="id" size="35" maxlength="50" class="style_1" /> </dd>

    • ベストアンサー
    • HTML
  • Accessのフィールドサイズ

    Access2000を使用していますが、テーブル作成時に 「テキスト型」でフィールドサイズを「１０」に設定して データを入力すると、半角でも全角でも「10桁」までの入力に なりますが、フィールドサイズは半角も全角も関係ないのでしょうか？ 「テキスト型」の最大フィールドサイズは「半角255文字」と 思っていたのですが、全角でも255文字入力できました。

  • ユーザid等の入力formの大きさが違う

    ユーザIDとパスワード入力用の画面を作ったのですが、 ブラウザ上でwin2000だと同じ大きさでみれるのに、 xpだと大きさが変わってしまいます。 なぜですか？ <input type="text" name="usrId" maxlength="8" size="12" value="" style="IME-MODE: inactive"> <input type="password" name="pwd" maxlength="10" size="12" value="">

    • ベストアンサー
    • HTML
  • Firefox3　フォーム入力画面にて

    XP　Firefox3　で　フォーム入力画面とかで <input type=text 電話番号入力（ime-mode: inactive;　maxlength=13） で半角数字とか半角スペースを入れ確認画面に進み前画面に戻ると �　←◆の白抜き？マーク �　←参照文字の様な のような文字が表示される場合があります・・・ そのまま何回か往復してみるとどんどん増えていきます。 � � � � � � � この現象は一体なんでしょうか？

  • 値の取得について

    IPアドレス入力欄のように以下のソースのような流れを作成したのですが、エリアに３文字入力をして、入力したものの最後の文字が数字であったら、キーボードのTabを使っても、onKeyUpで呼んだ関数でも、その入力した３文字が数字だと認識してすぐ横のエリアに移りたいのですが、その入力をした際の３文字目の値を取得することは可能なのでしょうか？Whichを使ってString.fromCharCodeを使って押されたキーを取得しようとしたのですが、構文エラーになってしまい、困っています。 例 入力したものが1a1→数字と認識されて横のエリアに飛ぶ 　　　　　　　　11a→三文字目が"a"だから数字でないので飛ばない <script language="JavaScript"> <!-- var str; var data; function tobu1(){ str = document.form1.txt3.value; data = str.match(/[^0-9]/g); if( str.length >= 3 && !data ) document.form1.txt4.focus(); } ・・・ <body> <INPUT type="text" name="txt2" size="3" value="" maxlength="3" onKeyUp="tobu1()" onFocus="this.select()">． <INPUT type="text" name="txt3" size="3" value="" maxlength="3" onKeyUp="tobu2()" onFocus="this.select()">． <INPUT type="text" name="txt4" size="3" value="" maxlength="3" onKeyUp="tobu3()" onFocus="this.select()">． <INPUT type="text" name="txt5" size="3" value="" maxlength="3" onFocus="this.select()">

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する