CSS basic: Pseudo-elements

  • CSS tutorial
  • 22 tháng 04 2012
  • bởi Văn Khương
  • 0 Comments

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.

Tags: CSS2 basic
  • Chia sẻ
comments powered by Disqus