Tạo Button Tooltips bằng CSS3
Hôm nay mình sẽ chia sẻ cho các bạn một dạng nút bấm (button) rất đẹp với hiệu ứng tooltips cực cool. Chúng ta sẻ chỉ sử dụng CSS3 mà không cần phải dùng bất kì đoạn script hay bất cứ một ảnh động nào. Xem Demo | Download HTML Sau đây là bộ khung html mà chúng ta cần có để tạo ...
CSS3 Logo : Colorvivo
Hôm nay tâm trạng mình thật sự là phấn kích sau khi nhận được thư mời phỏng vấn từ lãnh sự quán Hoa Kỳ . Trong tâm trang đó, mình xin chia sẻ cho các bạn một logo đầy màu sắc được làm từ CSS3, đó là logo Colorvivo. Qua bài viết này, các bạn sẽ có thể tận dụng thuộc tính transform để sắp xếp các ...
Tạo CSS Animations với Move.js
Hiện nay, CSS3 transitions và animations là những cách tạo hiệu ứng nhẹ mà đẹp được dùng nhiều nhất . Tuy nhiên, không phải ai cũng có thể hiểu rõ và sử dụng chúng thật hiệu quả. Nếu các bạn cũng đang gặp rắc rối với cách sử dụng chúng thì mình xin giới thiệu cho các bạn một giải pháp thay thế , đó ...
Tổng hợp hiệu ứng vòng tròn với CSS3 Transitions
Ngày hôm nay mình sẽ chia sẻ cho các bạn những hiệu ứng vòng tròn (Circle Hover Effects) với CSS transitions và 3D rotations. Bảo đảm là với những hiệu ứng này, các bạn có thể áp dụng vào chính trang web hay blog của mình, và nếu các bạn muốn nâng cao hơn về khả năng sử dụng CSS3 thì bài viết này ...
Forrst logo bằng CSS3
Hôm nay mình sẽ cùng với các bạn tạo logo forrst chỉ bằng CSS3 thuần (không sử dụng hình ảnh). Chìa khóa chính cho việc tạo logo này đó là các hình tam giác và hiệu ứng bóng đổ đều sử dụng thuộc tính borders. Và qua bài viết này mình chắc chắn là các bạn sẽ có thể hiểu và sử dụng tốt thuộc tính ...
Ấn tượng với CSS3 border transition effects
Hôm nay , mình sẽ chia sẻ cho các bạn một vài hiệu ứng tuyệt đẹp với Border Transitions. Qua bài viết này, các bạn có thể học hỏi thêm một vài kinh nghiệm trong việc sử dụng những thuộc tính căn bản của CSS3 và hơn hết là có thể áp dụng những hiệu ứng này vào trong các trang web hay blog của các ...
Thiết kế hình đám mây đơn giản bằng CSS3
Có lẽ khi đọc tiêu đề, sẽ có nhiều bạn lầm tưởng mình đã post lộn chủ đề. Bởi vì từ trước đến nay việc thiết kế những hình ảnh như thế này chỉ dành cho những phần mềm tạo ảnh chuyên nghiệp như Photoshop hay những phần mềm tạo ảnh khác, chứ định dạng bằng CSS thì làm sao có thể được. Xem ...
Tỉ mỉ với logo Apple được làm từ CSS3
Với logo Apple thì có lẽ là chúng ta đã quá quen thuộc rồi, và sẽ rất đơn giản nếu như chúng ta dùng các phầm mềm như Photoshop để tạo logo này. Thế còn CSS3 thì sao ? Có lẽ đến bây giờ thì mình có thể quả quyết là với các thuộc tính CSS3 mang lại, chúng ta có thể vẽ nhiều hơn chúng ta tưởng về ...
Tạo Lightbox từ CSS3
Hôm nay mình sẽ chia sẻ cho các bạn một hiệu ứng lightbox cực kỳ ấn tượng và rất đẹp mắt chỉ bằng CSS. Ý tưởng ở đây là tạo một ảnh thumbnail và ảnh lớn cùng một lúc (ảnh này sẽ bị ẩn đi). Và khi chúng ta click vào ảnh thumbnail thì ảnh lớn sẽ được xuất hiện cùng với hiệu ứng cực cool nhờ vào các ...
Tạo 3D Animating Sidebar với CSS3
Hôm nay, tình cờ ghé thăm một blog nước ngoài và mình bị ấn tượng ngay với một hiệu ứng động trên sidebar của blog đó. Và ngay lập tức mình nghĩ ngay tới việc chia sẻ nó cho các bạn, với hiệu ứng này các bạn có thể áp dụng vào ngay cho website hay blog của mình. Xem Demo | Download HTML ...
Thiết kế hiệu ứng đẹp cho checkbox bằng CSS3 và iconfonts
Việc thiết kế web chẳng hề đơn giản chút nào, nhất là với khi chúng ta đã thiết kế rất nhiều kiểu khác nhau, và dần dần, chúng càng trở nên đơn điệu và không có gì là mới mẻ.Nếu các bạn đã cảm thấy nhàm chán với những hình vuông đơn giản mặc đinh và không có gì đẹp mắt của các ô checkbox. Thì qua ...
CSS3 image slider với định dạng thumbnails
Image Slider luôn luôn là một trong những chức năng cần có trong một website. Ngoài việc làm cho giao diện web đẹp và sinh động hơn, thì những hình ảnh sẽ là cách tuyệt vời nhất trong việc chuyển tải thông điệp của website đến cho khách viếng thăm. Xem Demo | Download Trong bài viết ...
Pure CSS Badges
Badge là một trong thành phần gần như không thể thiếu trong bất kỳ một Website thiết kế theo phong cách 2.0 nào. Cho dù kích thước của nó có to hay nhỏ nhưng chúng đều tạo ra một phong cách khá riêng biệt. Có rất nhiều các loại badge được thiết kế theo các hình dạng khác nhau, nhưng chúng đều mang ...
Single input 3D form với CSS3 và jQuery
Hôm nay mình sẽ chia sẻ cho các bạn một mẫu form nhập liệu đơn với hiệu ứng 3D đẹp mắt và đầy ấn tượng chỉ với bằng CSS3 và jQuery. Mẫu form này rất thích hợp cho việc tạo các form Subscribe. Xem Demo | Download HTML Đầu tiên chúng ta cần có bộ khung chuẩn html như sau : <div ...
Làm đẹp Select Box (Dropdown Lists) Với 2 màu đen, trắng bằng CSS
Để có thể thiết kế web đẹp, ngoài việc sử dụng những mẫu có sẵn, thì đôi lúc chúng ta cũng cần phải tự tay tùy biến những phần tử html đẹp hơn so với hình ảnh mặc định của nó. Trong bài viết này, mình sẽ chia sẻ cho các bạn 2 định dạng css cho các phần tử select box với 2 màu đen trắng, đơn giản ...
Animated Download Button Với CSS3
Chào các bạn, hôm nay mình sẽ chia sẻ cho các bạn một button cực kỳ thú vị với những hiệu ứng mà có lẽ các bạn có thể không bao giờ nghĩ là nó lại được làm chỉ bằng CSS3. Button của chúng ta sẽ sử dụng những thuộc tính như border-radius, box-shadow, linear-gradients, z-index và transitions. ...
Tạo hiệu ứng Fade-in, Fade-out trên chữ với CSS3 Animation
Chào các bạn, hôm nay mình sẽ chỉ cho các bạn cách làm một hiệu ứng fade in và fade out trên chữ với CSS3 Animation. Hiệu ứng này rất đơn giản và dễ thực hiện, chỉ với việc dùng @keyframe cho 7 kí tự với thời gian khác nhau. Qua bài viết này, chắc chắn các bạn sẽ có thêm kinh nghiệm trong ...
Tạo menu theo phong cách thiết kế phẳng (Flat) bằng CSS3
Chắc hẳn các bạn đã đọc qua bài viết 20 mẫu themes Flat design tuyệt vời nhất dành cho WordPress dành riêng cho những bạn đang dùng WordPress. Thì mình đoán là cũng sẽ có nhiều bạn muốn tự tay thiết kế riêng cho mình những giao diện Flat của riêng mình. Với bài viết này,mình sẽ mang đến cho các ...
10 thủ thuật css cần phải biết cho người bắt đầu
Nếu bạn mới bắt đầu tìm hiểu về thiết kế web, thì việc nắm vững CSS là một trong những điều mà bạn cần phải làm. Học CSS không khó, nhưng học như thế nào để có hiệu quả và không tốn quá nhiều thời gian thì không phải dễ chút nào. Nhất là khi có hàng trăm thuộc tính cũng như kỹ thuật mà bạn cần phải ...
Ấn tượng với Pricing Table làm từ CSS3
Pricing Table thường được dùng để giới thiệu những gói dịch vụ mà trong các trang web chuyên về hosting hay sử dụng. Hôm nay mình xin chia sẻ cho các bạn một mẫu pricing table rất đẹp và được làm bằng CSS3 gadient cùng với những thuộc tính khác như box-shadow và transform(scale). Xem Demo ...
