,
- List item 1
- List item 2
- List item 3
1,
- List item 1
- List item 2
- List item 3
2, và
- List item 1
- List item 2
- List item 3
3, và nhiều hơn nữa. Các element được xác định bằng cách sử dụng dấu ngoặc nhỏ hơn và lớn hơn
- List item 1
- List item 2
- List item 3
4 bao quanh tên element.
Tags: Một Element được sử dụng các dấu ngoặc nhỏ và lớn hơn bao quanh
- List item 1
- List item 2
- List item 3
4 sẽ tạo ra các thẻ. Thẻ thường xảy ra nhất trong các cặp thẻ mở và đóng. Ví dụ thẻ mở là dấu hiệu cho bạn biết sự bắt đầu của một Element [ví dụ:
- List item 1
- List item 2
- List item 3
6]. Thẻ đóng sẽ đánh dấu vào cuối của một Element, có hình thức là dấu ngặc nhỏ + dấu chéo + dấu ngoặc lớn [ví dụ:
- List item 1
- List item 2
- List item 3
7]. Ở giữa thẻ mở và thẻ đóng là nội dung của Element. Attributes: Các attribute là các thuộc tính được sử dụng để cung cấp thông tin bổ sung về một element. Các Attributes bao gồm tên và giá trị, được xác định sau tên của một thành phần và trong thẻ mở. Attributes có định dạng: tên thuộc tính + dấu bằng + giá trị thuộc tính được trích dẫn. Ví dụ Element
- List item 1
- List item 2
- List item 3
0 gồm một Attribute href:
- List item 1
- List item 2
- List item 3
9. Một số thuộc tính mà tôi thường dùng là Attribute Class, ID, SRC, thuộc tính href,…Bố cục HTML là gì?
HTML có rất nhiều thẻ tag khác nhau và mỗi thẻ sẽ có những nhiệm vụ nhất định, giúp xây dựng nên một cấu trúc hoàn chỉnh cho Website.
Bạn có thể xem ví dụ code bên dưới để biết bố cục HTML của một trang web như thế nào:
Tiêu đề
Heading 1
Heading 2
Đoạn văn
Trong đó:
Tag thông dụng trong HTML
HTML tags có 2 loại chính đó là: block-level và inline tags. Cùng tìm hiểu 2 loại tags trong HTML là gì và cụ thể ở dưới đây.
Block-level Tags
Element Block-level sẽ sử dụng cho toàn bộ không gian web và luôn bắt đầu ở dòng mới của trang web. Các thẻ Headings và paragraph là những ví dụ trong block tags.
Trong Block-level tags của mỗi trang HTML sẽ bao gồm các thẻ:
Xem ngay
1,
Xem ngay
3 và
Xem ngay
7. Trong đó:
Nội dung ở đây ...
0 là element cao nhất dùng để đóng gói mỗi trang web HTML. Nội dung ở đây ...
1 trong thẻ tag này sẽ thường chứa thông tin meta như title page và charset. Nội dung ở đây ...
2 dùng để đóng gói tất cả nội dung sẽ hiện trên trang.
Ngoài ra, một trang HTML sẽ có các thẻ Heading 1 đến Heading 6 hay
Tiêu đề
Heading 1
Heading 2
Đoạn văn
9 đến
Nội dung ở đây ...
4. Trong đó h1 là cấp độ cao nhất, còn h6 là cấp độ thấp nhất. Các văn bản được đặt trong đoạn văn thẻ
2, quotes thì được đặt trong
Nội dung ở đây ...
6.
Tags
Tiêu đề
Heading 1
Heading 2
Đoạn văn
8 sử dụng để chứa các paragraph, images, blockquotes và các yếu tố khác. Các tags div này cũng có thể chứa các tag khác bên trong nó.
Sử dụng tag
Nội dung ở đây ...
8 cho các danh sách không theo thứ tự. Và
Nội dung ở đây ...
9 cho các danh sách theo thứ tự, nhưng trong các danh sách đó sẽ được đặt trong thẻ tag
Tiêu đề đầu tiên của tôi
0. Bạn có thể hình dung rõ hơn với ví dụ dưới đây:
- List item 1
- List item 2
- List item 3
Inlines Tags
Inlines Tags là một phần nhỏ trong không gian web và không bắt đầu dòng mới ở mỗi trang web. Thường được dùng để định dạng nội dung bên trong của block-level. Links và những tags nhấn mạnh là những inlines tags phổ biến.
Với nhiều inlines tags dùng để định dạng văn bản như
Tiêu đề đầu tiên của tôi
1 dùng để in đậm chữ, in nghiên cho văn bản đó sẽ sử dụng
Tiêu đề đầu tiên của tôi
2. Khi sử dụng hyperlinks cần sử dụng tag
4 và attributes href để xác định link cụ thể với ví dụ ở đây:
Xem ngay
Bên cạnh đó, hình ảnh cũng là một inline, bạn có thể thêm ảnh bằng cách sử dụng tag
3 mà không cần tag đóng
Tiêu đề đầu tiên của tôi
5. Nhưng cần attributes để xác định nguồn ảnh. Ví dụ:
Trong đó:
- Hình ảnh sẽ được đặt trong thẻ
3. - Attributes
5 để xác định nguồn ảnh được tải lên từ đường dẫn nào?.
6: Alternative information là thông tin thay thể có hình ảnh, khi trang web không hiện hình ảnh thì nội dung trong
6 sẽ mô tả hình ảnh đó. Và đây cũng là một yếu đó trong việc thực hiện SEO.
Phần tử HTML là gì?
Một phần tử HTML là gì? Nó được xác định bởi thẻ bắt đầu, một số nội dung và thẻ kết thúc.
Nội dung ở đây ...
Phần tử HTML là tất cả mọi thứ từ thẻ bắt đầu đến thẻ kết thúc.
Tiêu đề đầu tiên của tôi
Đoạn đầu tiên của tôi.
Start tagElement contentEnd tag
7My First Heading
Đoạn đầu tiên của tôi.
1
9My first paragraph.
6
Đoạn đầu tiên của tôi.
4none
Đoạn đầu tiên của tôi.
5
Lưu ý: Một số phần tử HTML không có nội dung [như phần tử
Đoạn đầu tiên của tôi.
4]. Các yếu tố này được gọi là các yếu tố trống. Các yếu tố trống không có thẻ kết thúc!
Xem thêm: 5 bước để tạo menu ngang trong HTML và CSS đơn giản
Cấu trúc trang HTML là gì?
Dưới đây là một hình ảnh trực quan của cấu trúc trang HTML:
Tiêu đề trang
Đây là một tiêu đề
Đây là một đoạn văn.
Lưu ý: Chỉ nội dung bên trong phần [vùng màu trắng ở trên] mới được hiển thị trong trình duyệt. Nội dung bên trong phần tử sẽ được hiển thị trên thanh tiêu đề của trình duyệt hoặc trong tab của trang.
Sự khác biệt giữa HTML và HTML 5
Xem ngay0 xác định rằng tài liệu này là một tài liệu HTML5.
Phần tử Xem ngay
1 là phần tử gốc của trang HTML.Xem ngay
3 chứa thông tin meta về trang HTML.Xem ngay
5 chỉ định tiêu đề cho trang HTML [được hiển thị trong thanh tiêu đề của trình duyệt hoặc trong tab của trang].Xem ngay
7xác định phần thân của tài liệu và là vùng chứa cho tất cả các nội dung hiển thị, chẳng hạn như tiêu đề, đoạn văn, hình ảnh, siêu liên kết, bảng, danh sách, v.v.Phần tử
7 xác định một tiêu đề lớn.Phần tử
9 xác định một đoạn.Nếu bạn làm lập trình viên thì cũng đừng quên MVC là gì? Bạn cần biết nó để sử có thể áp dụng mô hình này trong quá trình thực hiện các dự án lớn. Hỗ trợ rất nhiều trong công việc của bạn.
Câu hỏi thường gặp
1. Tại sao chúng ta nên sử dụng HTML?
HTML— “Ngôn ngữ đánh dấu siêu văn bản” —là ngôn ngữ được sử dụng
để cho trình duyệt web của bạn biết từng phần của trang web là gì .
Vì vậy, bằng cách sử dụng HTML, bạn có thể xác định tiêu đề, đoạn văn, liên kết, hình ảnh và hơn thế nữa, để trình duyệt của bạn biết cách cấu trúc trang web bạn đang xem.
2. HTML có dễ học không?
HTML có lẽ là một trong những ngôn ngữ lập trình front-end dễ sử dụng nhất .
Vì vậy, nếu bạn muốn học HTML, thì hãy bắt đầu ngay hôm nay!
Với sự kiên nhẫn và thực hành, chắc chắn bạn sẽ học được cách tận dụng tối đa ngôn ngữ phổ biến này.
3. Ví dụ HTML là gì?
HTML [Ngôn ngữ đánh dấu siêu văn bản] là mã được sử dụng để cấu trúc một trang web và nội dung của nó.
Ví dụ:
Nội dung có thể được cấu trúc trong một tập hợp các đoạn văn, một danh sách các dấu đầu dòng hoặc sử dụng hình ảnh và bảng dữ liệu .
Lời kết
Từ những thông tin trên hy vọng sẽ đem lại cho bạn một cái nhìn mới mẻ hơn về HTML là gì và có thể sớm tạo cho mình được một trang web hoàn chỉnh. Mong bài viết này sẽ giúp bạn hiểu rõ về HTML và một số thao tác cơ bản. Chúc các bạn thành công.
Chia sẻ bài viết
Đánh giá
5/5 - [5 votes]
Nguyễn Hưng
Kết nối với mình qua
Mình là Bo - admin của Quản Trị Linux. Mình đã có 10 năm làm việc trong mảng System, Network, Security và đã trải nghiệm qua các chứng chỉ như CCNP, CISSP, CISA, đặc biệt là chống tấn công DDoS. Gần đây mình trải nghiệm thêm Digital Marketing và đã hòan thành chứng chỉ CDMP của PearsonVUE. Mình rất thích được chia sẻ và hỗ trợ cho mọi người, nhất là các bạn sinh viên. Hãy kết nối với mình nhé!