Chatbox

Các bạn vui lòng dùng từ ngữ lịch sự và có văn hóa,sử dụng Tiếng Việt có dấu chuẩn. Chúc các bạn vui vẻ!
02/07/2015 08:07 # 1
nhathung
Cấp độ: 30 - Kỹ năng: 5

Kinh nghiệm: 42/300 (14%)
Kĩ năng: 26/50 (52%)
Ngày gia nhập: 30/05/2015
Bài gởi: 4392
Được cảm ơn: 126
Selection - Màu mè cho website với CSS


Seletion là 1 tùy chỉnh của css có sẵn trong trình duyệt nhưng ít được biết được bởi tính năng của nó chẳng quan trọng gì lắm kèm theo màu mặc định của nó là xám xịt. Bạn có thể dễ dàng thấy nó khi bôi đen 1 đoạn văn bản hoặc 1 vùng trang web hoặc nhanh gọn hơn là Ctrl+A. Đây là 1 tùy chỉnh rất hay dùng để thay đổi màu khu vực select, tuy tính năng đơn giản nhưng nó dễ dàng đánh vào thị giác của người xem nếu họ lỡ tay dính bẫy. Smile

Demo

Bôi đen hoặc Ctrl+A để thấy kết quả.

Đây là đoạn văn bản với ::selection.

Đây là đoạn văn bản với ::-moz-selection.

Đây là đoạn văn bản với ::-webkit-selection.

Cách sử dụng

Thêm các class sau vào file css của bạn, sau đó gọi lại các class này ở những yếu tố mà bạn muốn, hoặc bạn có thể dùng cho cả trang web. Tuy khá phiền phức vì phải tùy chỉnh cho các trình duyệt nhưng Selection rất nhỏ gọn và độ đẹp của nó nếu được dùng đúng cách sẽ rất tuyệt vời.

01 /* Cho từng phần tử bạn muốn quy định */
02 p.normal::selection {
03     background:#cc0000;
04     color:#fff
05 }
06  
07 p.moz::-moz-selection {
08     background:#cc0000;
09     color:#fff
10 }
11  
12 p.webkit::-webkit-selection {
13     background:#cc0000;
14     color:#fff
15  
16 /* Dùng cho toàn trang web */
17 ::selection {
18     background#9f9
19 }
20 ::-webkit-selection {
21     background#9f9
22 }
23 ::-moz-selection {
24     background#9f9
25 }

Hi vọng với tay nghề gõ phím thần sầu và bộ não nhăn nheo của các designer có thể tạo ra nhiều điều hay ho với Selection Smile

theo ntuts.com




 
Copyright© Đại học Duy Tân 2010 - 2024