Đặt hàng theo cú pháp CSS3 Vs Standard CSS3 của nhà cung cấp

Question

Để đạt được khả năng tương thích giữa các trình duyệt, chúng tôi có xu hướng sử dụng cả tiện ích mở rộng cụ thể của nhà cung cấp và cú pháp CSS3 chuẩn. Tôi biết CSS3 vẫn còn trong bản nháp, nhưng chúng tôi đã bắt đầu sử dụng nó. Nhưng câu hỏi đặt ra là, trật tự của nơi chúng xảy ra rất quan trọng?

Ví dụ, cho phép nhìn thấy ở đây

-moz-border-radius: 10px; 
border-radius: 10px; 

này áp dụng trình duyệt cụ thể border-radius và sau đó rơi trở lại với phương pháp tiêu chuẩn, sau đó sẽ hy vọng được bỏ qua, nhưng vẫn còn.

Tương tự, chuyển đổi thứ tự của chúng

border-radius: 10px; 
-moz-border-radius: 10px; 

Bây giờ, điều này cố gắng cú pháp tiêu chuẩn đầu tiên và sau đó rơi trở lại để mở rộng dựa trên trình duyệt.

Có sự khác biệt nào do lệnh đặt hàng không? Có thể là về hiệu suất hoặc người nào khác.

Answer 1

Khi viết thuộc tính CSS3, sự khôn ngoan hiện đại là liệt kê thuộc tính "thực" cuối cùng và tiền tố của nhà cung cấp trước tiên.

Một điều khác cần suy nghĩ khi bạn thực hiện thuộc tính không có tiền tố là đặt nó sau phiên bản có tiền tố của nhà cung cấp. Khi trình duyệt triển khai phiên bản tiêu chuẩn của thuộc tính, như được chỉ định trong đặc tả CSS3 có liên quan, bạn có thể muốn sử dụng triển khai đó thay vì phiên bản thử nghiệm, cụ thể cho trình duyệt (phiên bản này có khả năng vẫn hỗ trợ tương thích ngược) . Đặt nó cuối cùng nên đảm bảo rằng nó sẽ ghi đè lên việc thực hiện tiền tố của nhà cung cấp.

Xem Ordering CSS3 Properties

Xem thêm: Remember non-vendor-prefixed CSS 3 properties (and put them last)

Answer 2

Trình tự các tiền tố không quan trọng, miễn là bạn giữ cho phiên bản tiêu chuẩn trong tương lai như trước.

Nếu trình duyệt không hỗ trợ tiền tố, trình duyệt sẽ chỉ bỏ qua quy tắc và thực thi phiên bản chuẩn.

ps: giống như A.K. nhưng đơn giản hơn, vì vậy bạn không phải đọc tất cả các trang.

Answer 3

Bây giờ, điều này sẽ thử cú pháp tiêu chuẩn trước và sau đó quay trở lại tiện ích dựa trên trình duyệt.

Đây có thể là một tuyên bố gây hiểu lầm. Trình duyệt tuân thủ sẽ thử thuộc tính không được cố định chuẩn trước tiên, nhưng nếu nó cũng hỗ trợ thuộc tính tiền tố ngoài tiêu chuẩn, sau đó nó cũng sẽ áp dụng tiền tố đó. Điều này thường dẫn đến việc khai báo tiêu chuẩn bị ghi đè bởi khai báo tiền tố và khả năng thực thi không chuẩn của trình duyệt của thuộc tính đó, đánh bại mục đích của việc có thuộc tính chuẩn ở đó ngay từ đầu.

Lý do tại sao bạn nên khai báo thuộc tính chưa được sửa cuối cùng là vì đó là cách thuộc tính xếp tầng trong quy tắc: trình duyệt sẽ luôn sử dụng thuộc tính áp dụng cuối cùng.Các phiên bản tiền tố và không cố định của thuộc tính được coi là thuộc tính tương tự đối với thác, vì vậy bạn muốn trình duyệt làm hết sức để tuân thủ các tiêu chuẩn khi áp dụng thuộc tính đó.

Nếu trình duyệt thực hiện tiền tố nhưng không chuẩn, thì tốt, nhưng nếu nó thực hiện cả hai, bạn muốn đảm bảo nó sử dụng tiêu chuẩn thay thế. Bạn làm điều này bằng cách khai báo thuộc tính chuẩn cuối cùng.

---

_{Theo như tôi biết điều này không phải được quyết định bởi spec, bởi vì như xa như spec là phần mở rộng nhà cung cấp liên quan là phi tiêu chuẩn và vì vậy thực hiện của họ không thể được mô tả. Mặc dù các syntax of vendor prefixes được mô tả trong spec, triển khai hoàn toàn trái theo quyết định của các nhà cung cấp.}

_{Tuy nhiên, hầu hết các nhà phát triển trình duyệt đều tuân thủ các quy tắc của thuộc tính hoặc quy tắc được chuẩn hóa trước để luôn xử lý cả hai phiên bản tiền tố và không được cố định làm bí danh của nhau.}