06/04/2021, 14:49

hẻ fieldset trong HTML - Các thẻ HTML

Code RUN <!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại Zaidap.com.net</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại Zaidap.com.net</h1> ...

Thẻ fieldset sẽ nhóm các phần tử có liên quan trong một form.

Việc nhóm các thông tin như vậy sẽ giúp người dùng có thể dễ dàng trong việc xác định nội dung cần nhập.

Cụ thể, thẻ fieldset sẽ tạo một khung bao quanh những phần tử nằm trong nó.

Cách sử dụng thẻ fieldset.

Ví dụ: sử dụng thẻ fieldset để nhóm các thẻ yều cầu nhập thông tin cá nhân.

Code RUN
<!DOCTYPE html>
<html>
    <head>
    	<title>Học lập trình miễn phí tại Zaidap.com.net</title>
		<meta charset="utf-8">
	</head>
    <body>
    	<h1>Học lập trình miễn phí tại Zaidap.com.net</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>

Thuộc tính của thẻ fieldset

  • disabled - vô hiệu hóa các phần tử nằm bên trong thẻ fieldset.
  • name - tên của vùng fieldset.

Ví dụ: sử dụng thuộc tính disabled để vô hiệu hóa thông tin cố định như múi giờ, quốc gia.

Code RUN
<!DOCTYPE html>
<html>
    <head>
    	<title>Học lập trình miễn phí tại Zaidap.com.net</title>
		<meta charset="utf-8">
	</head>
    <body>
    	<h1>Học lập trình miễn phí tại Zaidap.com.net</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>

Trình duyệt hỗ trợ

  • Chrome
  • Firefox
  • IE
  • Safari
  • Opera

Tham khảo: w3schools.com

Nguồn: Zaidap.com.net

Bùi Văn Nam

27 chủ đề

7090 bài viết

Cùng chủ đề
0