Tìm hiểu về CSS Gradient (Phần 1)

Chào các bạn! Bài viết hôm nay mình xin phép đi sâu vào vấn đề tìm hiểu CSS gradient. Cụm từ gradient này chắc cũng không lạ lẫm gì với các bạn nữa. Khi sử dụng gradient, bạn sẽ thấy được sự mượt mà khi giao thoa của 2 hoặc nhiều màu sắc. Lấy ví......

Tìm hiểu nhanh về CSS3 Animation

Chào các bạn! Với mức độ phổ biến của CSS3 hiện nay thì việc sử dụng Animation sẽ không còn gì xa lạ nữa. Tuy nhiên để biết chi tiết từng giá trị và vận dụng chúng thì chắc ít người đi tìm hiểu. Ngay cả bản thân mình khi sử dụng animation thì cũng......

Chỉnh sửa css trên các browser bằng Media Query, không cần thông qua javascript

Chào các bạn! Đọc tiêu đề bài viết này chắc các bạn cũng hiểu luôn nội dung của bài viết này là sẽ viết về cái gì rồi nhỉ. Có lẽ bất kỳ ai là 1 developer sẽ không ít lần đau đầu với việc fix bug css trên các browser khác nhau nhỉ? Thực......

Xử lý text trong CSS như thế nào?

Chào các bạn! Đã bao giờ các bạn đau đầu trong việc xử lý text dài ngắn hay không? Chẳng hạn có một số trường hợp như thế này: Text nó cứ kéo dài mãi, bị tràn sang cả khu vực khác, muốn nó tự nhảy xuống dòng mà không được? Muốn ẩn bớt text......

20 CSS Javascript Price Range Slider Examples

Chào các bạn! Cái tên price range slider như không còn xa lạ gì với các bạn nữa rồi nhỉ. Gần như lúc nào price range slider cũng xuất hiện trong các site ecommerce giúp người dùng có thể thuận lợi tìm kiếm sản phẩm cho mình với mức giá phù hợp với túi tiền......

15 demo CSS tuyệt đẹp cho Pagination

Chào các bạn! Pagination không còn là điều gì xa lạ với các bạn nữa. Bất cứ 1 website nào cũng có sự hiện diện pagination. Tuy nhiên, xét về thực tế mình thấy style của pagination đang sử dụng khá đơn giản: tròn hoặc vuông hoặc không có background, border luôn. Các bạn có......

Tìm hiểu và vận dụng pseudo (pseudo-element) trong css – phần 2

Chào các bạn! Trong bài trước mình đã giới thiệu với các bạn về định nghĩa, cách sử dụng cũng như 1 vài loại pseudo-classes hay dùng nhất. Bài này mình sẽ giới thiệu về pseudo-elements trong css. 1. Định nghĩa và cấu trúc của pseudo-element Pseudo-element trong CSS được dùng để định dạng một......

Tìm hiểu và vận dụng pseudo (pseudo-class) trong css – phần 1

Chào các bạn! Nhìn tiêu đề bài viết có lẽ sẽ có khá nhiều bạn thắc mắc về khái niệm pseudo trong css. Nó là cái gì? Mình đã từng sử dụng nó hay chưa? Nó được sử dụng như thế nào? Bài viết này sẽ giải thích qua về khái niệm cho các bạn......

Parallax – Hoàn thiện bố cục, hiệu ứng và mở rộng

Các bạn thân mến, như vậy là chúng ta đã đi đến cuối chặng đường của loạt bài viết về hiệu ứng parallax này. Hôm nay, freetuts sẽ tổng kết lại những gì các bạn đã học được và những phần mở rộng. Nào chúng ta hãy cùng bắt đầu.

...

Parallax – Tạo trang đầu và cuối

Trong phần này, freetuts sẽ hướng dẫn các bạn tạo trang mở đầu và trang kết thúc của web với hiệu ứng parallax. Sau bài viết này, các bạn sẽ đạt được kết quả như phần demo. Nào chúng ta cùng bắt đầu.

...

Parallax – Chèn nhạc nền theo chuyển động cuộn

Trong bài viết hôm này, freetuts sẽ hướng dẫn các bạn chèn nhạc nền vào trang web cùng với hiệu ứng thay đổi nhạc khi màn hình cuộn sang một trang khác. Đây là sự kết hợp thường thấy trong các trang web dùng hiệu ứng parallax. Nào chúng ta cùng bắt đầu.

...

Parallax – Tạo hiệu ứng cho văn bản

Trong phần này, freetuts sẽ hướng dẫn các bạn chèn văn bản vào các ảnh nền và thêm và các hiệu ứng cho chữ. Sau bài học hôm nay, các sẽ đặt được kết quả như demo. Nào chúng ta cùng bắt đầu.

...

Parallax – Tạo hiệu ứng Parallax scrolling

Chào các bạn, trong bài học này freetuts sẽ hướng dẫn các bạn tạo hiệu ứng thay đổi trên thanh menu chỉ với thao tác cuộn trong cửa sổ trình duyệt. Sau bài học hôm nay, các bạn có thể tạo được giao diện như demo. Nào ta cùng bắt đầu.

...

Parallax – Tạo thanh menu dọc

Chào các bạn, trong bài học trước chúng ta đã hoàn thành cách tạo chuỗi ảnh nền. Hôm nay, freetuts sẽ tiếp tục hướng dẫn các bạn tạo thanh menu dọc ở vị trí cố định trong khi cuộn trang web nhé. Sau khi học xong bài hôm nay, các bạn sẽ tạo được menu như demo. Nào chúng ta cùng bắt đầu.

...

Parallax – Tạo chuỗi ảnh nền

Trong bài viết này, freetuts sẽ tiếp tục hướng dẫn các bạn bài viết trong loạt bài về hiệu ứng parallax. Hôm nay, chúng ta sẽ cùng tìm hiểu về cách thức tạo chuỗi ảnh nền. Kết thúc bài học hôm nay, chúng ta sẽ tạo được chuỗi ảnh như demo. Nào hãy cùng bắt đầu.

...

Parallax – Hiệu ứng Parallax là gì?

Chào các bạn, chúng ta lại gặp nhau. Hôm nay, freetuts sẽ hướng dẫn các bạn tạo một landing page hoàn chỉnh cùng với hiệu ứng parallax. Để tiện cho việc theo dõi chuỗi bài viết này, chúng ta sẽ tìm hiểu sơ lược cũng như bố cục cơ bản trang web mà chúng ta hoàn thành sau khi kết thúc series này nhé.

...

CSS3 Emphasis Marks

Các bạn thân mến, chúng ta lại gặp nhau. Hôm nay, freetuts xin gửi đến các bạn chủ đề về "Emphasis Marks" trong CSS. Đối với trình nâng cao thì đây cũng là một chủ đề thú vị. Nào chúng ta hãy bắt đầu tìm hiểu nhé.

...

Tìm hiểu object-fit trong CSS3

Các bạn thân mến, hôm nay chúng ta lại gặp nhau. Một trang web không thể thiếu hình ảnh minh họa, việc xử lý chúng tuân theo nhưng bố cục chung cũng tạo nên vấn đề mà chúng ta cần phải giải quyết. Freetuts xin gửi đến các bạn cách xử lý hình ảnh trong những tình huống phải thay đổi lại kích thước ảnh gốc.

...

CSS3 – Hiệu ứng Animation

Các bạn thân mến, chắc hẳn rằng nhiều bạn cũng thắc mắc làm sao có thể tạo được những hiệu ứng đẹp chỉ với HTML và CSS. Hôm nay, thông qua bài học này freetuts hy vọng mang đến cho các bạn những kiến thức đầy đủ nhất.

...

Margin collapsing trong CSS

Trong CSS đôi lúc sẽ xảy ra trường hợp đặc biệt là các giá trị của thuộc tính margin chồng lấn các giá trị lên nhau. Nó sẽ lấy giá trị lớn nhất giữa hai gia trị của thuộc tính margin. Hôm nay, freetuts sẽ hướng dẫn các bạn các trường hợp đặc biệt của thuộc tính margin này.

...