Menu
GIỚI THIỆU
  • Bài này chúng ta học về Elements và Attributes HTML trong việc xây dựng giao diện website, cách đặt tên thẻ HTML và thuộc tính của thẻ HTML

Bài 02: Tìm hiểu HTML Elements và Attributes

Ở bài HTML là gì mình có nói HTML bản chất giống XML nên nó được tạo thành từ hai thành phần chính đó là tên thẻ (tagname) và các thuộc tính (attribute). Đối với XML thì tên thẻ ta có thể tự định nghĩa nhưng với HTML thì bạn phải sử dụng tên thẻ có trong danh sách HTML Elements, nếu không trình duyệt sẽ không hiểu thẻ mà bạn đang sử dụng là gì.

1. HTML Elements (thẻ HTML)

Các phần tử HTML

Một phần tử HTML thường bao gồm thẻ mở và thẻ đóng , với nội dung được chèn vào giữa:

<tagname> Nội dung ở đây ... </tagname>

Phần tử HTML là mọi thứ từ thẻ mở đến thẻ đóng:

<p> nội dung. </p>

- Trong đó 

<p> là thẻ mở (opentag).

<p> là thẻ đóng (closetag).

#Xem qua bảng này các bạn sẽ hiểu rõ hơn

Thẻ mở Nội dung Thẻ đóng
<h1> Nội dung </h1>
<p> Nội dung </p>

Các trường hợp đặc biệt

Trong HTML có các thẻ đặc biệt được gọi là thẻ khuyết hay quick closetag được hiểu rằng thẻ đó đảm nhiệm vai trò vừa là thẻ mở, vừa là thẻ đóng. Dưới đây là ví vụ 3 thẻ : input, link, meta

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

Các phần tử HTML lồng nhau

Các phần tử HTML có thể được lồng nhau (các phần tử có thể chứa các phần tử). 

Tất cả các tài liệu HTML bao gồm các phần tử HTML lồng nhau.

Ví dụ này chứa bốn phần tử HTML:

<!DOCTYPE html>
<html>
<body>

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

</body>
</html>

2. HTML Attributes (thuộc tính của thẻ html)

Thuộc tính HTML

  • Tất cả các thẻ trong HTML có thể có thuộc tính.
  • Thuộc tính cung cấp thông tin và bổ sung cho một thẻ (tag) HTML.
  • Thuộc tính luôn nằm trong thẻ mở [ <a href="http://hoicode.com" > hoicode.com </a>]
  • Thuộc tính thường đi kèm trong cặp tên / giá trị như: name = "value"

Thuộc tính lang

Ngôn ngữ của tài liệu có thể được khai báo trong thẻ <html> . Sử dụng thẻ Lang để khai báo ngôn ngữ cho website là rất quan trọng đối với các ứng dụng khả năng truy cập và máy chủ tìm kiếm.

VD: thuộc tính thẻ lang

<!DOCTYPE html>
<html lang="vi-VN">
<body>

...

</body>
</html>
 

Hai chữ cái đầu tiên chỉ định ngôn ngữ (vi) còn (VN) là nơi sử dụng ngôn ngữ đó chính là Việt Nam

Thuộc tính href

Liên kết trong HTML được sử dụng bằng thẻ <a>. Địa chỉ liên kết được chỉ định trong thuộc tính href :

Ví dụ:

<a href="http://hoicode.com/">hoicode.com</a>

Thuộc tính width và height

Hình ảnh HTML được định nghĩa bằng thẻ <img> .

Đường dẫn tới một img sử dụng thuộc tính src ) và kích thước của hình ảnh ( width height ) được cung cấp dưới dạng các thuộc tính :

<img src="logo-hoicode.png" width="221" height="81">

Các bạn có thể xem thêm kiến thức về các thuộc tính tại (w3schools.com/html/html_attributes.asp) nhé.

3. Lời kết bài học số 2

Như vậy trong bài này mình đã giới thiệu với bạn cách đặt tên thẻ HTML và các thuộc tính riêng của nó. Bài này vẫn chưa đi sâu vào các thẻ thông dụng nên vẫn còn hơi chán chút xíu nhưng bạn phải hiểu các quy tắc trên thì ở các bài tiếp theo bạn mới dễ học HTML Tag định dạng văn bản.

Ghi nguồn hoicode.com khi đăng tải lại bài viết này.
Link: Bài 02: Tìm hiểu HTML Elements và Attributes

Chia sẻ liên kết

ĐĂNG BÌNH LUẬN: Đăng câu hỏi trên Facebook để được hỗ trợ nhanh nhất.

    Email của bạn sẽ được sử dụng với mục đích thông báo tin tuyển dụng mới hoặc các bài viết mới.

    captcha