CSS

Tailwind CSS Transform

Lớp này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả thuộc tính đều được bao phủ dưới dạng class. Class này dùng để điều khiển hành vi transform của một phần tử. Trong CSS, chúng ta có thể làm điều đó bằng CSS transform property. Transform Classes: transform:...


Tailwind CSS Transition Timing Function

Lớp này chấp nhận nhiều giá trị trong tailwind CSS, nơi tất cả thuộc tính được bao phủ dưới dạng class. Class transition timing function được dùng chỉ định thời gian hiệu ứng chuyển đổi CSS. Trong CSS, chúng ta thực hiện điều đó bằng cách sử dụng CSS transition-timing-function.Các...


Tailwind CSS Transition Property

Lớp này chấp nhận nhiều giá trị trong tailwind CSS, tất cả thuộc tính được bao phủ dưới dạng lớp. Lớp transition-property được dùng để chỉ định tên thuộc tính CSS cho hiệu ứng chuyển đổi. Trong CSS, ta thực hiện việc đó bằng CSS transition-property. Các lớp Transition Property:...


Tailwind CSS Grid Auto Rows

Lớp này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả các thuộc tính được đề cập ở dạng lớp. Nó là một giải pháp thay thế cho thuộc tính CSS grid-auto-rows. Lớp này dùng để chỉ định kích thước cho các hàng của vùng chứa lưới được tạo...


Tailwind CSS Grid Auto Columns

Lớp này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả thuộc tính được bao phủ dưới dạng lớp. Nó là một lựa chọn thay thế cho thuộc tính CSS grid-auto-columns property. Lớp này dùng để chỉ định kích thước cho các cột của vùng chứa lưới được tạo...


Tailwind CSS Filter

Lớp filter được dùng để thiết lập hiệu ứng hình ảnh cho một phần tử. Lớp này thường được dùng cho nội dung hình ảnh. Trong CSS, ta dùng CSS filter property. Tailwind CSS đã thêm tính năng filter mới trong phiên bản 2.1. Các lớp Filter: filter: Lớp này...


Tailwind CSS Background Attachment

Trong bài viết này, chúng ta sẽ tìm hiểu cách đính kèm ảnh nền bằngTailwind CSS. Cách tiếp cận: Bạn có thể dễ dàng đính kèm ảnh nền bằng cách sử dụng background-attachment property trong Tailwind CSS. Tất cả thuộc tính đều được trình bày dưới dạng class. Nó là...


Tailwind CSS Container

The Tailwind CSS class container được dùng để giới hạn chiều rộng nội dung. Nó cũng đảm bảo bố cục responsive và căn giữa. Centers Content: Tự động căn giữa nội dung theo chiều ngang trong khung nhìn (viewport). Responsive Widths: Đặt chiều rộng tối đa tại các breakpoint khác...


Tailwind CSS Z-index

tailwind CSS là một framework CSS cung cấp các class quản lý nội dung HTML. tailwind CSS giúp việc thiết kế dễ dàng hơn và responsive trên nhiều nền tảng. Tiện ích z-Index dùng để kiểm soát thứ tự xếp chồng của một phần tử. Nó là một giải pháp...


Tailwind CSS Top/Right/Bottom/Left

Các class này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả thuộc tính được trình bày dưới dạng class. Chúng là các lựa chọn thay thế cho thuộc tính CSS Top/Right/Bottom/Left. Các class này dùng để điều khiển căn chỉnh cho phần tử định vị. Lưu ý bạn...


Tailwind CSS Stroke

Lớp này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả các thuộc tính đều được trình bày dưới dạng class. Đây là class stroke được áp dụng cho phần tử SVG. Trong CSS, ta sử dụng Stroke Property. Stroke Classes (Các class Stroke): stroke-current: Class này dùng để...


Tailwind CSS Stroke Width

Lớp này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả các thuộc tính được đề cập ở dạng form. Lớp này được sử dụng để thiết lập độ rộng đường viền trong hình dạng SVG. Thuộc tính này chỉ có thể áp dụng cho các phần tử có...


Tailwind CSS Translate

Lớp này chấp nhận nhiều giá trị trong tailwind CSS, tất cả thuộc tính được bao phủ dưới dạng lớp. Lớp này được dùng để dịch các phần tử bằng thuộc tính transform. Trong CSS, chúng ta thực hiện điều đó bằng CSS translate() function. Các lớp Translate: translate-x-{amount}: Lớp...


Tailwind CSS Gradient Color Stops

Lớp này chấp nhận nhiều giá trị trong tailwind CSS. Tất cả thuộc tính được bao phủ như ở dạng lớp. Nó là một lựa chọn thay thế cho CSS Gradients property. Gradient Color Stops classes (Các lớp điểm dừng màu Gradient): from-transparent: Lớp này được sử dụng để đặt...


Tailwind CSS Backdrop Hue Rotate

Lớp backdrop hue rotate là một hàm dựng sẵn để áp dụng bộ lọc cho ảnh. Nó dùng để đặt hue rotation cho ảnh. Tailwind CSS đã thêm tính năng brightness mới này trong phiên bản 2.1. Backdrop Hue Rotate: -backdrop-hue-rotate-180: Lớp này được dùng để đặt giá trị hue-rotate...


Tailwind CSS Backdrop Grayscale

Lớp Backdrop Grayscale dùng để áp bộ lọc biến ảnh thành ảnh xám. Tailwind CSS mới thêm tính năng brightness trong phiên bản 2.1. Backdrop Grayscale: backdrop-grayscale-0: Lớp này thể hiện phần tử gốc ban đầu.backdrop-grayscale: Lớp này thể hiện hệ số nhân tuyến tính lên hiệu ứng của các...


Tailwind CSS Backdrop Contrast

Lớp Backdrop Contrast dùng để điều chỉnh độ tương phản của ảnh. Lớp này có thể tăng hoặc giảm độ tương phản cho ảnh. Tailwind CSS đã thêm tính năng brightness mới trong phiên bản 2.1. Backdrop Contrast: backdrop-contrast-0: Lớp này dùng để đặt độ tương phản của một phần...


Tailwind CSS Backdrop Brightness

Lớp backdrop brightness được dùng để đặt độ sáng cho ảnh. Lớp này dùng hệ số tuyến tính để tăng giảm độ sáng ảnh. Tailwind CSS đã thêm tính năng brightness mới trong phiên bản 2.1. Các lớp Backdrop Brightness: backdrop-brightness-0: Lớp này đặt độ sáng cho phần tử, tương...


Tailwind CSS Backdrop Blur

Các class backdrop blur được dùng để áp dụng hiệu ứng làm mờ cho một phần tử. Tailwind CSS đã thêm tính năng blur mới này trong phiên bản 2.1. Các Class Backdrop Blur: backdrop-blur-0: Class này tương đương với việc không làm mờ phần tử blur(0) trong CSS.backdrop-blur-sm: Class...


Tailwind CSS Backdrop Filter

Tailwind CSS backdrop filter cho phép dùng hiệu ứng lên phần nền phía sau. Nó hoạt động ngược lại so với class filter thông thường trong CSS. Với class filter, ta cần dùng filter trước khi dùng hiệu ứng như blur. Để tắt hiệu ứng, dùng backdrop-blur hoặc backdrop-contrast với...