Cafedev chia sẻ về các thuộc tính trong HTML, nó cung cấp thông tin bổ sung cho các phần tử của HTML.
Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:
Chào thân ái và quyết thắng!
Nội dung chính
1. Thuộc tính HTML
- Tất cả các phần tử HTML có thể có các thuộc tính
- Các thuộc tính cung cấp thêm thông tin cho các yếu tố
- Các thuộc tính luôn được chỉ định trong thẻ bắt đầu
- Các thuộc tính thường có các cặp tên / giá trị như: name = “value”
2. Thuộc tính href
Thẻ <a> định nghĩa một liên kết. Thuộc tính href chỉ định URL của trang mà liên kết đến:
<a href="https://cafedev.vn">Cafedev</a> 3. Thuộc tính src
Thẻ <img> được sử dụng để nhúng hình ảnh vào trang HTML. Thuộc tính src chỉ định đường dẫn đến hình ảnh sẽ được hiển thị:
<img src="img_cafedev.jpg"> 4. Các thuộc tính chiều rộng và chiều cao
Thẻ <img> cũng phải chứa các thuộc tính width và height, chỉ định chiều rộng và chiều cao của hình ảnh (tính bằng pixel):
<img src="img_cafedev.jpg" width="500" height="600"> 5. Thuộc tính alt
Thuộc tính alt được yêu cầu cho thẻ <img> chỉ định văn bản thay thế cho hình ảnh, nếu hình ảnh vì lý do nào đó không thể được hiển thị. Điều này có thể là do kết nối chậm hoặc lỗi trong thuộc tính src hoặc nếu người dùng sử dụng trình đọc màn hình.
Ví dụ:
<img src="img_girl.jpg" alt="Girl with a cafedev"> 6. Thuộc tính phong cách(style)
Thuộc tính style được sử dụng để thêm kiểu vào một phần tử, chẳng hạn như màu sắc, phông chữ, kích thước và hơn thế nữa.
<p style="color:red;">This is a red paragraph.</p> 7. Thuộc tính lang
Bạn phải luôn bao gồm thuộc tính lang bên trong thẻ <html> để khai báo ngôn ngữ của trang Web. Điều này có nghĩa là để hỗ trợ công cụ tìm kiếm và trình duyệt.
Ví dụ sau chỉ định tiếng Anh là ngôn ngữ:
<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>
Mã quốc gia cũng có thể được thêm vào Code ngôn ngữ trong thuộc tính lang. Vì vậy, hai ký tự đầu tiên xác định ngôn ngữ của trang HTML và hai ký tự cuối xác định quốc gia.
Ví dụ sau chỉ định tiếng Anh là ngôn ngữ và Hoa Kỳ là quốc gia:
<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html> 8. Thuộc tính tiêu đề
Thuộc tính title định nghĩa một số thông tin bổ sung cho một phần tử.
Giá trị của thuộc tính title sẽ được hiển thị dưới dạng chú giải khi bạn di chuột qua phần tử:
<p title="I'm a tooltip">This is a paragraph.</p> 9. Một số kinh nghiệm
- Luôn sử dụng các thuộc tính bằng chữ thường
Không nên ghi là TITLE hay ghi là title
- Luôn trích dẫn giá trị thuộc tính
Good
<a href="https://cafedev.vn/html/">Visit our HTML tutorial</a> Bad
<a href=https://cafedev.vn/html/>Visit our HTML tutorial</a> 10. Nên dùng dầu nhấy đơn hay đôi?
Dấu ngoặc kép xung quanh các giá trị thuộc tính là phổ biến nhất trong HTML, nhưng cũng có thể sử dụng dấu ngoặc đơn.
Trong một số trường hợp, khi chính giá trị thuộc tính chứa dấu ngoặc kép, cần sử dụng dấu ngoặc đơn:
<p title='John "ShotGun" Nelson'>
<p title="John 'ShotGun' Nelson"> 11. Tóm tắt
- Tất cả các yếu tố HTML có thể có các thuộc tính
- Thuộc tính
hrefcủa<a>chỉ định URL của trang mà liên kết đi đến - Thuộc tính
srccủa<img>chỉ định đường dẫn đến hình ảnh sẽ được hiển thị - Các thuộc tính
widthvàheightcủa<img>cung cấp thông tin kích thước cho hình ảnh - Thuộc tính
altcủa<img>cung cấp văn bản thay thế cho hình ảnh - Thuộc tính
styleđược sử dụng để thêm kiểu vào một thành phần, chẳng hạn như màu sắc, phông chữ, kích thước và hơn thế nữa - Thuộc tính
langcủa thẻ<html>khai báo ngôn ngữ của trang Web - Thuộc tính
titleđịnh nghĩa một số thông tin bổ sung về một yếu tố
Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:
Chào thân ái và quyết thắng!
