XtGem.com

HA QUANG PHUONG

một trang HTML. Người dùng có thể viết chữ trong trường chữ.
Trường mật khẩu
Form
Một form là một vùng mà nó bao gồm những thành phần của form.Thành phần của form là những thành phần cho phép người dùngcó thể điền thông tin như là trường chữ, menu thả xuống, nút radio, và các hộp kiểm vào một form.
Một form được xác định bởi thẻ <form>
<form>
<input>
<input>
</form>
Nhập liệu
Thẻ form được sử dụng nhiều nhất là thẻ <input>. Loại dữ liệu nhập vào sẽ được xác định bởi thuộc tính của nó. Những trường nhập liệu được sử dụng nhiều nhất được giải thích ở dưới đây.
Text field
Text field được sử dụng khi bạn muốn người dùng đánh chữ, số v.v.. vào một form.
<form>
First name:
<input type="text" name="firstname">
<br>
Last name:
<input type="text" name="lastname">
</form>
Nó sẽ xuất hiện như sau trong trình duyệt
First name:
Last name:
Bạn chú ý rằng bản thân của formthì bị ẩn đi. Hơn nữa trên hầu hết các trình duyệt trường text được mặc định là 20 ký tự.
Nút radio
Nút radio được sử dụng khi bạn muốn người dùng chọn một trong những lựa chọn bạn đưa ra.
<form>
<input type="radio" name="sex" value="male"> Male
<br>
<input type="radio" name="sex" value="female"> Female
</form>
Nó sẽ xuất hiện như sau trên trình duyệt
Male
Female
Chú ý rằng chỉ có một lựa chọn cóthể được chọn.
Hộp kiểm
Hộp kiểm được sử dụng khi bạn muốn người chọn có thể chọn nhiều lựa chọn hơn.
<form>
<input type="checkbox" name="bike">
I have a bike
<br>
<input type="checkbox" name="car">
I have a car
</form>
Nó sẽ như sau trong trình duyệt
I have a bike
I have a car
Thuộc tính hoạt động cùa form và nút Submit.
Khi người dùng nhấp chuột vào nút "submit", nội dung của form đó sẽ được gửi đến một tệp tin khác. Thuộct ính hoạt động của form xác định tên của file mà nó sẽ gửi nội dung đến. Tệp tin đó được xác định trong thuộc tính hoạt động của form và thường thìnó sẽ có những hành động với dữ liệu nó nhận được.
<form name="input" action="html_form_action.asp"
method="get">
Username:
<input type="text" name="user">
<input type="submit" value="Submit">
</form>
Trong trình duyệt nó nhìn như sau
Username:
Khi bạn gõ tên bạn vào trường chữ ở trên và nhấp vào nút Submit, bạn sẽ gửi thông tin đó vào một trang gọi là"html_form_action.asp". Trang đó sẽ chỉ cho bạn thấy dữ liệu nhận được.
Thêm một vài ví dụ
Hộp kiểm
Radio buttons
Menu thả xuống
Một dạng menu thả xuống khác
Vùng chữ
Tạo một nút bấm
Fieldset xung quanh dữ liệu
Ví dụ về form
Form với trường nhập liệu và nút Submit
Cách chèn form vào một trang, form chứa 2 trường nhập liệu và một nút submit.
Form với hộp kiểm
Form với radio buttons
Gửi email từ một form
Thẻ của form
Tag
Mô Tả
<form>
Kiểu form để nhập thông tin
<input>
Một ô nhập liệu
<textarea>
Vùng nhập liệu có nhiều hàng
<label>
Nhãn
<fieldset>
Nhóm các vùng nhập với nhau
<legend>
nhản của 1 fieldset
<select>
Danh sách chọn
<optgroup>
nhóm các phần tử trong danh sách chọn
<option>
1 phần tử trong danh sách chọn
<button>
Nút bấm
<isindex>
Hết hỗ trợ. Dùng <input> thay thế
Hình ảnh trong HTML
Với HTML bạn có thể thể hiện hìnhảnh trong tài liệu.
Ví dụ
Chèn hỉnh ảnh
Cách cho hiển thị một tấm hình trên trang web.
Chèn hình ảnh từ những vị trí khác
Cách hiện một hoặc nhiều tấm hình từ một thư mục khác hoặc từ một server khác trên trang web của bạn.
Thẻ Image và thuộc tính src
Trong HTML, hình ảnh được xác định bởi thẻ <img>. Để hiển thị một hình trên trang web, bạn cầnphải sử dụng thuộc tính src. Src làchữ viết tắt của source. Giá trị của thuộc tính src là địa chỉ URL của hình ảnh mà bạn muốn hiển thị trên trang web.
Cú pháp để xác định một tấm hình
<img src="url">
Địa chỉ URL chỉ đến điểm mà hình ảnh được lưu trữ. Một file hình có tên là "boat.gif" được đặt ở thư mục images trên www.bantayden.com có địa chỉ URL là: http://www.bantayden.com/images/boat.gif
Trình duyệt sẽ hiển thị hình ảnh nơi mà có thẻ image được chèn trong tài liệu. Nếu bạn muốn thêm thẻ image vào giữa một đoạn văn, trình duyệt sẽ hiển thị đoạn văn thứ nhất trước, sau đó đến hình và sau cùng là đoạn văn thứ hai.
Thuộc tính Alt
Thuộc tính alt được sử dụng để xác định chữ thay cho hình. Bởi vìnếu hình đó không hiện được thì một dòng chữ sẽ xuất hiện để báo cho người đọc biết. Gía trị của thuộc tính alt là một dòng chữ như sau:
<img src="boat.gif" alt="Big Boat">
Thuộc tính alt báo cho người đọc biết họ không xem được hình gì khi mà trình duyệt không load được hình đó. Trình duyệt sau đó sẽ hiển thị dòng chữ thay vì hình ảnh. Bạn nên tạo cho mình thói quen thêm thuộc tính "alt" vào mỗi tấm hình trên một trang, để tăng khả năng hiển thị và giúp những người lướt web mà khôngdùng hình ảnh.
Thêm một vài ví dụ
Hộp kiểm
Radio buttons
Menu thả xuống
Một dạng menu thả xuống khác
Vùng chữ
Tạo một nút bấm
Fieldset xung quanh dữ liệu
Ví dụ về form
Form với trường nhập liệu và nút Submit
Cách chèn form vào một trang, form chứa 2 trường nhập liệu và một nút submit.
Form với hộp kiểm
Form với radio buttons
Gửi email từ một form
Thẻ của form
Tag
Mô Tả
<form>
Kiểu form để nhập thông tin
<input>
Một ô nhập liệu
<textarea>
Vùng nhập liệu có nhiều hàng
<label>
Nhãn
<fieldset>
Nhóm các vùng nhập với nhau
<legend>
nhản của 1 fieldset
<select>
Danh sách chọn
<optgroup>
nhóm các phần tử trong danh sách chọn
<option>
1 phần tử trong danh sách chọn
<button>
Nút bấm
<isindex>
Hết hỗ trợ. Dùng <input> thay thế
Hình ảnh trong HTML
Với HTML bạn có thể thể hiện hìnhảnh trong tài liệu.
Ví dụ
Chèn hỉnh ảnh
Cách cho hiển thị một tấm hình trên trang web.
Chèn hình ảnh từ những vị trí khác
Cách hiện một hoặc nhiều tấm hình từ một thư mục khác hoặc từ một server khác trên trang web của bạn.
Thẻ Image và thuộc tính src
Trong HTML, hình ảnh được xác định bởi thẻ <img>. Để hiển thị một hình trên trang web, bạn cầnphải sử dụng thuộc tính src. Src làchữ viết tắt của source. Giá trị của thuộc tính src là địa chỉ URL của hình ảnh mà bạn muốn hiển thị trên trang web.
Cú pháp để xác định một tấm hình
<img src="url">
Địa chỉ URL chỉ đến điểm mà hình ảnh được lưu trữ. Một file hình có tên là "boat.gif" được đặt ở thư mục images trên www.bantayden.com có địa chỉ URL là: http://www.bantayden.com/images/boat.gif
Trình duyệt sẽ hiển thị hình ảnh nơi mà có thẻ image được chèn trong tài liệu. Nếu bạn muốn thêm thẻ image vào giữa một đoạn văn, trình duyệt sẽ hiển thị đoạn văn thứ nhất trước, sau đó đến hình và sau cùng là đoạn văn thứ hai.
Thuộc tính Alt
Thuộc tính alt được sử dụng để xác định chữ thay cho hình. Bởi vìnếu hình đó không hiện được thì một dòng chữ sẽ xuất hiện để báo cho người đọc biết. Gía trị của thuộc tính alt là một dòng chữ như sau:
<img src="boat.gif" alt="Big Boat">
Thuộc tính alt báo cho người đọc biết họ không xem được hình gì khi mà trình duyệt không load được hình đó. Trình duyệt sau đó sẽ hiển thị dòng chữ thay vì hình ảnh. Bạn nên tạo cho mình thói quen thêm thuộc tính "alt" vào mỗi tấm hình trên một trang, để tăng khả năng hiển thị và giúp những người lướt web mà khôngdùng hình ảnh.
Một vài ví dụ
Hình nền
Căn chỉnh hình ảnh
Để hình ảnh "bơi lội" tự do
Điều chỉnh hình với kích cỡ khác nhau
Hiển thị chữ thay thế cho tấm hình
Tạo siêu liên kết cho tấm hình
Tạo image map
Cách tạo một image map, với những vùng có thể click được. Mỗi một vùng của hình là một đường liên kết.
Biến tấm hình thành image map
Cách biến một tấm hình thành một image map. Bạn sẽ thấy nếu bạn di chuyển con chuột lên trên tấm hình, góc phần tư sẽ xuất hiện trên thanh trạng thái.
Thẻ Image
Tag
Mô Tả
<img>
Hình ành
<map>
Định nghĩa map ( sơ đồ trên 1 hình)
<area>
Định Area, 1 vùng nhỏ tương ứng trên sơ đồ
HTML Background
Một background đẹp có thể làm cho trang của bạn nhìn đẹp mắt hơn.
Ví dụ
Hình nền đẹp
Hình nền đẹp 2
Hình nền xấu
Backgrounds
Thẻ <body> có hái thuộc tính nơi mà bạn có thể chọn loại background cho mình. Background có thể là một màu hoặc là một tấm hình.
Bgcolor
Thuộc tính bgcolor thiết lập hình nền là một màu. Giá trị của thuộc tính này là hệ số hexadecimal, một giá trị màu RGB hoặc một tênmàu
<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">
Dòng code trên cùng thiết lập hình nền thành màu đen.
Background
Thuộc tính background thiết lập một tấm hình làm hình nền. Giá trịcủa thuộc tính này là địa chỉ URL của tấm hình bạn muốn sử dụng. Nếu một tấm hình nhở hơn so vớicửa sổ trình duyệt, tấm hình đó sẽtự nhân lên đến khi nào nó che phủ hết cửa sổ trình duyệt.
<body background="clouds.gif">
<body background="http://www.w3schools.com/clouds.gif">
Địa chỉ URL có thể là tương đối như là ở dòng code thứ nhất hoặc tuyệt đối như là ở dòng thứ 2.
Chú ý: nếu bạn muốn sử dụng hình nền, bạn nên nhớ rằng:
*.
Hình nền đó có làm giảm tốc độ load của trang nhiều không? thường thì hình được chọn làm hình nền không nên vượt quá 10K.
*.
Hình nền đó có hợp với các hìnhkhác trên trang không?
*.
Hình nền đó có hợp với chữ không?
*.
Hình nền đó nhìn có đẹp không nếu nó chỉ có một mình
*.
Hình nền đó có làm cho người đọc mất tập trung không?
Mẹo nhỏ giúp bạn
*.
Một số ít những trang web có sử dụng hình nền bằng hình ảnh
*.
Hầu hết các site sử dụng hình nền là màu trắng, đen hoặc xám.
(do thời gian có hạn nên tôi không thể viết tiếp nhưng bấy nhiêu đây chắc cũng giúp các bạn hiểu thêm về html và cấu trúc trang mạng nếu bạn nào muốn hiểu sâu hơn sin mời click.)