Mẫu HTML

HTML basic tag examples

A simple HTML file
This example is a very simple HTML file, using as few HTML tags as possible. It demonstrates how content in the body element is displayed by the browser.
Simple paragraph
This example demonstrates: how text in paragraph elements is displayed by the browser.
More paragraphs
This example demonstrates some default behaviors of paragraph elements.
Poetry issue
This example demonstrates some issues with HTML formatting.
Line break
This example demonstrates the use of line breaks in HTML documents.
Tiêu đề
Giải thích cách hiển thị thẻ tiêu đề trong tài liệu HTML.
Tiêu đề sắp đặt ở giữa
Giải thích cách sắp đặt tiêu đề ở giữa.
Đường thẳng ngang
Giải thích cách chèn đường thẳng ngang.
Chú thích ẩn
Giải thích cách chèn chú thích ẩn trong mã nguồn HTML.
Màu nền
Giải thích cách thêm màu nền cho trang HTML.

Giải thích ví dụ

Mẫu định dạng văn bản HTML

Định dạng văn bản
Giải thích cách định dạng văn bản trong tệp HTML.
Văn bản định dạng trước
Giải thích cách kiểm soát dòng trống và khoảng trống bằng thẻ pre.
Thẻ "chuẩn xuất ra của máy tính"
Giải thích cách hiển thị các thẻ "chuẩn xuất ra của máy tính" khác nhau.
Địa chỉ
Giải thích cách viết địa chỉ trong tệp HTML.
Viết tắt và viết tắt đầu tiên
Giải thích cách thực hiện viết tắt hoặc viết tắt đầu tiên.
Hướng văn bản
Giải thích cách thay đổi hướng của văn bản.
Trích dẫn khối
Giải thích cách thực hiện trích dẫn có độ dài khác nhau.
Hiệu ứng xóa và chèn văn bản
Mẫu này giải thích cách đánh dấu văn bản xóa và văn bản chèn.

Giải thích ví dụ

Mẫu liên kết HTML

Tạo liên kết超级
Giải thích cách tạo liên kết trong tài liệu HTML.
Sử dụng hình ảnh làm liên kết
Giải thích cách sử dụng hình ảnh làm liên kết.
Mở liên kết trong cửa sổ trình duyệt mới
Giải thích cách mở một trang trong cửa sổ trình duyệt mới để người dùng không cần rời khỏi trang web của bạn.
Liên kết đến vị trí khác của cùng một trang
Giải thích cách sử dụng liên kết để nhảy đến phần khác của tài liệu.
Thoát khỏi khung
Giải thích cách thoát khỏi khung nếu trang của bạn được cố định trong khung.
Tạo liên kết email
Giải thích cách liên kết đến một email. (Ví dụ này chỉ hoạt động sau khi cài đặt chương trình khách hàng email.)
Tạo liên kết email 2
Giải thích cách tạo liên kết email phức tạp hơn.

Giải thích ví dụ

Mẫu khung HTML

Khung dọc
Giải thích cách sử dụng ba tài liệu khác nhau để tạo khung dọc.
Khung ngang
Giải thích cách sử dụng ba tài liệu khác nhau để tạo khung ngang.
Cách sử dụng thẻ <noframes>
Giải thích cách sử dụng thẻ <noframes>.
Cấu trúc khung lai rơi
Giải thích cách tạo cấu trúc khung chứa ba tài liệu, đồng thời đặt chúng lai rơi trong hàng và cột.
Cấu trúc khung có thuộc tính noresize="noresize"
Giải thích thuộc tính noresize. Trong ví dụ này, khung không thể điều chỉnh kích thước. Khi kéo chuột trên cạnh khung giữa, bạn sẽ thấy rằng cạnh khung không thể di chuyển.
Khung hướng dẫn
Giải thích cách tạo khung hướng dẫn. Khung hướng dẫn bao gồm danh sách các liên kết mục tiêu là khung thứ hai. Tệp có tên "contents.htm" chứa ba liên kết.
Khung nội tuyến
Ví dụ này trình bày cách tạo khung nội tuyến (khung trong trang HTML).
Chuyển hướng đến phần được chỉ định trong khung
Ví dụ này trình bày hai khung. Một khung được thiết lập để liên kết đến phần được chỉ định trong tệp khác. Phần được chỉ định trong tệp "link.htm" được đánh dấu bằng <a name="C10">.
Chuyển hướng qua khung đến phần được chỉ định
Ví dụ này trình bày hai khung. Khung bên trái chứa danh sách liên kết làm mục tiêu cho khung thứ hai. Khung thứ hai hiển thị tài liệu được liên kết.

Giải thích ví dụ

Ví dụ về bảng HTML

Bảng
Ví dụ này trình bày cách tạo bảng trong tài liệu HTML.
Viền bảng
Ví dụ này trình bày các loại viền bảng khác nhau.
Bảng không có viền
Ví dụ này trình bày bảng không có viền.
Tiêu đề trong bảng(Heading)
Ví dụ này trình bày cách hiển thị tiêu đề bảng.
Ô trống
Ví dụ này trình bày cách xử lý ô không có nội dung bằng " ".
Bảng có tiêu đề
Ví dụ này trình bày bảng có tiêu đề (caption).
Ô bảng chéo hàng hoặc cột
Ví dụ này trình bày cách định nghĩa ô bảng chéo hàng hoặc cột.
Thẻ trong bảng
Ví dụ này trình bày cách hiển thị các yếu tố trong các yếu tố khác nhau.
Khoảng trống giữa các ô(Cell padding)
Ví dụ này trình bày cách sử dụng Cell padding để tạo khoảng trống giữa nội dung ô và viền.
Khoảng cách giữa các ô(Cell spacing)
Ví dụ này trình bày cách sử dụng Cell spacing để tăng khoảng cách giữa các ô.
Thêm nền màu hoặc hình ảnh nền cho bảng
Ví dụ này trình bày cách thêm nền cho bảng.
Thêm nền màu hoặc hình ảnh nền cho ô
Ví dụ này trình bày cách thêm nền cho một hoặc nhiều ô.
Sắp xếp nội dung trong ô bảng
Ví dụ này trình bày cách sử dụng thuộc tính "align" để sắp xếp nội dung của ô, để tạo ra bảng đẹp.
Thuộc tính khung(frame)
Ví dụ này trình bày cách sử dụng thuộc tính "frame" để kiểm soát viền xung quanh bảng.

Giải thích ví dụ

Ví dụ về danh sách HTML

Danh sách không có thứ tự
Ví dụ này trình bày danh sách không có thứ tự.
Danh sách có thứ tự
Ví dụ này trình bày danh sách có thứ tự.
Danh sách không có thứ tự khác nhau
Ví dụ này trình bày danh sách không có thứ tự.
Danh sách có thứ tự khác nhau
Ví dụ này trình bày danh sách có thứ tự khác nhau.
Danh sách嵌套
Ví dụ này trình bày cách嵌套 danh sách.
Danh sách嵌套 2
Ví dụ này trình bày danh sách嵌套 phức tạp hơn.
Danh sách định nghĩa
Ví dụ này trình bày một danh sách định nghĩa.

Giải thích ví dụ

HTML biểu mẫu và ví dụ đầu vào

Lĩnh vực văn bản (Text fields)
Lĩnh vực văn bản (Text fields)
Ví dụ này演示 cách tạo lĩnh vực văn bản trong trang HTML. Người dùng có thể viết văn bản trong lĩnh vực văn bản.
Lĩnh vực mật khẩu
Ví dụ này演示 cách tạo lĩnh vực mật khẩu trong HTML.
Ô tick
Ví dụ này演示 cách tạo ô tick trong trang HTML. Người dùng có thể chọn hoặc bỏ chọn ô tick.
Nút chọn
Ví dụ này演示 cách tạo nút chọn trong HTML.
Danh sách thả xuống đơn giản
Ví dụ này演示 cách tạo danh sách thả xuống đơn giản trong trang HTML. Danh sách thả xuống là một danh sách tùy chọn.
Một danh sách thả xuống khác
Lĩnh vực văn bản (Textarea)
Ví dụ này演示 cách tạo một lĩnh vực văn bản (ô nhập văn bản nhiều dòng). Người dùng có thể viết văn bản trong lĩnh vực văn bản. Trong lĩnh vực văn bản, số lượng ký tự có thể viết không có giới hạn.
Tạo nút
Ví dụ này演示 cách tạo nút. Bạn có thể tùy chỉnh văn bản trên nút.
Khung xung quanh dữ liệu
Ví dụ này演示 cách vẽ một khung có tiêu đề xung quanh dữ liệu.

Mô hình biểu mẫu

Biểu mẫu với trường nhập và nút xác nhận
Ví dụ này演示 cách thêm biểu mẫu vào trang. Biểu mẫu này chứa hai trường nhập và một nút xác nhận.
Biểu mẫu với ô tick
Biểu mẫu này chứa hai ô tick và một nút xác nhận.
Biểu mẫu với nút chọn
Biểu mẫu này chứa hai ô chọn và một nút xác nhận.
Gửi email từ biểu mẫu
Ví dụ này演示 cách gửi email từ biểu mẫu.

Giải thích ví dụ

Mô hình hình ảnh HTML

Chèn hình ảnh
Ví dụ này演示 cách hiển thị hình ảnh trong trang web.
Chèn hình ảnh từ vị trí khác
Ví dụ này演示 cách hiển thị hình ảnh từ thư mục khác hoặc máy chủ khác trên trang web.
Hình ảnh nền
Ví dụ này演示 cách thêm hình ảnh làm nền cho trang HTML.
Sắp xếp hình ảnh
Ví dụ này演示 cách sắp xếp hình ảnh trong văn bản.
Hình ảnh trôi
Ví dụ này演示 cách làm cho hình ảnh trôi đến bên trái hoặc bên phải của đoạn văn.
Điều chỉnh kích thước hình ảnh
Ví dụ này演示 cách điều chỉnh kích thước hình ảnh khác nhau.
Hiển thị văn bản thay thế cho hình ảnh
Ví dụ này演示 cách hiển thị văn bản thay thế cho hình ảnh. Khi trình duyệt không thể tải hình ảnh, thuộc tính văn bản thay thế sẽ thông báo cho người đọc thông tin đã mất. Thói quen thêm thuộc tính văn bản thay thế cho tất cả các hình ảnh trên trang là một thói quen tốt.
Tạo liên kết hình ảnh
Ví dụ này演示 cách sử dụng hình ảnh như một liên kết.
Tạo bản đồ hình ảnh
Ví dụ này hiển thị cách tạo bản đồ hình ảnh có khu vực có thể nhấp vào. Mỗi khu vực đều là một liên kết.
Chuyển đổi hình ảnh thành bản đồ hình ảnh
Ví dụ này hiển thị cách thiết lập một hình ảnh bình thường thành bản đồ hình ảnh.

Giải thích ví dụ

Mô hình nền HTML

Bối cảnh và màu sắc phù hợp
Một ví dụ về sự kết hợp màu sắc nền và màu chữ tốt, giúp văn bản trên trang dễ đọc.
Bối cảnh và màu sắc không phù hợp
Ví dụ về sự kết hợp màu nền và màu văn bản không tốt, làm cho văn bản trên trang khó đọc.
Hình nền mạnh mẽ
Ví dụ về hình nền và màu văn bản làm cho văn bản trên trang dễ đọc.
Hình nền mạnh mẽ 2
Ví dụ khác về hình nền và màu văn bản làm cho văn bản trên trang dễ đọc.
Hình nền kém khả năng sử dụng
Ví dụ về hình nền và màu văn bản làm cho văn bản trên trang khó đọc.

Giải thích ví dụ

Ví dụ về kiểu dáng HTML (style)

Kiểu dáng trong HTML
Ví dụ này trình bày cách sử dụng thông tin định dạng trong phần head để định dạng HTML.
Liên kết không có underline
Ví dụ này trình bày cách sử dụng thuộc tính style để tạo liên kết không có underline.
Liên kết đến bảng định dạng bên ngoài
Ví dụ này trình bày cách sử dụng thẻ <link> để liên kết đến một bảng định dạng bên ngoài.

Giải thích ví dụ

Ví dụ về đầu HTML (head)

Tiêu đề tài liệu
Thông tin tiêu đề trong phần tử head sẽ không hiển thị trong cửa sổ trình duyệt.
Một target, tất cả các liên kết
Ví dụ này hiển thị cách sử dụng thẻ base để mở tất cả các thẻ trong trang trong cửa sổ mới.

Giải thích ví dụ

Ví dụ về thông tin元 HTML (meta)

Mô tả tài liệu
Thông tin trong phần tử Meta có thể mô tả tài liệu HTML.
Từ khóa tài liệu
Thông tin trong phần tử Meta có thể mô tả từ khóa quan trọng của tài liệu.
Chuyển hướng
Ví dụ này trình bày cách chuyển hướng người dùng đến một địa chỉ khác khi địa chỉ đã thay đổi.

Giải thích ví dụ

Ví dụ về script HTML (Script)

Chèn một đoạn script
Ví dụ này trình bày cách chèn script vào tài liệu HTML.
Chạy trên trình duyệt không hỗ trợ script
Ví dụ này trình bày cách đối phó với trình duyệt không hỗ trợ script.

Giải thích ví dụ