CSS-only Game: Tic-Tac-Toe
01/11/2025
0
21
11 phút đọc
Demo
Một phiên bản Tic-Tac-Toe được xây dựng hoàn toàn bằng CSS hiện đại. Trò chơi khai thác trạng thái biểu mẫu và bộ chọn quan hệ để hiển thị X/O, phát hiện các tổ hợp...
HTML & CSS
Tổng hợp kiến thức HTML, CSS từ cơ bản đến nâng cao: cấu trúc trang, định dạng, responsive layout, snippet hữu ích và mẹo tùy biến giao diện.
Hướng dẫn tạo Mini Toast Notification System bằng HTML, CSS và JavaScript
27/10/2025
0
225
7 phút đọc
Demo
Mini Toast Notification System là một hệ thống thông báo nhỏ gọn xuất hiện trong một khoảng thời gian ngắn ở góc màn hình. Thông báo dạng toast thường được dùng để báo kết quả...
Form validation với HTML5 — không cần JavaScript
26/10/2025
0
45
7 phút đọc
Bạn có thể xây dựng kiểm tra dữ liệu đầu vào (validation) mạnh mẽ chỉ với HTML5, không cần viết một dòng JavaScript nào. Bài này hướng dẫn cách dùng đúng các thuộc tính và...
Hướng dẫn tạo Floating Action Button (FAB) kiểu Android với menu mở rộng
23/10/2025
0
42
3 phút đọc
Demo
Floating Action Button (FAB) dạng mở rộng là một thành phần giao diện hiện đại, cho phép người dùng truy cập nhanh nhiều chức năng chỉ với một nút nổi duy nhất. FAB sẽ nằm...
Hình ảnh nhanh và mượt với loading=”lazy” và decoding=”async”
20/10/2025
0
126
5 phút đọc
Hai thuộc tính loading="lazy" và decoding="async" giúp tối ưu tốc độ tải và khả năng tương tác khi hiển thị ảnh. Bài viết này giải thích cách hoạt động, khi nào nên dùng, những lưu...
Semantic HTML là gì và tại sao quan trọng?
17/10/2025
0
66
6 phút đọc
Semantic HTML (HTML ngữ nghĩa) là cách viết HTML dùng đúng thẻ để thể hiện đúng ý nghĩa nội dung. Thay vì chỉ tập trung vào hiển thị, ta mô tả rõ ràng vai trò...
Accessibility (a11y) cơ bản mọi developer nên biết
11/10/2025
0
42
6 phút đọc
Accessibility (truy cập số) giúp mọi người — bao gồm người khuyết tật, người dùng di động, mạng chậm, thiết bị cũ — đều sử dụng được website. Bài viết này tóm tắt khái niệm,...
CSS Animation vs JavaScript Animation: Chọn bên nào cho hiệu năng cao nhất
08/10/2025
0
63
7 phút đọc
Hiệu ứng chuyển động là yếu tố không thể thiếu trong thiết kế web hiện đại. Tuy nhiên, không phải mọi animation đều được tạo ra như nhau. Một số được triển khai bằng CSS,...
Critical CSS – Tải trang nhanh hơn 2 giây
08/10/2025
0
48
12 phút đọc
Bạn có bao giờ truy cập một website và phải chờ đợi màn hình trắng xóa vài giây trước khi nội dung hiển thị? Đó chính là dấu hiệu của việc CSS chưa được tối...
CSS BEM naming convention cho người mới
02/10/2025
0
28
4 phút đọc
BEM (Block – Element – Modifier) là một quy tắc đặt tên class trong CSS giúp code rõ ràng, dễ đọc và dễ mở rộng. Với BEM, bạn có thể quản lý style cho các...
Hiệu ứng trên web và tác động đến hiệu năng thiết bị
02/10/2025
0
118
7 phút đọc
Hiệu ứng hình ảnh trên trang web là yếu tố quan trọng trong việc tạo trải nghiệm trực quan hấp dẫn cho người dùng. Tuy nhiên, nếu lạm dụng hoặc triển khai không đúng cách,...
Tại sao HTML5 “picture” và “source” là chìa khóa để tối ưu responsive image
26/09/2025
0
39
4 phút đọc
Trong thiết kế web hiện đại, hình ảnh chiếm phần lớn dung lượng tải trang. Nếu không tối ưu, chúng có thể khiến website chậm chạp, ảnh hưởng trực tiếp đến trải nghiệm người dùng...
Closure trong JavaScript: Đơn giản hơn bạn nghĩ
26/09/2025
0
18
6 phút đọc
Closure nghe có vẻ hàn lâm, nhưng thực chất chỉ là khả năng một hàm “nhớ” môi trường nơi nó được tạo ra. Nhờ đó, bạn có thể giữ trạng thái riêng tư, viết API...
CSS Houdini: Khi dev có thể hack vào engine của trình duyệt
24/09/2025
0
18
4 phút đọc
Trong nhiều năm, CSS thường bị coi là “ngôn ngữ trang điểm” – mạnh nhưng giới hạn. Nếu trình duyệt không hỗ trợ thuộc tính nào đó, lập trình viên gần như bó tay hoặc...
CSS Color Level 4: Tận dụng màu sắc hiện đại (lab, lch, color-mix)
23/09/2025
0
48
4 phút đọc
Demo
Trước đây, CSS chỉ xoay quanh các hệ màu quen thuộc như HEX, RGB hay HSL. Chúng đủ dùng nhưng thiếu độ chính xác về màu sắc, nhất là khi hiển thị trên màn hình...
Has() selector: CSS giờ đã có parent selector
22/09/2025
0
18
4 phút đọc
:has() là relational pseudo-class cho phép chọn một phần tử dựa trên những gì nó chứa hoặc đứng kề. Nói nôm na, đây là “parent selector” mà cộng đồng chờ đợi nhiều năm: bạn có...
CSS Nesting chính thức: Viết CSS gọn như SCSS mà không cần preprocessor
21/09/2025
0
12
3 phút đọc
Trong nhiều năm, lập trình viên front-end phải dựa vào SCSS, LESS hoặc PostCSS để viết CSS theo dạng “lồng” (nesting). Điều này giúp code gọn, dễ đọc và quản lý component rõ ràng hơn....
Modern Object Cache trong WordPress: Redis Cluster, Relay & APCu Hybrid
13/09/2025
0
87
4 phút đọc
Object Cache là một trong những kỹ thuật tăng tốc WordPress quan trọng nhất. Thay vì query MySQL lặp đi lặp lại, WordPress có thể lưu kết quả trong bộ nhớ (Redis, Memcached, APCu…) và...
Glassmorphism Card bằng CSS và UIkit: Trong suốt, mờ nền và nổi bật nội dung
13/09/2025
0
250
5 phút đọc
Demo
Glassmorphism tạo cảm giác mặt kính: nền mờ, bề mặt trong suốt và viền sáng nhẹ. Phong cách này giúp nội dung nổi bật trên ảnh nền hoặc gradient mà vẫn giữ được độ sang...
Floating Label Form với UIkit: Label bay lên khi nhập, gọn đẹp và dễ đọc
13/09/2025
0
27
4 phút đọc
Demo
Floating Label giúp trường nhập liệu gọn gàng: nhãn nằm trong ô khi trống và trượt lên phía trên khi người dùng nhập. Kỹ thuật này cải thiện khả năng quét thông tin, tiết kiệm...