Cách thực hiện - Biểu mẫu tìm kiếm hoạt hình
Tìm hiểu cách tạo biểu mẫu tìm kiếm động bằng CSS.
Cách tạo biểu mẫu tìm kiếm hoạt hình
Bấm vào trường đầu vào:
Bước 1) Thêm HTML:
Ví dụ
<input type="text" name="search" placeholder="Search..">
Bước 2) Thêm CSS:
Ví dụ
input[type=text] {
width: 130px;
-webkit-transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}
/* When the input field gets
focus, change its width to 100% */
input[type=text]:focus {
width: 100%;
}
Hãy tự mình thử »Mẹo: Hãy truy cập Hướng dẫn biểu mẫu HTML của chúng tôi để tìm hiểu thêm về Biểu mẫu HTML.
Hãy truy cập Hướng dẫn về biểu mẫu CSS của chúng tôi để tìm hiểu thêm về cách tạo kiểu cho Biểu mẫu HTML.