Bài 39: Cách sử dụng Forms trong css

Cách sử dụng Forms trong css

Forms là một phần quan trọng của các trang web cho phép người dùng nhập liệu và gửi dữ liệu đến máy chủ. CSS cung cấp nhiều thuộc tính để tùy chỉnh giao diện và kiểu dáng của các phần tử trong form.

Để sử dụng CSS cho form, bạn có thể sử dụng các Selectors như input, textarea, select, label, và button để áp dụng các thuộc tính CSS cho các phần tử này.

Ví dụ:

input[type="text"] {
  border: 1px solid #ccc;
  padding: 5px;
  font-size: 16px;
}

input[type="submit"] {
  background-color: #007bff;
  color: #fff;
  border: none;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
}

label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
}

Trong đó, các thuộc tính CSS được áp dụng cho input[type="text"] để thiết lập đường viền, kích thước chữ, và padding. Thuộc tính input[type="submit"] được sử dụng để thiết lập màu nền, màu chữ, padding và đồng thời bỏ viền của nút submit. Thuộc tính label được sử dụng để thiết lập font-weight và margin-bottom cho nhãn của các input.

Ngoài ra, bạn còn có thể sử dụng các thuộc tính như background-color, color, font-size, text-align, margin, padding, và border để tùy chỉnh các phần tử trong form.

Lưu ý rằng các thuộc tính CSS được áp dụng cho form có thể khác nhau tùy thuộc vào thiết kế của trang web và các yêu cầu của dự án.