Nhảy tới nội dung

Tổng quan về HTML

HTML là gì?​

  • HTML = HyperText Markup Language
  • HTML mô tả cấu trúc của một trang web.
  • Nhắc đến HTML là nhắc đến phần tử (element) được tạo ra từ những thẻ (tag).
  • Các element cho trình duyệt web (browser) biết cách hiển thị nội dung của một trang web.

Một tài liệu HTML cơ bản​

<!DOCTYPE html>
<html>
<head>
    <title>Page Title</title>
</head>

<body>
    <h1>My First Heading</h1>
    <p>My first paragraph.</p>
</body>
</html>

Chạy thử nghiệm

Thẻ HTML (Tag)​

Thường thì sẽ đi theo cặp gồm: thẻ đóng và thẻ mở. Ví dụ: <p> là thẻ mở, </p> là thẻ đóng.

Có một số trường hợp, thẻ không đi theo cặp, như: <img />, <hr />, ...

Phần tử HTML (Element)​

Cú pháp của một HTML Element

Các element có thể lồng nhau.

Thuộc tính HTML (Attribute)

Thuộc tính của element cho biết thêm thông tin về element đó và luôn được viết ở thẻ mở.

Cú pháp thuộc tính HTML

name = "value"

Dùng nháy đơn hay nháy kép?

  • Giá trị của thuộc tính có thể được bọc bởi một cặp nháy đơn hay nháy kép đều được.
  • Cũng có thể kết hợp cả hai:
<img alt='I love "Kmin" from my heart.'>
<img alt="I love 'Kmin' from my heart.">

Dạo một vòng các thẻ HTML thông dụng

<!DOCTYPE html>
<html>
  <head>
    <title>Heading</title>
  </head>
  <body>
    <h1>Day the la h1</h1>
    <h2>This is heading 2</h2>
    <h3>This is heading 3</h3>

    <hr />
    <p>This is a paragraph</p>
    <p>This is another paragraph</p>

    <hr />
    <a href="https://www.kmin.edu.vn">This is a link</a>

    <hr />
    <img src="kmin.png" width="100%" />

    <hr />
    <h2>An Unordered HTML List</h2>
    <ul>
      <li><b>Coffee</b></li>
      <li>Tea</li>
      <li>Milk</li>
    </ul>
    <h2>An Ordered HTML List</h2>
    <ol>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ol>

    <hr />
    <button>Click me</button>
  </body>
</html>

Chạy thử nghiệm