Loại trừ CSS

Nếu tùy chọn này gây ra bất kỳ sự cố nào, bạn có thể cần phải loại trừ một tệp khỏi quy trình. Bạn có thể làm điều đó bằng cách tải xuống, cài đặt và chỉnh sửa plugin trợ giúp nhỏ sau đây

📝 Yêu cầu chỉnh sửa mã thủ công trước khi sử dụng
Bạn phải chỉnh sửa dòng bắt đầu bằng $excluded_files[] để phản ánh đường dẫn của tệp bạn muốn loại trừ

📥  Tải xuống (. nén). Tên lửa WP. Loại trừ tệp khỏi Async CSS
Nhà phát triển. Bạn có thể tìm mã cho plugin này trên GitHub

Mẹo để thực hiện công việc này

Loại trừ khỏi thu nhỏ/kết hợp CSS

Nếu bạn đang sử dụng CSS thu nhỏ hoặc kết hợp, bạn phải loại trừ các tệp giống nhau khỏi tùy chọn đó

Loại trừ nhiều tệp

Ký tự đại diện không hoạt động ở đây. Mỗi loại trừ phải được thêm một dòng mới. Ví dụ

$excluded_files[] = '/wp-content/plugins/plugin-name/filename1.css';
$excluded_files[] = '/wp-content/plugins/plugin-name/filename2.css';
$excluded_files[] = '/wp-content/plugins/plugin-name/filename3.css';

Đối với loại trừ ký tự đại diện, vui lòng kiểm tra. Loại trừ tất cả các tệp CSS trong một thư mục/thư mục khỏi Tải CSS không đồng bộ

Xóa chuỗi truy vấn

Xóa bất kỳ chuỗi truy vấn nào sau phần mở rộng .css. Ví dụ, để loại trừ

https://example.com/wp-content/themes/neutro/style.css?ver=1.2.5

sử dụng

/wp-content/themes/neutro/style.css

Loại trừ các tệp được lưu trữ bên ngoài

Sử dụng đường dẫn tệp theo tên miền để loại trừ các tệp không được lưu trữ trên miền của riêng bạn. Ví dụ, để loại trừ

Tôi tin rằng CSS được tạo trong Elementor và tạo một tệp như post-11. css (https. //www. tiếp cận kỹ thuật số. com. au/wp-content/uploads/elementor/css/post-11. css) , vì vậy nó không nội tuyến. Tôi không chắc cái nào chứa các biểu tượng xã hội, đó là lý do tại sao tôi tự hỏi liệu bạn có thể loại trừ qua một lớp chứ không phải toàn bộ tệp css/url

Tôi đã tắt LS Cache và bây giờ chúng xuất hiện như ý định với khoảng cách, bạn có thể xem tại đây https. //ngây thơ. đã/tắt và trên trang web https. //www. tiếp cận kỹ thuật số. com. au/

Mình vừa update lên Version 3. 5. 2 của LiteSpeed ​​Cache cũng

Cảm ơn bạn hoặc sự giúp đỡ của bạn

Hỗ trợ plugin qtwrk

(@qtwrk)

Xin chào,

Rất tiếc là không, không thể loại trừ theo lớp

bạn có thể thử tắt thu nhỏ HTML nếu bạn đã bật tính năng này không?

Tôi cũng gặp trường hợp biểu tượng xã hội được tách biệt với nhau bằng cách sử dụng khoảng trắng trong mã HTML, vì vậy trong trường hợp đó khi bật HTML minify, khoảng trắng sẽ bị xóa và gây ra sự cố, có thể bạn cũng gặp trường hợp tương tự.

Trân trọng,

Người bắt đầu chủ đề tiếp cận kỹ thuật số

(@reachdigital)

Xin chào @qtwrk,

Có, tắt HTML minify , khắc phục sự cố này

Bạn có nghĩ rằng đây là điều bạn sẽ giải quyết/khắc phục trong các bản cập nhật trong tương lai vì tôi muốn thu nhỏ HTML trong trang

Cảm ơn bạn

Hỗ trợ plugin qtwrk

(@qtwrk)

Xin chào,

Chà, tôi sẽ chuyển vụ việc cho các nhà phát triển của chúng tôi, nhưng cuối cùng thì tùy thuộc vào đánh giá và đánh giá của họ

bạn có thể thử so sánh kích thước yêu cầu chính có và không có HTML minify không?

Trân trọng,

Người bắt đầu chủ đề tiếp cận kỹ thuật số

(@reachdigital)

Cám ơn bạn một lần nữa,

Đã có một vài người khác đề cập đến vấn đề này nhưng không chắc họ có sử dụng bộ đệm LS hay không, đó có thể là một vấn đề chung về rút gọn HTML

Thuộc tính :not() trong CSS là một lớp giả phủ định và chấp nhận một hoặc một danh sách bộ chọn làm đối số. Nó khớp với một phần tử không được đại diện bởi đối số. Đối số đã truyền không được chứa bộ chọn bổ sung hoặc bất kỳ bộ chọn phần tử giả nào

Khả năng sử dụng a làm đối số được coi là thử nghiệm, mặc dù nó được hỗ trợ đang phát triển tại thời điểm viết bài này, bao gồm Safari (kể từ năm 2015), Firefox (kể từ tháng 12 năm 2020) và Chrome (kể từ tháng 1 năm 2021)

Dự phòng nhúng CodePen

/* the X argument can be replaced with any simple selectors */
:not(X) {
  property: value;
}

Trong ví dụ này, chúng tôi có một danh sách không có thứ tự với một lớp duy nhất trên

    CSS của chúng tôi sẽ chọn tất cả các phần tử 

  •  ngoại trừ (những) phần tử có loại 
    0

    /* Style everything but the .different class */
    li:not(.different) {
      font-size: 3em;
    }

    Bạn cũng có thể làm tương tự bằng cách sử dụng các lớp giả được coi là

    p:not(:nth-child(2n+1)) {
      font-size: 3em;
    }

    Tuy nhiên, nếu chúng ta sử dụng bộ chọn phần tử giả làm đối số thì nó sẽ không tạo ra kết quả như mong đợi

    ________số 8_______

    bộ chọn phức tạp

    Đây là những bộ chọn mới hơn bộ chọn :not() cơ bản

    /* select all 

    s that are not descendants of

    */ p:not(article *) { }

    Dự phòng nhúng CodePen

    Điều này có thể khiến bạn phải suy nghĩ một chút chỉ với việc lồng ghép nhiều hơn một chút. Ví dụ

    h2:not(:where(article *, section *)) {
      .. 
    }
    
    /*
    

    No match!

    No Match!

    */

    ví dụ trực quan

    Loại trừ CSS
    Trình bày trực quan về cách sử dụng đa dạng của :not()

    độ đặc hiệu

    Tính đặc hiệu của 

    3 lớp giả là tính đặc hiệu của đối số của nó. Lớp giả :not() không thêm vào tính đặc hiệu của bộ chọn, không giống như các lớp giả khác.  

    Các phủ định có thể không được lồng vào nhau, vì vậy _______4_______5 không bao giờ được phép. Các tác giả cũng nên lưu ý rằng vì các phần tử giả không được coi là , nên chúng không có giá trị làm đối số cho 

    6. Hãy lưu ý khi sử dụng bộ chọn thuộc tính vì một số bộ chọn không được hỗ trợ rộng rãi như những bộ chọn khác. Cho phép xâu chuỗi 
    3 bộ chọn với 
    3 bộ chọn khác

    hỗ trợ trình duyệt

    Lớp giả :not() đã được cập nhật trong danh sách cho phép đối số. Trong Bộ chọn CSS Cấp 3, nó chỉ có khả năng chấp nhận một bộ chọn đơn giản duy nhất. Do đó, hỗ trợ trình duyệt được phân chia một chút giữa bản nháp Cấp 3 và Cấp 4

    bộ chọn đơn giản

    IEedgeFirefoxChromeSafariOpera9+AllAllAll12. 1+AllAndroid ChromeAndroid FirefoxTrình duyệt AndroidiOS SafariOpera MobileAllAllAllAllAllAll

    danh sách chọn

    Dữ liệu hỗ trợ trình duyệt này đến từ , có nhiều chi tiết hơn. Một số cho biết rằng trình duyệt hỗ trợ tính năng ở phiên bản đó trở lên

    Cái nào không phải là loại bộ chọn của CSS?

    Các. bộ chọn not(selector) khớp với mọi phần tử KHÔNG phải là phần tử/bộ chọn đã chỉ định

    Empty có phải là trạng thái nút trong CSS không?

    Các. lớp giả CSS trống đại diện cho bất kỳ phần tử nào không có phần tử con. Trẻ em có thể là nút phần tử hoặc văn bản (bao gồm cả khoảng trắng). Nhận xét, hướng dẫn xử lý và nội dung CSS không ảnh hưởng đến việc một phần tử có được coi là trống hay không

    Những gì không phải là giả

    Các. không phải lớp giả đại diện cho một phần tử không được đại diện bởi đối số của nó .