Tạo Form với HTML và CSS
- September 21, 2009
- 33 comments
Form là cửa ngõ của một trang web, là công cụ duy nhất giúp bạn với người đọc tương tác với nhau cho dù có bằng email, diễn đàn, comments … thì đều là một dạng của form. Trong bài này chúng ta sẽ đi xây dựng một Form bằng HTML và sau đó sẽ dùng CSS để định dạng nó. Chúng ta sẽ không xử lý form này bằng PHP trong tutorial này.
Thời lượng:23:17
Link Download định dạng .avi chất lượng cao: MegaUpload, MediaFire
File Size: 42.11MB
Hiệu đính:Trong video tôi có đề cập đến việc đặt class=”email-private” để style cho label. Nhưng bạn cũng có thể sử dụng label[for="private"] để style cho label này. Đọc comment của NickB ở dưới để biết thêm chi tiết.
« Cách viết code gọn gàng, mạch lạc
. đại loại là bạn echo ra 1 cái j đó nhưng trước đó đã...
mình tìm thấy lỗi sai rồi nhé.
lable span {
color: red;
}
sai
and khác nhau
label span {
color: red;
}
đúng
Video tutorial rất hay. Nhưng em vẫn chưa hiểu về cái Float và Clear. Em đã đọc nhiều tài liệu và xem video, nhưng không hiểu em cứ … ngu ngơ chỗ này.
Anh hay bạn nào hiểu về phần này có thể trả lời cho em biết. Cảm ơn các bro rất nhiều.
Bởi trên bài thì cái label {
float:left;
//Nhưng sau đó lại dùng
clear:left
// để ý thì thấy còn chỗ nào mà xóa đâu, nếu xóa nó lại vào chỗ float
}
ngưỡng mộ anh quá! mong anh có nhiều bài viết hay hơn nữa.
Anh DW ơi, nếu muốn làm text khi hover và active vào text thì phải làm sao anh
Cảm ơn a DW nhiều.
trang web của anh thật bổ ích có nhiều video hướng dẫn cụ thể và có luôn demo. ước gì có nhiều người như anh nhỉ
Lên mạng tìm cái dạy form ở Access, vô tình tìm thấy cái này. Ngưỡng mộ quá. Anh giỏi quá…
sao comment không được vậy
cam on anh ! a that pro :d . uoc ji minh co kien thuc nhu a y !
Hay thiệt!
em mới bắt đầu học về web nhưng em ko pit bắt đàu từ đâu.Mong ah có thể chỉ cho em các típ cận về học thiết kế web là như thế nào.
Em xin cảm ơn !
Cảm ơn bạn!
Rất pro.
Những bài viết của anh rất hay và nhiệt tình,có cả demo lên em rất thích.Cảm ơn tinh thần chia sẽ free của anh.Chúc anh sức khỏe và thành công
Thanks a nhiều nhiều luôn nha. A pro quá
để lưu trữ database thì phải Code Php bạn ak. Bạn nào biết chỉ cho t với
DW ơi, tạo form bằng HTML thì các thông tin lưu trữ ở đâu? Bạn có thể hướng dẫn cách tạo database lưu trữ thông tin tù các form HTML được không?
Xin cảm ơn!
Cái đó tuỳ theo project bạn làm chứ có phải cái nào cũng giống cái nào đâu !
Cái thứ 2 là bạn phải hiểu rằng khi bạn gửi thông tin đi bằng cách nào POST hay GET để lấy thông tin còn lưu vào database thì quan trong vào ý đồ của người làm form
ví dụ : Làm form đăng ký thì database phải có bảng user_reg chẳng hạn tôi đặt là thế bạn có thể đặt khác đi nhưng các trường sẽ là user_reg(id, username, password, email, datereg,…) trên đây tôi chỉ đưa ra một số cái cơ bản cho bạn thấy thôi còn cách chèn nó vào thì bạn phải có câu truy vấn chèn các xử lý thì bạn hãy xem một số video của anh DW ấy có hướng dẫn khá chi tiết
anh biết cách thiết kế forumotion = cái này ko anh giúp em zới
Anh ơi em làm xong khi mở bằng firefox thì ok còn mở bằng IE thì nó xấu quá, cái chữ trong thẻ legend ko đưa lên trên được, cái button nó tuột xuống dưới sao mà sữa đây anh, chỉ em với
vấn đề là bạn phải cấp quyền và phân quyền cho đúng thôi. goodluck
mình làm 1 website, đang gặp vấn đề khi phân quyền cho những user đăng ký tài khoản. Làm sao khi đăng ký có thể phân quyền ngay sau khi họ đăng ký xong. Xin tư vấn
em đang cần bài này thanks anh nhiều…
ok. cảm ơn bạn nhiều lắm hiều được nó chút ít rùi. hi hi
mình không hiểu đoạn css
label{
display:block;
width:100px;
float:left;
clear:left;
font-weight:bold;
line-height:16px;
padding:0px 0px 0px 10px;
}
như zậy mình vừa float:left song lại xóa nó luôn. mình hog hiểu. bạn có thể giải thích giùm chút hog ?
Thực sự ở câu này thì ý nghĩa của nó không như vậy. Float : left chính xác tác dụng nó sẽ chuyển nhãn lable này về bên trái màn hình sát với đối tượng mà nó nằm trong.
Nhưng ngược lại Clear : left chỉ là xóa đi những khoảng trắng nằm bên trái nó, tức là khoảng không gian được tạo nên bởi những div trước nó. Thay vì bạn phải tốn 1 div để đặt clear:left thì bạn có thể clear ngay tại lable này nếu nó nằm sau nhưng đối tượng trên kia. ^^ have fun
adasdasdnbk qbkdhqiueh qihe
Các pro có thể chỉ thêm cho em code làm sao cho coment của khách có thể gửi tới mail của mình được không, thanks!
đó là anh dùng javaScrip hay j vậy anh? anh có thể nói rõ cho em hiểu hơn chút dc không? Cảm ơn anh nhìu
Cái đó rất có thể phải sử If … Else statement để làm.
Ví dụ
if ($_POST['select'] == ‘nam’) {
echo ….
}elseif{ ….
}
Đại loại vậy
hịc. Có ai giúp em với đi. Please!!!
Anh DW ui cho em hỏi cái. em muốn mấy thẻ “select” có liên hệ với nhau thì phải làm thế nào hả anh?
Ví dụ như
Nam
Nữ
Tên em xinh xinh 1
Tên em xinh xinh 2
Tên cu cậu 1
Tên cu cậu 2
mà khi em nháy vào ô chọn “gioiTinh” là nam thì khi sang bên “ten” thì chỉ hiện “Tên cu cậu 1″ và “Tên cu cậu 2″ thui chứ không hiện tên 2 em kia nữa, và ngược lại khi chọn “gioiTinh” là “nữ”.
Nếu cái này mà anh có nói rùi thì chỉ hộ em cái, em tìm nhưng không thấy.
Thank anh nhìu nhìu! Thân.
Em không hiểu sao phải cho mỗi label và input vào thẻ div hả anh???
Quá hay! cảm ơn NickB nhé. Cái này đúng là tôi chưa biết đến, hy vọng sau khi xem video mọi người đều đóng góp ý kiến xây dựng để kiến thức được hoàn thiện hơn.
Đã update lại trên video.
À không phải là trong CSS không thể style vào một thành phần cụ thể đâu. Để syle cho lable for=”priviate” bạn có thể sử dụng bộ chọn giá trị của thuộc tính để thay thế cho việc phải đặt thêm class hay id
Nên sử dụng bộ chọn : label[for="priviate"] để style
DW coi lại nhé !