Các thuộc tính trong HTML

(7)
150 lượt xem
Share

Chúng ta biết cấu trúc Html được tạo thành bởi các phần tử Html. Mỗi phần tử Htlm lại có những nhiệm vụ và những thuộc tính khác nhau. Vậy nay chúng ta sẽ cùng tìm hiểu xem thuộc tính trong Htlm là gì?

Mục lục nội dung

Các thuộc tính trong HTML

Các thuộc tính HTML cung cấp ý nghĩa các phần tử cho các ngữ cảnh khác nhau.

Các thuộc tính chung bên dưới có thể được sử dụng trên bất kỳ phần tử HTML nào.

1. Các thuộc tính chung trong HTML

 = thuộc tính mới trong HTML5.

Thuộc tính Mô tả
accesskey Chỉ định một phím tắt để activate/focus một phần tử
class Chỉ định một hoặc nhiều tên class cho một phần tử (tham chiếu đến một class trong một style sheet)
contenteditable  Chỉ định nội dung có được sửa hay không
contextmenu  Chỉ định một menu ngữ cảnh cho một phần tử. Menu đó hiển thị khi người dùng right-clicks vào phần tử đó
data-*  Được sử dụng để lưu trữ dữ liệu tùy chỉnh cho trang hoặc ứng dụng
dir Chỉ định hướng của văn bản cho nội dung trong một phần tử
draggable  Chỉ định một phần tử có thể kéo thả được hay không
dropzone  Chỉ định liệu dữ liệu được kéo được sao chép, di chuyển hoặc liên kết, khi bị thả ra
hidden  Được sử dụng để ẩn một phần tử
id Chỉ định một id duy nhất của một phần tử
lang Chỉ định ngôn ngữ của nội dung của phần tử
spellcheck  Chỉ định xem phần tử có được kiểm tra chính tả và ngữ pháp hoặc không
style Chỉ định một kiểu CSS nội tuyến cho một phần tử
tabindex Chỉ định thứ tự tab của một phần tử
title Chỉ định thông tin mở rộng về một phần tử
translate  Chỉ định nội dung của một phần tử phải được dịch hay không

2. Các thuộc tính HTML

Thuộc tính href

Các liên kết (links) được xác định bằng thẻ <a>. Địa chỉ liên kết được chỉ ra trong thuộc tính href:

Ví dụ

<a href="https://www.tedu.com.vn">This is a link</a>

Bạn sẽ được tìm hiểu thêm về các liên kết và thẻ <a> ở phần sau.

Thuộc tính src

Các hình ảnh được xác định bằng thẻ <img>.

Tên của nguồn ảnh (đường dẫn tới ảnh) được chỉ ra trong thuộc tính src:

Thuộc tính width và height

Trong HTML, hình ảnh có các thuộc tính về kích thước, chúng chỉ ra chiều rộng và chiều cao của ảnh.

Ví dụ

<img src="img_girl.jpg" width="500" height="600">

Kích thước của ảnh này được xác định bằng pixels: width=”500” nghĩa là ảnh rộng 500 pixel.

Thuộc tính alt

Thuộc tính alt xác định một văn bản thay thế sẽ được sử dụng, khi hình ảnh không hiển thị được.

Giá trị của thuộc tính alt có thể được đọc bởi trình đọc màn hình. Bằng cách này, một người có thể “nghe” được trang web, ví dụ như người có thị lực bị suy yếu.

Thuộc tính alt cũng hữu ích khi hình ảnh không tồn tại.

Ví dụ

Cùng xem thử nếu chúng ta cố gắng hiển thị một hình ảnh không tồn tại

Thuộc tính style

Thuộc tính style được sử dụng để xác định kiểu dáng của một phần tử như màu sắc, kiểu font, cỡ chữ, v.v…

Ví dụ

<p style="color:red">I am a paragraph</p>

Bạn sẽ được tìm hiểu thêm về định kiểu ở phần sau của khóa HTML, và khóa CSS.

Thuộc tính lang

Ngôn ngữ của tài liệu có thể được khai báo trong thẻ <html>.

Ngôn ngữ được khai báo với thuộc tính lang

Khai báo một ngôn ngữ là quan trọng cho các ứng dụng trợ năng (trình đọc màn hình) và bộ máy tìm kiếm:

<!DOCTYPE html>
<html lang="en-US">
<body>

...

</body>
</html>

 Hai ký tự đâu tiên chỉ ra ngôn ngữ (en), nếu có một phương ngữ, dùng thêm hai ký tự (US). Ở ví dụ này là ngôn ngữ Anh-Mỹ.

Thuộc tính title

Ở đây, thuộc tính title được thêm vào phần tử <p>. Giá trị của thuộc tính title sẽ được hiển thị như một chú thích khi bạn rê chuột lên đoạn văn này.

Ví dụ

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

Lưu ý: 

HTML5 không phân biệt chữ hoa và chữ thường khi viết tên thuộc tính. Ngoài ra chúng ta cũng không cần sử dụng dấu ngoặc kép cho tên thuộc tính.

Trên đây là bài viết của eLib.VN về Các thuộc tính trong HTML. Hy vọng bài viết hữu ích cho bạn đọc.

Như vậy là chúng ta đã hoàn thành nội dung "Giới thiệu về HTML". Để củng cố và nắm vững nội dung đã học, mời bạn cùng thử sức với  "Bộ Câu hỏi Trắc Nghiệm HTML có đáp án chi tiết"

Trắc Nghiệm

(7)
150 lượt xem
Share
Ngày:07/11/2020 Chia sẻ bởi:Xuân Quỳnh
TẢI VỀ XEM ONLINE

CÓ THỂ BẠN QUAN TÂM