Bootstrap

Vũ Thành Lâm

Content - Code - SEO - MMO
17/10/1979
Tây Mỗ - Nam Từ Liêm - Hà Nội
thanhlam19792003

Lamvt – Vũ Thành Lâm – bắt đầu Code 2005 Freelancer từ 2006 với hàng ngàn dự án lớn nhỏ cho nước ngoài và hàng trăm dự án web cho Việt Nam.

SEO thành công rất nhiều dự án lớn, độ khó cao.
MOD (Moderator) và Admin (Administraror) của nhiều diễn đàn về SEO và CODE web MMO tại Việt Nam
Dạy Lập trình Thiết kế Web và SEO Miễn phí 17++ Năm (Từ 2006 đến Nay)

Các phần tử và thẻ trong HTML (Elements, tags)

5/5 - (3 bình chọn)

Ở bài trước chúng ta đã tìm hiểu HTML là gì? Hôm nay chúng ta sẽ tìm hiểu các thành phần bên trong HTML. Trong HTML có 2 thành phần chính là tên thẻ (tagname) và các thuộc tính (attributes).

Contents

Phần tử HTML (HTML Elements)

Một phần tử HTML thường bao gồm một thẻ bắt đầu và một thẻ kết thúc, các nội dung được chèn vào giữa 2 thẻ này. Trong HTML có rất nhiều thẻ, vì vậy mình sẽ chỉ nói các thẻ hay dùng nhất nhé.

Thẻ có thẻ mở và thẻ đóng

  • <html> </html>
  • <body> </body>
  • <head> </head>
  • <title> </title>
  • <h1> </h1>, <h2> </h2>, …, <h6> </h6>
  • <div> </div>
  • <p> </p>
  • <table> </table>
  • <tr> </tr>
  • <td> </td>
  • <a> </a>
  • <ul> </ul>
  • <li> </li>

Thẻ khuyết thẻ đóng.

  • <meta />
  • <input />
  • <link />

Tới đây các bạn đã phần nào hình dung ra các thẻ của HTML rồi đúng không? Các bạn nên ghi nhớ cấu trúc mỗi thẻ xem thẻ nào có thẻ đóng, thẻ nào không có thẻ đóng nhé. Oke, giờ chắc các bạn cũng thắc mắc là các thẻ này có thể kết hợp được với nhau không? Mình xin trả lời là có. Mình lấy ví dụ cho các bạn dễ hình dung nhé.

Ví dụ:

Các phần tử và thẻ trong HTML (Elements, tags) code-mo-ta-the-long-the-trong-html

 

Sau khi chạy trên trình duyệt sẽ được kết quả như sau:

Các phần tử và thẻ trong HTML (Elements, tags) mo-ta-the-long-the-trong-html

Vậy có phải chỉ có mỗi thẻ đó không? Và trong mỗi thẻ đó còn có gì nữa không? Câu trả lời sẽ được đáp trong phần tiếp theo.

Các thuộc tính trong thẻ HTML (HTML Attributes)

Mỗi thẻ có các thuộc tính và chức năng riêng cho từng thẻ.

VD: Thẻ <a>: link tới trang web khác, link tới một page khác.

Thẻ <input>: Tạo ra một ô nhập dữ liệu.

<input type=”text” class=”username” name=”username” value=”” />

Để tìm hiểu sâu hơn về các thẻ, chức năng mỗi thẻ và thuộc tính của nó ra sao thì mời các bạn vào đây để xem: https://developer.mozilla.org/en-US/docs/Web/HTML/Element còn ở đây mình chỉ đề cập một số thẻ cơ bản và hay dùng. Mình sẽ nêu tác dụng và các thuộc tính của chúng ở các bài sau.

Qua bài này chúng ta đã hiểu hơn về HTML rồi phải không nào, nhưng vẫn chưa sâu lắm đâu. Mọi thứ vẫn đang đợi chúng ta ở phía trước. Bài tiếp theo chúng ta sẽ tìm hiểu về các thẻ headings trong HTML.

Tin mới nhất

VR PLUS (https://vrplus.vn/ ) Là một trong những dự án do Lamvt thực hiện trong thời gian gần đây. Như...

Trong một năm qua, chúng tôi đã xuất bản khoảng 79 bài viết SEO trên blog Ahrefs. Các bài viết...

Khám phá kĩ thuật viết nội dung SEO Nếu không có SEO, nội dung của bạn có thể bị chìm...

Các website về lĩnh vực làm đẹp cần phải có một thiết kế (design) hấp dẫn và bắt mắt. Điều...

Core Web Vitals được đo lường như thế nào? Làm thế nào để bạn biết các bản sửa lỗi đã...

Tin được yêu thích

Như đã nói, phần mềm chỉnh sửa video đang ngày càng chứng tỏ được tầm quan trọng của mình, nhất...

Nhiều bạn thắc mắc là sau khi cài đặt Plugin cho Google AMP thì làm thế nào để kiểm tra,...

Các trang web giáo dục và các trang web của chính phủ có một lợi thế hơn trong bảng xếp...

Nội dung là một trong 3 tiêu chí quan trọng để google đánh giá thứ hạng tìm kiếm cho website...

Thẻ <span> </span> Thẻ <span> là thẻ khá đặc biệt trong HTML, theo mặc định thì thẻ <span> được thêm...

Khách đang xem

  1. Bạn nghĩ gì khi nghe thấy thuật ngữ “SEO”? Bạn làm gì để duy trì hoặc cả thiện thứ hạng SEO...
    26 giây trước
  2. Hôm nay là đúng vào dịp nghỉ lễ, người người vui vẻ, nô nức đi mua sắm, vui chơi khiến...
    13 giây trước
  3. Nếu bạn đã một lần ghé thăm HADACO.VN thì chắc hẳn bạn sẽ vô cùng ngạc nhiên. Không chỉ được...
    30 giây trước
  4. Mình dám cá là, khi nghe tới WordPress Update Services bạn sẽ nghĩ ngay tới một công cụ giúp cho...
    20 giây trước
  5. Công cụ SEO Majestic là gì và cách sử dụng nó như thế nào - Công cụ SEO Majestic là...
    25 giây trước
  6. Viết bài chuẩn SEO là cách nhanh nhất giúp tăng thứ bậc website của bạn. Vậy làm thế nào để...
    25 giây trước
  7. Dotard là một từ tiếng Anh cổ mà Nhà lãnh đạo Triều Tiên Kim Jong Un dùng để đáp trả...
    23 giây trước
  8. Có bao giờ bạn tự hỏi liệu có mẹo, thủ thuật WordPress nào mà nhiều cao thủ WordPress đang dùng ...
    22 giây trước
  9. Bạn đang có dự định tạo ra một trang Website đặt phòng du lịch trực tuyến? Nhất định không nên...
    5 giây trước
  10. Thoạt nhìn, có vẻ như kể chuyện và SEO mà kết hợp với nhau giống như sự kết hợp giữa...
    13 giây trước