HTMLのfieldsetタグ
このレッスンでは、HTMLでfieldsetタグを使用する方法を学習します。フィールドセットは、関連する要素をフォームにグループ化します。
このような情報をグループ化すると、ユーザーは何を入力するかを簡単に識別できます。
具体的には、fieldsetタグは、その中の要素の周りにフレームを作成します。
1. HTMLのfieldsetタグとは何ですか？
fieldsetタグは、フォームの関連部分をグループ化して、ユーザーが正しい情報を簡単に入力できるようにします。
fieldsetタグは、関連する要素の周囲にフレームを作成します。
多くのフィールドを含む入力フォームをユーザーに送信する場合、フィールドにラベルタグで注釈を付けると、ユーザーに入力してほしい情報に関する十分な情報がユーザーに提供されない場合があります。次に、fieldsetタグを使用すると、その情報を簡単に入力できるようになります。
注：凡例タグを使用して、フィールドセットグループのキャプションを作成できます。
2.HTMLでフィールドセットを使用する方法
例1 ：fieldsetタグを使用して、個人情報を必要とするタグをグループ化します。
<!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại web888.vn</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại web888.vn</h1> <form> <fieldset> <legend>Thông tin</legend><br /> Name:<input type="text" name="name"><br /> Email:<input type="text" name="email"><br /> </fieldset> </form> </body> </html>例2 ：fieldsetタグを使用して、顧客をグループ化し、情報フィールドを保存します。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <h2>Thẻ fieldset Trong HTML</h2> <div> <form> <fieldset> <legend>Thông tin khách hàng</legend> Tên: <input type="text"><br> Email: <input type="text"><br> Địa chỉ: <input type="text"> </fieldset> <fieldset> <legend>Thông tin cửa hàng</legend> Tên: <input type="text"><br> Địa chỉ: <input type="text"> </fieldset> </form> </div> </body> </html>3.フィールドセットの属性.tag
このタグには、次の2つの基本的な属性があります。
- disable-fieldsetタグ内の要素を無効にします。
- name-フィールドセット領域の名前。
たとえば、disabled属性を使用して、タイムゾーン、国などの固定情報を無効にします。
<!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại web888.vn</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại web888.vn</h1> <form> <fieldset> <legend>Thông tin cá nhân</legend><br /> Name:<input type="text" name="name"><br /> Email:<input type="text" name="email"><br /> </fieldset> <fieldset disabled="disabled"> <legend>Thông tin cố định</legend><br /> TimeStamp:<input type="text" name="time"><br /> Country:<input type="text" name="country"><br /> </fieldset> </form> </body> </html>4.フィールドセットをサポートするブラウザ
- クロム
- Firefox
- IE
- サファリ
- オペラ
Bài viết liên quan:
Dịch vụ thiết kế Wesbite
