Inline CSS: Gán attribute style trực tiếp lên element HTML. Style chỉ áp dụng cho element đó.
Cú pháp
<element style="property: value; property: value;">
Ví dụ
<html>
<head></head>
<body>
<h2 style="color: #800000;">This is inline CSS</h2>
<p style="font-size: 14px; color: #333; line-height: 1.5;">Paragraph with inline styles.</p>
</body>
</html>
Thuộc tính style
| Attribute | Value | Mô tả |
|---|
style | Style rules | Chuỗi các cặp property: value phân cách bằng ;. |
Ưu/nhược điểm
| Ưu điểm | Nhược điểm |
|---|
| Ưu tiên cao nhất (specificity 1000) | Lặp code, khó bảo trì |
| Override dễ dàng external/embedded | Không tái sử dụng |
| Hữu ích cho dynamic style (JS set style) | Làm HTML rối, tách biệt cấu trúc/trình bày kém |
| Email HTML (client strip <style>) | Không cache, tăng kích thước HTML |
Khuyến nghị
- Chỉ dùng cho: Email HTML, style động qua JS (
el.style.color = 'red'), override nhanh khi debug.
- KHÔNG dùng cho style chung, layout, theme.
