Kiến thức tổng hợp

Tìm hiểu về thuộc tính trong HTML – HTML Attributes

Thuộc tính là gì ?

Thuộc tính trong HTML được sử dụng để xác định các đặc điểm của phần tử. Nó được đặt bên trong thẻ mở của phần tử. Tất cả các thuộc tính được tạo thành từ hai phần – tên (name)  và giá trị ( value)

  • Các Name là tài sản bạn muốn thiết lập. Ví dụ: Phần tử <p> đoạn văn trong ví dụ này mang một thuộc tính có tên là align . Bạn có thể sử dụng thuộc tính này để chỉ ra sự căn chỉnh của đoạn văn trên trang.
  • Các Value là những gì bạn muốn giá trị thiết lập và luôn đặt trong trích dẫn. Ví dụ dưới đây cho thấy ba giá trị có thể có của thuộc tính align: left, center và right .

Tên thuộc tính và giá trị thuộc tính không phân biệt chữ hoa chữ thường. Tuy nhiên, World Wide Web Consortium (W3C) đề xuất đặt hết chữ thường.

Ví dụ về thuộc tính trong HTML

<!DOCTYPE html> 
<html>
 
   <head> 
      <title>Align Attribute  Example</title> 
   </head>
	
   <body> 
      <p align = "left">Trái</p> 
      <p align = "center">Giữa</p> 
      <p align = "right">Phải</p> 
   </body>
	
</html>

Kết quả hiển thị sẽ như sau:

Trái
                                    Giữa
                                                                               Phải

Có 4 thuộc tính cốt lõi được sử dụng trong HTML. Bao gồm

  • id
  • title
  • class
  • style

Thuộc tính id trong HTML

Thuộc tính id trong HTML được sử dụng để nhận diện bất kỳ yếu tố nào trong một trang HTML. Có 2 lý do chính mà bạn có thể muốn sử dụng thuộc tính id trên một phần tử.

  • Nếu một phần từ mạng thuộc tính id như nhận dạng duy nhất, thì có thể chỉ xác định phần tử đó và nội dung của nó
  • Nếu bạn có 2 phần tử cùng tên trong 1 trang web. Bạn có thể sử dụng thuộc tính id để phân biệt giữa các phần tử cùng tên.
Có thể bạn cần →   HTML là gì ? Tổng quan về HTML

Ví dụ:

<p id = "html"> Giải thích HTMl là gì ?</p>
<p id = "css">Giải thích rằng CSS là gì ?</p>

Thuộc tính title trong HTML

Thẻ này được xác định đơn giản đó chính là tiêu đề của một trang web hoặc 1 đoạn văn. Ví dụ:

<title>Trợ Giúp Nhanh  | Kiến thức đời sống, sức khỏe và công nghệ</title>

Thuộc tính Class trong HTML

Class trong HTML được sử dụng để kết hợp một phần tử với một Style Sheet và xác định lớp của nguyên tố.

class="className1 className2 className3"

Thuộc tính Style trong HTML

Thuộc tính này cho phép b ạn chỉ định các quy tắc Cascading Style Sheet ( CSS) trong phần tử.

<!DOCTYPE html>
<html>

   <head>
      <title>Học HTML tại TGN</title>
   </head>
	
   <body>
      <p style = "font-family:arial; color:#FF0000;">Tôi học HTML</p>
   </body>
	

Kết quả.

Tôi học HTML

Một số thuộc tính khác sử dụng với nhiều thẻ HTML

Thuộc tínhTùy chọnChức năng
alignright, left, centerCăn chỉnh theo chiều ngang các thẻ
valigntop, middle, bottomCăn chỉnh theo chiều dọc các thẻ trong phần tử HTML.
bgcolornumeric, hexidecimal, RGB valuesĐặt màu nền phía sau phần tử
backgroundURLĐặt hình nền phía sau phần tử
idUser DefinedĐặt tên cho một phần tử để sử dụng với CSS
classUser DefinedPhân loại một phần tử để sử dụng với CSS
widthNumeric ValueChỉ định chiều rộng của bảng, hình ảnh hoặc ô bảng
heightNumeric ValueChỉ định chiều cao của bảng, hình ảnh hoặc ô bảng
titleUser DefinedTiêu đề nổi bật của các phần tử

Tùng Lâm

Xin chào, mình là Lâm. Hiện tại mình đang là Network Engineer / Security Engineer. TGN là nơi mình viết bài khi có những thời gian rảnh rỗi.

Bài viết liên quan

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
Back to top button
0
Would love your thoughts, please comment.x
()
x