Bây giờ chúng tôi sử dụng thời trang. Lựa chọn thay thế mà không có Kiểu dáng sẽ là chỉnh sửa các tệp bạn đã đăng trong câu trả lời của mình. Sành điệu cho phép chúng tôi dễ dàng quản lý CSS người dùng của nhiều trang web. Sành điệu thêm một biểu tượng nhỏ vào cửa sổ Firefox của bạn, nhấp vào đó rồi đi "Viết kiểu mới" -> "Dành cho" (trang này) .com ". Đặt tên cho kiểu và tùy chọn một số thẻ. Sau đó, bạn có thể để phân biệt kiểu này là kiểu áp dụng cho Superuser.com hoặc Stackexchange.com, v.v ... Cửa sổ này cung cấp cho chúng tôi một mẫu cho phép chúng tôi thay đổi CSS chỉ cho tên miền này. Nếu bạn cần thay đổi CSS cho một URL cụ thể, bạn có thể làm điều đó hoặc bạn cũng có thể chỉ có một kiểu trống nếu bạn muốn viết CSS áp dụng cho tất cả các trang web, chỉ cần chọn mục thích hợp từ menu Kiểu. Đối với ví dụ sửa đổi Trả lời của tôi, bạn '
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("superuser.com") {
}
Bất cứ điều gì được đưa vào khối tài liệu @ -moz sẽ chỉ áp dụng cho tên miền có trong ngoặc đơn. Xem các mục in đậm ở trên. Để thay đổi phần đệm cho câu trả lời, bạn cập nhật hộp văn bản như sau:
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("superuser.com") {
.answer {
padding-bottom:0px;
padding-top:0px;
}
}
Để giải quyết vấn đề này cho những người không biết CSS, trước tiên chúng tôi chọn lớp (ergo a "." Bắt đầu. Nếu chúng tôi chọn bằng ID, chúng tôi sẽ đặt câu trả lời "#" ở đó.) (vì vậy câu trả lời'). Sau đó, chúng tôi mở một khối với một dấu ngoặc nhọn để liệt kê các thuộc tính của mục đã chọn mà chúng tôi sẽ thay đổi. Đầu tiên, chúng tôi đang thay đổi phần đệm dưới cùng và đặt thành 0 pixel . Sau đó, chúng tôi làm tương tự cho padding-top . Mỗi tài sản và giá trị được kết thúc bằng một dấu chấm phẩy. Sau đó, chúng tôi đóng khối bằng một cái nẹp xoăn. (trong ví dụ unix của bạn, bạn sẽ làm điều này:
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("unix.stackexchange.com") {
body {
background:none;
}
}
Ở đây bạn đang làm việc trên miền unix.stackexchange.com. Chúng tôi đang chọn phần tử "body" (khi chọn phần tử HTML cũng là một bộ chọn CSS, không cần #s hoặc .s ở đây). Chúng tôi đang đặt nền tảng là không.)
CSS có một hệ thống phân cấp ưu tiên cụ thể để xác định cách đối phó với CSS của người dùng so với CSS của tác giả so với CSS của trình duyệt. Thông thường, chúng tôi có CSS cho một trang được viết bởi tác giả của trang và điều đó sẽ chứa các quy tắc cho nhiều yếu tố trên trang đó. Khi một quy tắc không được xác định bởi tác giả, nhưng là trong CSS người dùng của bạn, thì trình duyệt của bạn sẽ sử dụng quy tắc đó. Nếu cả hai đều không có CSS được xác định cho thành phần đó, thì trình duyệt sẽ sử dụng các quy tắc CSS mặc định của riêng nó trên thành phần đó. Vì vậy, có một hệ thống phân cấp trọng lượng ở đây, tác giả> người dùng> trình duyệt. Nếu một cái gì đó được xác định trong cả ba, thì CSS có trọng lượng cao hơn sẽ chiến thắng và CSS của nó có hiệu lực. Có một cách để có được CSS trọng lượng thấp hơn để ghi đè CSS có trọng lượng cao hơn và đó là bằng cách chỉ định chúng quan trọng. Bạn làm điều này bằng cách bao gồm "! Quan trọng"
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("unix.stackexchange.com") {
body {
background:none !important;
}
}
Bây giờ, nhấp vào Xem trước một lần nữa và bạn sẽ thấy rằng CSS người dùng của bạn hoạt động. Nhấp vào Lưu và thưởng thức.