CSS là gì và 3 cách viết CSS?

CSS (Cascading Style Sheets) định nghĩa giao diện của trang web — màu sắc, font chữ, khoảng cách, bố cục. Có 3 cách viết CSS:

  1. External CSS: File .css riêng biệt, được link vào trang
  2. Internal CSS: Viết trong thẻ <style> trong phần <head>
  3. Inline CSS: Viết trực tiếp vào thuộc tính style="" của từng thẻ HTML

Tại sao CMS Việt Nam lọc bỏ <style> tags?

Haravan, Sapo, WordPress và các CMS thương mại đều có bộ lọc HTML chống XSS (Cross-Site Scripting). Bộ lọc này:

  • Xóa thẻ <script> để ngăn mã độc
  • Xóa thẻ <style> để tránh CSS của block ảnh hưởng toàn trang
  • Lọc nhiều thuộc tính HTML có thể chứa JavaScript

Kết quả: nếu bạn copy HTML có <style>...</style> và dán vào CMS, toàn bộ CSS đó bị xóa hoàn toàn, block hiển thị mất định dạng.

Inline CSS giải quyết vấn đề này như thế nào?

Khi CSS được viết trực tiếp vào thuộc tính style="" của từng thẻ, CMS không thể xóa nó mà không phá vỡ HTML. Ví dụ:

<!-- ❌ Sẽ bị CMS xóa CSS -->
<style>.banner { background: #4338ca; color: white; }</style>
<div class="banner">Nội dung</div>

<!-- ✓ An toàn với mọi CMS -->
<div style="background:#4338ca;color:white;padding:24px">Nội dung</div>

Nhược điểm của inline CSS và cách AITaoPage xử lý

Inline CSS có một nhược điểm: code rất dài và khó viết tay. Thay vì viết class="hero-banner", bạn phải viết toàn bộ style vào từng thẻ.

AITaoPage giải quyết điều này bằng engine tự động:

  1. AI tạo HTML với class và style sheet bình thường
  2. Engine "juice" đọc CSS và nhúng vào từng thẻ HTML tương ứng
  3. Output cuối cùng là HTML "sạch" — chỉ có style="", không có class hay script

Toàn bộ quá trình xảy ra tự động khi bạn nhấn "Sao chép HTML".

Kết luận

HTML inline CSS là chuẩn bắt buộc khi làm việc với CMS thương mại tại Việt Nam. Thay vì học kỹ thuật phức tạp này, hãy để AITaoPage xử lý tự động — bạn chỉ cần dán HTML vào CMS và nó hoạt động hoàn hảo ngay lập tức.