css3

Thư viện Bootstrap đã quá quen thuộc với các bạn thiết kế giao diện website và Bootstrap cũng là một trong các thư viện CSS được sử dụng nhiều nhất hiện nay. Với sự phổ biến cũng như sức mạnh của mình, Bootstrap nhận được sự qua tâm, đóng góp của nhiều lập trình viên bằng các thư viện mở rộng hỗ...

Tôi đã giới thiệu với các bạn thư viện tạo hiệu ứng hover Direction Reveal ở bài viết "Tạo hiệu ứng hover nội dung với thư viện Direction Reveal", bài viết này tôi tiếp tục giới thiệu với các bạn thư viện khác đó là Mocassin.css. Thư viện Mocassin.css cung cấp rất nhiều hiệu ứng đẹp được phân...

Trên một website sẽ có rất nhiều hiệu ứng được tạo ra bởi CSS và JavaScript, trong đó hiệu ứng hover có lẽ là hiệu ứng được sử dụng nhiều nhất. Các bạn sẽ thấy hiệu ứng hover lên các liên kết, văn bản, hình ảnh hay một khối nội dung. Bài viết này tôi giới thiệu với các bạn thư viện Direction...

Hiệu ứng loading hiện nay rất hay được sử dụng trên các website, mục đích chính của nó là thông báo cho người dùng biết tiến trình đang được xử lý và khuyên người dùng chờ đợi. Ngoài ra, hiệu ứng loading còn giúp cho website trở nên đẹp hơn, chuyên nghiệp hơn, giúp website tương tác tốt với...

Hiệu ứng CSS shadow thường được sử dụng để thiết kế làm nổi các thành phần trên website. Việc thiết kế hiệu ứng shadow thật sự rất đơn giản chỉ với vài dòng lệnh CSS3. Tuy nhiên, nếu các bạn muốn công việc của mình trở nên đơn giản và nhanh chóng hơn nữa thì việc sử dụng một thư viện khác là lựa...

Nếu các bạn thiết kế website thì chắc chắn các hiệu ứng chuyển động hoạt hình thường xuyên được sử dụng để làm phong phú cũng như làm nổi bật các nội dung của website. Việc thiết kế các hiệu ứng chuyển động hoạt hình có thể được thiết kế bằng CSS hoặc JavaScript, mỗi cách thức đều có ưu và nhược...

Nếu các bạn muốn tạo hiệu ứng màu nền chuyển sắc kiểu linear gradient bằng CSS3 thì các bạn có thể tham khảo thư viện CSS3 WebGradients tại địa chỉ https://webgradients.com. Hiện tại WebGradients cung cấp rất nhiều mẫu CSS thiết kế linear gradient rất đẹp, các bạn có thể xem qua các demo rồi sao...

Button là thành phần không thể thiếu trên bất kỳ website nào, trên các website khác nhau các bạn sẽ thấy nhiều kiểu button được thiết kế khác nhau, bên cạnh đó hiệu ứng trên các button cũng là một cách nhấn mạnh vai trò quan trọng của nó. Bài viết này tôi sẽ hướng dẫn các bạn tạo hiệu ứng khi...

Tôi đã hướng dẫn các bạn tạo biểu tượng loading bằng CSS ở bài viết "Tạo biểu tượng loading đẹp mắt bằng CSS". Bài viết này tôi tiếp tục hướng dẫn các bạn tạo thêm hai biểu tượng loading khác cũng chỉ bằng vài dòng mã lệnh CSS đơn giản. Tất cả các biểu tượng loading tôi hướng dẫn ở cả hai bài...

Hiện nay có nhiều thư viện hỗ trợ việc tạo biểu tượng với hiệu ứng loading, tuy nhiên các thư viện này thường nặng nề hơn so với những gì mà nó làm được. Vì vậy, nếu các bạn có kinh nghiệm tốt về CSS thì các bạn hoàn toàn có thể tự tạo ra các biểu tượng loading chỉ bằng vài dòng mã lệnh CSS đơn...

Với sức mạnh của CSS3 các bạn có thể dễ dàng tạo ra nhiều hiệu ứng hoạt hình mà không cần phải dùng tới hình ảnh hay JavaScript. Các hiệu ứng hoạt hình như hiệu ứng loading, nhấp nháy... sẽ tạo điểm nhấn cho website, góp phần làm cho website trở nên chuyên nghiệp hơn. Bài viết này tôi giới thiệu...

Trên các website đẹp, ngoài nội dung thì hình ảnh là một phần không thể thiếu, vì vậy các hiệu ứng với hình ảnh thường được các bạn lập trình viên quan tâm. Việc tạo ra các hiệu ứng đẹp cho hình ảnh giúp cho website trở nên chuyên nghiệp hơn. Hiện nay có rất nhiều cách để tạo hiệu ứng cho hình...

Hiện tại CSS đã có phiên bản 4 nhưng chưa chính thức, phiên bản CSS được sử dụng nhiều nhất hiện nay vẫn là CSS 2. Tuy nhiên, với sự phát triển của công nghệ web hiện nay, CSS 3 đang dần trở nên chiếm lĩnh thị phần và sắp tới sẽ là phiên bản CSS 4. Tuy nhiên, với số lượng các quy tắc mà CSS cung...

Hiện nay có nhiều CSS framework giúp các bạn lập trình viên front-end thiết kế giao diện một cách nhanh chóng. Trong các CSS framework đó luôn luôn có một thành phần quan trọng đó là các lưới (Grid) dùng để trình bày bố cục website. Thành phần này được xem là quan trọng bởi bất kỳ website nào...

Mặc định các trình duyệt khác nhau tạo ra một kiểu dáng form khác nhau và thật sự là không được đẹp. Nếu các bạn muốn tạo ra một form có kiểu dáng đồng nhất trên mọi trình duyệt từ máy tính, máy tính bảng cho tới điện thoại di động thì các bạn có thể viết CSS tuỳ chỉnh. Tuy nhiên, các bạn có thể...

Khi truy cập website các bạn sẽ cần một khoảng thời gian nhỏ để trang web hiển thị toàn bộ nội dung trên trình duyệt, trong khoảng thời gian chờ đợi này nhiều website thiết kế các biểu tượng chuyển động hoạt hình vừa giúp người dùng biết tình trạng tải trang cũng như tạo cảm giác mọi thứ đều...

Nếu các bạn đang cần tìm một thư viện CSS trình diễn các hiệu ứng hoạt hình chuyên nghiệp thì có lẽ các bạn không thể bỏ qua thư viện WickedCSS Animations. Đây là bộ thư viện được viết hoàn toàn bằng CSS với rất nhiều hiệu ứng đẹp mắt. Các chuyển động hoạt hình đều rất mượt, tạo cảm giác tự...

Với sự hỗ trợ mạnh mẽ CSS3 của các trình duyệt web hiện nay, các bạn hoàn toàn có thể tạo ra nhiều hiệu ứng hoạt hình đẹp mắt. Một trong số các hiệu ứng hoạt hình thường được sử dụng trên website đó chính là loading. Hiệu ứng loading được tạo ra với mục đích báo hiệu cho người dùng biết tiến...

Trong chuyên mục HTML & CSS tôi đã giới thiệu với các bạn nhiều thư viện dùng để thiết kế giao diện website như UIkit, Flexgrid, Ratchet và gần đây nhất là Bulma. Tất cả các thư viện này đều cùng một mục đích là cung cấp cho các bạn thiết kế giao diện nhiều thành phần xây dựng sẵn để các bạn có...

Bulma là một CSS framework mã nguồn mở miễn phí rất tốt để thiết kế giao diện website, giúp các bạn tiết kiệm thời gian, công sức. Với lợi thế đó, Bulma ngày càng trở nên phổ biến và được sử dụng rộng rãi hơn. Bulma chứa các thành phần tuyệt vời như tab, navigation bar, box, panel... Framework...