Hướng dẫn Tìm hiểu phần tử Pseudo-elements trong CSS

[PVS]

Tìm hiểu phần tử Pseudo-elements trong CSS

Pseudo-elements được hiểu như phần tử ảo không thực sự tồn tại rõ ràng trong cây hồ sơ. Pseudo-elements có thể động. Trong CSS1 và CSS2 pseudo-elementss bắt đầu với dấu hai chấm ( : ), trong CSS3 thì có thêm hai dấu hai chấm ( :: ).

:first-letter
Bạn thường dùng để chọn ký tự đầu tiên trong một đoạn văn để định kiểu cho nó giống như bạn muốn tạo drop caps trong Msword.

:first-line
Chọn dòng đầu tiên trong một đoạn văn, dòng đầu tiên được hiểu khi bạn hiển thị trên trình duyệt vậy nên độ dài dòng đầu tiên phụ thuộc kích thước hộp bao đoạn văn.

:before

#breadcrumbs:before {
content: "You are here:";
margin-right: 0.5em;
}

với before bạn có thể thêm một đoạn văn bản vào trước đoạn văn và định kiểu cho đoạn văn mới thêm vào.

:after
Hoạt động tương tự như before nhưng là ảnh hưởng vào phía sau của đoạn văn.

::selection
Pseudo-elements này hoạt động trên trình duyệt hỗ trợ CSS3, khi bạn dùng chuột quét chọn một đoạn text thì bạn có thể định kiểu cho đoạn văn bạn đang chọn.

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

Nguồn: sothichweb.com​