HTMLフォーム要素の詳しい解説(パート2)

HTMLフォーム要素の詳しい解説(パート2)

HTML 入力属性

値属性

value 属性は、入力フィールドの初期値を指定します。

<フォームアクション="">
<input type="text" name="name" value="123WORDPRESS.COM">
</フォーム>

読み取り専用属性

readonly 属性は、入力フィールドが読み取り専用 (変更不可) であることを指定します。

<フォームアクション="">
<input type="text" name="name" value="123WORDPRESS.COM" 読み取り専用>
</フォーム>

読み取り専用属性には値は必要ありません。これは readonly="readonly" と同等です。

無効属性

disabled 属性は、入力フィールドが無効であることを指定します。
無効な要素は使用できず、クリックもできません。
無効な要素は送信されません。

<フォームアクション="">
<input type="text" name="name" value="123WORDPRESS.COM" 無効 >
</フォーム>

disabled 属性には値は必要ありません。これは disabled="disabled" と同等です。

サイズ属性

size 属性は、入力フィールドのサイズを文字数で指定します。

<フォームアクション="">
<input type="text" name="name" value="123WORDPRESS.COM" size="40">
</フォーム>

maxlength属性

maxlength 属性は、入力フィールドに許可される最大長を指定します。

<フォームアクション="">
<input type="text" name="name" value="123WORDPRESS.COM" maxlength="10">
</フォーム>

maxlength 属性が設定されている場合、入力コントロールは許可された数を超える文字を受け入れません。
このプロパティはフィードバックを提供しません。ユーザーに警告する必要がある場合は、JavaScript コードを記述する必要があります。
注意: 入力制限は絶対的なものではありません。 JavaScript には無効な入力を追加する方法が多数用意されています。入力を安全に制限するには、受信者 (サーバー) も制限を確認する必要があります。

幅属性

入力フィールドの幅を定義します。 (type="image" に適用):

<フォームアクション="">
<input type="image" name="img" src="xxx.jpg" width="100">
</フォーム>

高さプロパティ

入力フィールドの高さを定義します。 (type="image" に適用):

<フォームアクション="">
<input type="image" name="img" src="xxx.jpg" height="100">
</フォーム>

src 属性

送信ボタンフォームに表示される画像の URL を定義します。

<フォームアクション="">
<input type="image" name="img" src="xxx.jpg" width="100">
</フォーム>

名前属性

入力要素の名前を定義します。

<フォームアクション="">
<input type="image" name="img" src="xxx.jpg" width="100">
</フォーム>

チェック属性

最初に読み込まれたときにこの入力要素が選択されるように指定します。

<フォームアクション="">
<input type="radio" name="single choice" チェック済み>
</フォーム>

accept属性

ファイルアップロードで送信されるファイルのタイプを指定します。

<フォームアクション="">
<input type="file" name="ファイルをアップロード" accept="text/css">
</フォーム>  

上記はこの記事の全内容です。この記事の内容が皆さんの勉強や仕事に少しでもお役に立てれば幸いです。ご質問があれば、メッセージを残してご連絡ください。123WORDPRESS.COM をご愛顧いただき、ありがとうございます。

<<:  Apache ソースコードのインストールと仮想ホストの設定に関する詳細なチュートリアル

>>:  さまざまなMySQLインデックスの使用方法の詳細な説明

推薦する

MySQL GROUP_CONCAT 制限の解決

効果: GROUP_CONCAT関数は、フィールド値を文字列に連結することができます。デフォルトの区...

Windows ベースの MySQL 8.0.12 のインストール

このチュートリアルは Windows システムにのみ適用されます。インストールしたがまだインストール...

初心者向けMySQLシリーズチュートリアル

目次1. 基本概念と基本コマンド1) 基本的な概念2) 基本コマンド2. SQL文の記述順序と実行順...

vue+el-element でファイル名に応じてダイアログを動的に作成する実践

目次背景成し遂げる1. カプセル化された /utils/dialogControl.js 2.ダイア...

MySQLの高性能最適化スキルの概要

データベースコマンド仕様すべてのデータベース オブジェクト名には小文字を使用し、アンダースコアで区切...

React Fragment の紹介と詳しい使い方

目次序文フラグメントの動機React Fragment の紹介と使用<React.Fragme...

ニューススタイルのウェブサイトデザイン例25選

bmi ボイジャーピッチフォークアルスター食料品店チャウ真/斜めポスタこれは偽のDIYですクリエイテ...

HTML でテキストの折り返しを実装する例 (HTML でテキストと画像が混在)

1. 画像の周りのテキスト通常のものを使用する場合、たとえば次のようになります。コードをコピーコー...

MySQL 8.0.17 winx64 (Navicat 付き) 手動構成バージョンのインストール チュートリアル図

1. ダウンロードアドレス: mysql-8.0.17-winx64ダウンロードして解凍する2. フ...

MySQL ルート パスワードをリセットするときに発生する「不明な列 'password'」問題を解決する方法

夜にMACの電源を入れたところ、突然ルートアカウントがMySQLに正常にログインできなくなったため、...

HTML要素を非表示にするいくつかの方法

1. CSSを使用するコードをコピーコードは次のとおりです。スタイル="display:n...

mysqlを完全にアンインストールします。個人テストです!

MySQL をクリーンアンインストールします。個人的にテストしたところ、今回はようやくうまくいきま...

MySQL パーティション テーブルに関するパフォーマンス バグ

目次2. pt-pmapを使用したスタック分析3. このコラムのボトルネックポイントの分析4. パー...

MySQL ストアドプロシージャとストアドファンクションの詳細な説明

1 ストアドプロシージャ1.1 ストアドプロシージャとは何かストアド プロシージャは、特定の機能を実...

Zen Coding 簡単で素早いHTMLの書き方

禅コーディングテキストエディタプラグインです。 Zen Coding を使用するテキスト エディター...