ウェブデザインにおけるテキスト入力ボックスのパラメータの説明

一般的なゲストブック、フォーラムなどでは、テキスト入力ボックスが使われています。これは HTML 言語では textarea と呼ばれます。textarea には多数のパラメータが含まれています。これらのパラメータの使い方を習得すると、テキスト入力ボックスのサイズと外観を自由に変更して、必要な効果を実現できます。以下では、これらのパラメータとその使用方法を紹介します。
一般的なゲストブック、フォーラムなどでは、テキスト入力ボックスが使われています。これは HTML 言語では textarea と呼ばれます。textarea には多数のパラメータが含まれています。これらのパラメータの使い方を習得すると、テキスト入力ボックスのサイズと外観を自由に変更して、必要な効果を実現できます。以下では、これらのパラメータとその使用方法を紹介します。
1. cols、垂直の列。スタイルシート設定がない場合、1 行に収まるバイト数を表します。たとえば、cols=60 は、1 行に最大 60 バイト、つまり 30 個の中国語文字を格納できることを意味します。また、テキストボックスの幅はこれによって調整されることに注意してください。cols の値を入力し、入力テキストのフォントサイズを定義すると (定義されていない場合は既定値が使用されます)、テキストボックスの幅が決定されます。
2. 行、水平の列。表示できる行数を示します。たとえば、rows=10 は 10 行を表示できることを意味します。 10 行を超える場合は、スクロールバーをドラッグして参照する必要があります。 (上記のように、テキストボックスの高さはこれによって制御されます。)
3. 名前、テキストボックスの名前。この項目は、テキストを保存するときに使用する必要があるため必須です。
4. warp。 warp="off" の場合、テキスト領域は自動的に折り返されません。もちろん、指定されていない場合は、デフォルトでテキスト領域は自動的に折り返されます。このパラメータは通常、あまり頻繁に使用されません。
5. スタイル: これは、テキストボックスの背景色、スクロールバーの色とスタイル、境界線の色、入力フォントのサイズと色などを設定するために使用できる非常に実用的なパラメーターです。
6. クラスは通常、外部 CSS の設定を呼び出すために使用されます。
例 1: テキストボックスの行数と列数をそれぞれ 40 と 10 に設定します。名前はテキストです。表現形式 <textarea cols=40 rows=10 name=text></textarea>
例 2: テキストボックスの右側にあるスクロールバーをキャンセルします。式の形式は <textarea cols=40 rows=10 name=text style="overflow:auto"></textarea> です。 style="overflow:auto" は、入力テキストが設定された行数を超えると、スクロールバーが自動的に表示されることを意味します。
例 3: テキストボックスの背景色を設定します。 <textarea cols=40 rows=10 name=text style="background-color:BFCEDC"></textarea>.
例 4: さらに、テキストボックスのスクロールバーの色、境界線の色、フォントサイズ、色、行間隔などをスタイルで直接設定できます。ただし、これらは通常 CSS で設定され、直接呼び出すことができます。以下は CSS 設定コードの一部です。わかりやすいと思います。テキストボックス内の設定は、テキストボックスの背景色、上下左右の境界線の色と太さ、入力フォントのサイズなどです。
<スタイル>
.textbox { BACKGROUND: #BFCEDC; BORDER-TOP: #7F9DB9 1px solid; BORDER-LEFT: #7F9DB9 1px solid; BORDER-RIGHT: #7F9DB9 1px solid; BORDER-BOTTOM: #7F9DB9 1px solid; FONT-FAMILY: "宋体", "Verdana", "Arial", "Helvetica"; FONT-SIZE: 12px; TEXT-ALIGN: LIFT;}
</スタイル>
上記のコードをページの <head> と </head> の間に挿入します。呼び出しメソッド: <textarea cols=40 rows=10 name=text class="textbox"></textarea>。 class="" 内の名前は、CSS で使用される設定の名前に対応します。これらのパラメータに慣れると、テキスト入力ボックスを変更したり美しくしたりすることが非常に便利になります。

<<: CSS セレクタのグループ化の簡単な分析

>>: MySQL の自動増分主キーに関する詳細な説明