Thay đổi màu của tô chọn chữ bằng CSS

Trước đây thì mình đã có một bài viết hướng dẫn cách thức bỏ chọn chữ tại website của bạn. Hôm nay thì mình xin chia sẻ với các bạn cách để thay đổi màu phần tô chữ mà chúng ta chọn. Như ai cũng biết thì khi bạn tô chọn chữ tại bất kì một trang web nào, hầu hết tất cả chúng đều sử dụng một màu duy nhất đó là xanh biển. Điều này có bao giờ làm cho bạn cảm thấy nó nhàm chán quá và muốn phá cách một tý không? Nếu có bạn hãy sử dụng đoạn CSS sau đây.

Thay đổi màu của tô chọn chữ bằng CSS

::selection {
    background: #FA4B2A;
    color: #FFF;
    }
::-moz-selection {
    background: #FA4B2A;
    color: #FFF;
}

đối với đoạn css này, bạn có thể thay đổi màu phần đã tô và cả màu của chữ đã được tô nữa, như đoạn code ở trên thì phần tô là màu đỏ và chữ sẽ là màu trắng.

Ngoài ra nếu bạn muốn áp dụng nó cho một thẻ hoặc một thuộc tính bất kì, bạn có thể sử dụng như sau:

p::selection {
    background: #FA4B2A;
    color: #FFF;
}
div.tochu::selection {
    background: #FA4B2A;
    color: #FFF;
}

chỉ đơn giản như vậy là đã có thể thay đổi thành công màu chữ chọn trên website của chúng ta rồi.

Lời kết

Thực chất thì thủ thuật này không mang lại nhiều ích lợi nào gọi là lớn cho website của chúng ta, nhưng hi vọng rằng nó làm cho website của chúng ta trong khác lạ và ngầu hơn trong mắt người dùng.

Trước đây mình có giới thiệu một hiệu ứng cũng khá hay cho Blogger, nhưng nói chung làm với website nào thì cũng tương tự thôi, kết hợp cả css và javascript:
bạn có thể tham khảo qua để làm đẹp cho website của mình.