Thẻ HTML và thuộc tính

Thẻ HTML và thuộc tính

Thẻ HTML

Thẻ HTML là tên gọi của các phần tử, được sử dụng để tạo nên một tài liệu HTML. Hay nói cách khác, một trang web được tạo nên từ các thẻ HTML.

Thẻ HTML bao gồm tên thẻ được đặt trong 2 dấu ngoặc nhọn: 

<tên_thẻ>Nội dung của thẻ</tên_thẻ>

Ghi nhớ:

  • Các thẻ HTML thường bao gồm một cặp, chẳng hạn như <p> và  </p> 
  • Thẻ đầu tiên được gọi là thẻ mở, thẻ thứ hai được gọi là thẻ đóng.
  • Thẻ đóng được viết như thẻ mở, nhưng có thêm một dấu xuyệc trái (/) đặt ở trước tên.

Một số thẻ cơ bản:

Thẻ mởNội dungThẻ đóng
<h1>Học JavaScript</h1>
<p>Học lập trình cùng học JavaScript</p>
<br>không cókhông có

Thuộc tính của thẻ

Thuộc tính cung cấp các thông tin bổ sung cho các thẻ HTML

  • Các thẻ HTML có thể khai báo thêm các thuộc tính
  • Các thuộc tính cung cấp thêm các thông tin cần thiết cho thẻ
  • Thuộc tính luôn được viết trong thẻ mở
  • Thuộc tính đi thành cặp thuộc_tính/giá_trị dạng: tên_thuộc_tính=”giá_trị”

Thuộc tính title

Thuộc tính title dùng để định nghĩa tiêu đề của một thành phần HTML. Khi duyệt web, bạn di chuột tới thành phần nào của trang, một tooltip sẽ xuất hiện nếu bạn có khai báo thuộc tính title, nội dung chính là giá trị khi khai báo.

Bạn hãy thử di chuột lên tiêu đề “Thuộc tính title” bên trên.

Ví dụ:

<p title="I'm a tooltip">This is a paragraph.</p>

Thuộc tính href

Thẻ <a> dùng để khai báo một liên kết trên trang web. Muốn khai báo địa chỉ đích của liên kết ta viết thêm thuộc tính href cho nó.

Ví dụ:

<a href="https://www.hocjavascript.net">This is a link</a>

Thuộc tính về kích thước

Thuộc tính width và height dùng để khai báo kích thước của đối tượng, như của hình ảnh chẳng hạn.

  • width: chiều rộng
  • height: chiều cao

Ví dụ:

<img src="hocjavascript.jpg" width="104" height="142">

Trong ví dụ trên hình ảnh có độ rộng là 104px và cao là 142px (px:pixel – điểm ảnh, một đơn vị đo phổ biến khi thiết kế web).

Thuộc tính alt

Thuộc tính alt dùng để khai báo một đoạn văn bản thay thể (alternative) khi vì lí do nào đó, một thành phần của HTML không được hiển thị lên trang web.

Thuộc tính này cũng được đọc bởi các chương trình đọc màn hình (screen reader), dành cho những người khiếm thị (chỉ nghe được).

<img src="hocjavascript.jpg" alt="hocjavascript.net" width="104" height="142">

Lưu ý:

Luôn viết thuộc tính bằng chữ in thường

  • HTML không bắt buộc bạn phải viết tên thuộc tính in thương hay in hoa. Bạn có thể viết width hoặc WIDTH, thậm chí WiDth đều được.
  • Tuy nhiên, viết mã HTML bằng chữ in thường là tốt nhất.

Luôn đặt giá trị của thuộc tính trong cặp dấu nháy

  • HTML5 không bắt buộc bạn phải dùng cặp dấu nháy ” “ để bao đóng giá trị của thuộc tính. Nhưng bạn nên làm như vậy nếu không muốn gặp một số điều phiền phức sau này, ví dụ như giá trị của thuộc tính có chứa dấu cách.
  • Ví dụ hợp lệ (nhưng không khuyên dùng):
<a href= https://www.hocjavascript.net>

 Nhưng ví dụ sau đây sai cú pháp:

<p title= Học JavaScript>

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

  • Cả dấu nháy đơn ‘ ‘ và dấu nháy kép ” “ đều được chấp nhận khi bạn viết giá trị của thuộc tính.
  • Trong một số trường hợp, như muốn có dấu nháy trong thuộc tính, bạn có thể sử dụng các cặp dấu nháy đơn và nháy kép bao nhau.
  • Ví dụ:
<p title=' John "ShotGun" Nelson'>

 hoặc

<p title "John 'ShotGun' Nelson">

đều được chấp nhận.

Các bạn có thể tham khảo các bài viết hay về HTML tại đây.


Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

Bình luận