Tạo tùy chỉnh Thread Prefix Css

[PVS]

Tạo tùy chỉnh Thread Prefix Css

Các code sau đây nên được thêm vào EXTRA.css

Trong ví dụ dưới đây, chúng ta sẽ tạo ra hai lớp; CTA1 và CTA2.
Tất nhiên bạn có thể chọn bất cứ lớp tên gì bạn thích.

.prefix.prefixCTA1 {

color: @textCtrlBackground;

background-color: @primaryDarker;

border-color: @primaryDark;

}

    a.prefixLink:hover .prefix.prefixCTA1 {

    color: red;

    background-color: yellow;

    border-color: blue;

    }


.prefix.prefixCTA2 {

color: @textCtrlBackground;

background-color: @primaryLightish;

border-color: @primaryMedium;

}

    a.prefixLink:hover .prefix.prefixCTA2 {

    color: black;

    background-color: white;

    border-color: red;

    }

Như bạn có thể thấy, CSS là khá cơ bản chỉ bao gồm các văn bản, nền và border màu sắc.
Bạn có thể thêm bất cứ điều gì cho phong cách bạn thích.

Mỗi lớp cũng có CSS cho hover, vì vậy tiền tố cá nhân có thể có hiệu ứng chuyển động khác nhau. Một lần nữa, các CSS có thể được mở rộng cho phù hợp.

Một khi bạn đã tạo ra CSS của bạn, chỉ cần chọn khác, bằng cách sử dụng tùy chọn tùy chỉnh CSS tên lớp cho các tiền tố trong câu hỏi, và nhập nó như sau: prefix prefixCTA1
Lưu ý rằng không có "." trước tên lớp và chúng được ngăn cách bởi một khoảng trắng.

Nếu bạn có nhiều styles cài đặt, bạn sẽ cần phải thêm code vào EXTRA.css cho mỗi styles.
Nó không phải là giống nhau, bạn có thể thay đổi nó cho phù hợp với từng styles.

Chúc các bạn thành công.

Nguồn: vnnet.org​