ケータイ版 ミニタコ

　 HTMLタグ > フォーム：テキストフィールド
1行テキストの入力欄を作ります。

フォームは、入力するもの、それを送信するものやクリアするものなどを1セットとして、 <form>と</form>で囲みます。
<form>の前と</form>の後ろは改行2つ分が自動で入ります。
改行しないようにする方法は、こちらへどうぞ。
基本のテキストフィールド


<input type=text>

テキストフィールドを装飾するには、<input〜>の < > 内に、以下のタグを追加します。
テキストフィールドの幅を変える
半角での字数で指定します。
入力したときの文字の大きさとフォントでの文字数になるので、それによって幅は変わります。
実際には制限なく入力できます。

 size=【幅】
テキストフィールドの幅・高さを変える ( スタイルシート )

 style="width:【幅】; height:【高さ】";

上と違って、ピクセルでフィールドの大きさを指定します。
これを使った場合、「size=○」は無効になります。
テキストフィールドの枠を変える

 style="border:【太さ】 【スタイル】 【色】;"

 border-top:〜で枠の上辺を、
 border-bottom:〜で枠の下辺を、
 border-left:〜で枠の左辺を、
 border-right:〜で枠の右辺を個別に指定することもできます。
テキストフィールドの背景色を変える
指定のないときは白になります。
色を入れず、「none」と入れると背景がなくなり、 こんな感じで下の色や壁紙が透ける状態になります。

 style="background:【色】;"
テキストフィールドの背景に画像を使う


 style="background-image:url(【画像】)"
テキストフィールドに入力したときの文字を変える

 style="font:【サイズ】pt 【フォント】;color:【色】;"

サイズだけなら「font:○pt」で、フォントだけなら「font-family:○」でも可。
フォントは2種類以上指定する場合は「,」で区切ります。

それ以外に、太字にする「font-weight:bold」、斜体にする「font-weight:italic」というタグもあります。
テキストフィールドの中をクリックすると、フィールドの背景色が変わる


【外をクリック後の色】は、フィールド以外のところをクリックしたときの色です。
「backgroundColor」の「C」は大文字でないとだめのようです。

 style="background:【クリック前の色】" onFocus="this.style.backgroundColor='【クリック後の色】'" onBlur="this.style.backgroundColor='【外をクリック後の色】'"
テキストフィールドにはじめから文字を入れておく


 value=【はじめから入れておく文字】
テキストフィールドへの文字入力モード（日本語・英語）を決めておく
WinのIE5.0以降のみ対応です。
<input>の < > 内に以下のタグを追加します。
【入力文字】には、日本語（全角かな）なら「active」、英語（半角英数字）なら「inactive」と入れます。

 style="ime-mode:【入力文字】">

他に、「auto（デフォルトなので指定不要）」は特に入力モードを決めないという指定。
「deactive」という日本語入力のできない指定もあるぽいですが、私がSleipnirとIEで確認した限り「auto」と変わらないので、意味ないかも。

参考URL…http://members.jcom.home.ne.jp/tmlue/html/form.html
「HTMLタグ」のトップに戻る
　　サイト案内



タコ缶メルマガ
毎週日曜日22時頃発行。
ｻｲﾄの更新情報やその裏話、Q&Aなどをお届けします♪

English(Yahoo! Babel Fish)

　　お気に入りショップ
■総合
楽天市場
Yahoo!ショッピング
amazon.co.jp
ぽちっとアスクル
ムトウ On-line Shop
セシール
無印良品
ベルメゾン
FELISSIMO
HIRAKI
■レディスファッション
and it_
PENNSNECK
イーザッカマニアストアーズ
なでしこ
armoire
JJmode
TIROL SHOP
narue
■メンズファッション
Midas
Ever Green
Jiggy’s shop
GIGI
■ファッション小物
ジェイウェルドットコム
an-ten-na
ABCマート.net
Swatch
■医療・介護
007速配コンタクト
ヴィーナス
聴診器のパネシアン
■美容
コスメ・コム
コスメデネット
ぴのあ
化粧品原料通販センケン
■ウェディング
ウエディングアイテムドットネット
Stylful shopping
ペーパーガーデン
■ベビー・キッズ・マタニティ
CUSE BERRY
わくわくネンネ
あぴたきっず
姫様NENE
京都瑠璃雛菊
キャサリンコテージ
BABY BABY
布絵本のふかふか絵本
■パソコン
マウスコンピューター
EC・POWERS
Vintage Computer LLC
五州貿易
Vis-a-Vis
JTT Online Shop
Vector
■家電・インテリア
ウエストハウスギャラリー
クレッシェンド
薔薇とレースと天使のお店
フジパーツ
■キッチン
贈り物の和心屋
M' home style
■スイーツ
花のようなケーキ
アルパジョン
ちた屋特産市場
田園ぽてと
エコール・クリオロ
宇治茶 伊藤久右衛門
横浜夢本舗
ROYCE
■音楽ダウンロード
iTunes Store
リッスンジャパン
■ホビー・キャラクターグッズ
夢のあるラジコンホビーショップ
キャラアニ.com
アニメイトWEB
お宝アイドルテレカ鑑定団
■雑貨
zacca
Princess Rose
雑貨店ブルーデージー
携帯グッズ専門店ストラップヤ.com
携帯電話アクセサリーの飾り屋
デコ電パーツPrincess Rose
■花
e87.com
アニヴェルセル表参道
■金券・図書カード
カード屋さん
■ギフト
楽天ぬいぐるみカード
■その他
ホットペッパー
楽天トラベル
イーバンク銀行
ジャパンネット銀行
楽天カード
Skype
＠電子チケットぴあ
がくぶん
イーブックオフ（買取）
CHINTAI Net

　　QRコード


　　カウンタ
Total：
Today：
Yesterday：