Tôi vừa thấy mã CSS bao gồm thẻ ::before
. Tôi đã xem MDN để xem những gì ::before
là nhưng tôi thực sự không hiểu nó. Ai đó có thể giải thích nó hoạt động như thế nào? Liệu nó có tạo thành phần tử DOM trước khi chúng ta chọn CSS không?Sự khác nhau giữa: trước và :: trước là gì?
Trả lời
Điều này phân biệt các phần tử giả từ các lớp giả.
Sự khác biệt giữa các lớp giả và các yếu tố giả được mô tả tại http://www.d.umn.edu/~lcarlson/csswork/selectors/pseudo_dif.html
:: trước khi ký hiệu (với hai dấu hai chấm) được giới thiệu trong CSS3 để thiết lập sự phân biệt giữa các lớp giả và các phần tử giả. Các trình duyệt cũng chấp nhận ký hiệu: trước khi được giới thiệu trong CSS 2. Nguồn: https: //developer.mozilla.org/en-US/docs/Web/CSS/:: trước đây Như trước đây là một ELEMENT giả và không phải là một lớp giả (như: hover) hai dấu hai chấm là tốt hơn (do đó theo tiêu chuẩn CSS3). – JoostS
Theo những tài liệu, họ là tương đương:
element:before { style properties } /* CSS2 syntax */
element::before { style properties } /* CSS3 syntax */
Sự khác biệt duy nhất là ruột kết đôi được sử dụng trong CSS3, trong khi tràng duy nhất là phiên bản di sản.
Lập luận:
Các :: trước khi ký hiệu đã được giới thiệu trong CSS 3 để thiết lập một phân biệt đối xử giữa pseudo-class và pseudo-yếu tố. Các trình duyệt cũng chấp nhận ký hiệu: trước khi được giới thiệu trong CSS 2.
Về cơ bản, chúng có cùng ý nghĩa. Các ::
đã được giới thiệu trong CSS3 để giúp descriminate giữa các phần tử giả (như: trước và sau) và các lớp giả (như: liên kết và: hover).
Một là cách CSS2 (: trước) và cách kia là CSS3 (:: trước). Hiện tại, chúng có thể hoán đổi cho nhau trong các trình duyệt hỗ trợ CSS2 & CSS3.
Dưới đây là một lời giải thích tốt: http://www.impressivewebs.com/before-after-css3/
Tôi đã kiểm tra ra MDN và w3.org, và tốt nhất mà tôi có thể đưa ra được rằng ::
được sử dụng cho cấu thay đổi, và :
được sử dụng cho styling.
Chúng hiện có thể hoán đổi cho nhau vì lý do tương thích.
Nó dường như tách :link
(ví dụ), mà phong cách một <a>
, từ :before
(đó là một sự thay đổi cấu trúc ).
:
dùng để tạo kiểu, ::
là dành cho cấu trúc.
- 1. Sự khác nhau giữa trước() và bắt đầu()
- 2. Sự khác nhau giữa dịch vụ nền và nền trước là gì?
- 3. Sự khác nhau giữa JSP và JSTL là gì?
- 4. Sự khác nhau giữa dataview và datatable là gì?
- 5. Sự khác nhau giữa hg quên và hg là gì?
- 6. Sự khác nhau giữa `DialogInterface.dismiss()` và `DialogInterface.cancel()` là gì?
- 7. Sự khác nhau giữa cstdlib và stdlib.h là gì?
- 8. Sự khác nhau giữa 'và #' trong Lisp là gì?
- 9. Sự khác nhau giữa "jquery.min.css" và "jquery.css" là gì?
- 10. Sự khác nhau giữa "$ (this)" và "this" là gì?
- 11. Sự khác nhau giữa DTCPing và DTCTester là gì?
- 12. Trong CLR, sự khác biệt giữa chủ đề nền và nền trước là gì?
- 13. Sự khác nhau giữa Application.Run() và Form.ShowDialog() là gì?
- 14. sự khác nhau giữa UIImageView và drawInRect là gì?
- 15. Sự khác nhau giữa Phing và PHPUnderControl là gì?
- 16. Sự khác biệt giữa VB.NET và các phiên bản trước của VB là gì?
- 17. Sự khác nhau giữa querySelector và getElementsByTagName là gì?
- 18. Sự khác nhau giữa VCS và SCM là gì?
- 19. Sự khác nhau giữa app.doScript và $ .evalFile là gì?
- 20. Sự khác nhau giữa isSaleable() và isAvailable() là gì?
- 21. Sự khác nhau giữa WPF và WinForms là gì?
- 22. Sự khác nhau giữa JavaScript và Java là gì?
- 23. Sự khác nhau giữa ODBC và OleDB là gì?
- 24. Sự khác nhau giữa SGML và XML là gì?
- 25. Sự khác nhau giữa DefaultSelenium và RemoteWebDriver là gì?
- 26. Sự khác nhau giữa RMI và Corba là gì?
- 27. Sự khác nhau giữa scgi và wsgi là gì?
- 28. Sự khác nhau giữa wsHttpBinding và ws2007HttpBinding là gì?
- 29. Sự khác nhau giữa Pingback và Trackback là gì?
- 30. Trong Python, sự khác nhau giữa ".append()" và "+ = []" là gì?
Afaik, Tổ công tác CSS quyết định tiền tố giả yếu tố với một thư ruột kết thêm để phân biệt chúng từ pseudo-lớp mà chỉ có một thư ruột kết. –
... và vì ký hiệu dấu hai chấm không được thực hiện trong IE8, chúng ta sẽ phải đợi 'cho đến khi nó được xóa khỏi thị trường (như trong năm 2016 hoặc hơn), trước khi chúng ta có thể bắt đầu sử dụng ':: before'. Công việc tuyệt vời, các phần tử giả của Microsoft '-.-' –
đã tồn tại từ CSS1. Các phần tử giả đầu tiên là ': first-letter' và': first-line'. – BoltClock