Cách gỡ lỗi phần tử giả giữ chỗ trong firefox?

Question

tôi có mã CSS như thế này:

:-moz-placeholder,::-moz-placeholder { 
    color: #999; 
    /*some additional font styling*/ 
} 

tôi có thể bấm vào nút "Kiểm tra yếu tố" và xem tất cả các thông tin phong cách về yếu tố. Nhưng nơi tôi có thể thấy tất cả các quy tắc CSS đã áp dụng cho phần giữ chỗ phần tử?

Answer 1

Placeholder là một phần tử giả, như :: trước và sau :: (https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements) đôi khi refered như pseudo-class (https://developer.mozilla.org/en-US/docs/Web/CSS/pseudo-classes)

Những loại yếu tố không thể được nhìn thấy trong Firefox Inspector, bạn cần thiết ít nhất là Firebug hoặc Chrome Dev Tools, nhưng gần đây nó cũng có sẵn trong Firefox Inspector. Chúng là một phần của "shadow dom" (mô tả cực kỳ đơn giản: các phần tử được tạo bởi trình duyệt bên trong các phần tử khác).

Bạn sẽ có thể tìm trình giữ chỗ trong thanh tra viên bên trong các yếu tố đầu vào hoặc văn bản của bạn, ví dụ: chọn một yếu tố đầu vào, sau đó chọn "kiểm tra nguyên tố" từ menu chuột phải, sau đó bạn sẽ thấy một cái gì đó như thế:

Firefox Inspector

Chrome Dev Công cụ

Đối với Chrome, bạn có thể cần bật "Hiển thị tác nhân người dùng đổ bóng ow DOM "trong cài đặt Công cụ dành cho nhà phát triển.

Answer 2

1. Trong thanh địa chỉ của bạn, hãy vào: about: config
2. Tìm kiếm bất động sản: dom.webcomponents.enabled và đánh dấu nó như là sự thật.
3. Nếu bạn đã ở trên trang phát triển, hãy nhớ tải lại.

Sau đó, bạn sẽ có thể nhấp vào các phần tử giả: trước &: sau và xem phong cách của chúng. Không chắc chắn tại sao tính năng này bị tắt, trong Chrome hoạt động theo mặc định.

Từ này link