Tất cả - Thủ thuật CSS

Anonim

Các allbất động sản trong CSS reset tất cả các thuộc tính thành phần được chọn của, ngoại trừ directionunicode-biditài sản mà theo hướng kiểm soát văn bản.

.module ( all: unset; )

Điểm của nó là cho phép thiết lập lại kiểu thành phần. Đôi khi, bắt đầu lại từ đầu với việc tạo kiểu dễ dàng hơn nhiều so với việc chống lại mọi thứ đã có.

Giá trị

  • initial: đặt lại tất cả các thuộc tính của phần tử đã chọn về giá trị ban đầu của chúng như được xác định trong thông số CSS.
  • inherit: phần tử được chọn kế thừa tất cả kiểu dáng của phần tử mẹ của nó, kể cả những kiểu thông thường không thể kế thừa.
  • unset: phần tử được chọn kế thừa mọi giá trị có thể kế thừa được truyền lại từ phần tử mẹ. Nếu không có giá trị có thể kế thừa, giá trị ban đầu từ thông số CSS sẽ được sử dụng cho từng thuộc tính.

Một số thuộc tính không có giá trị ban đầu được xác định rõ ràng trong đặc tả và thay vào đó cho phép tác nhân người dùng đặt giá trị ban đầu - colorfont-familylà hai ví dụ. Nếu all: initial;hoặc all: unset;được áp dụng, giá trị mặc định của tác nhân người dùng được sử dụng làm initialgiá trị cho các thuộc tính này.

allđược coi là thuộc tính “tốc ký” vì nó cho phép chúng tôi kiểm soát các giá trị của mọi thuộc tính CSS cùng một lúc với một khai báo duy nhất. Tuy nhiên, không giống như hầu hết các thuộc tính tốc ký, không có phiên bản "tốc ký" thực tế và nó không có thuộc tính phụ.

Bản giới thiệu

Xem tab CSS để biết các nhận xét cho biết thuộc tính nào có thể kế thừa. Chú ý rằng khi inheritgiá trị được sử dụng, divkế thừa tất cả các tài sản từ cha mẹ của mình, kể cả nó width, paddingborder, mà thường không được thừa hưởng.

Xem bản trình diễn tất cả thuộc tính Pen của CSS-Tricks (@ css-trick) trên CodePen.

Thêm thông tin

  • all trong Bản nháp của biên tập viên xếp tầng và kế thừa CSS W3C cấp 4
  • Bảng thuộc tính đầy đủ CSS2: hiển thị khả năng kế thừa của tất cả các thuộc tính CSS2. Đặc tả CSS3 được chia thành nhiều phần và được lập chỉ mục trên Bảng thông số kỹ thuật.
  • Làm quen với Ban đầu: chi tiết hơn về initialgiá trị.
  • Đặt lại kiểu bằng cách sử dụng 'all: unset' trong Firefox 27 (2013) của Cameron McCormack

Hỗ trợ trình duyệt

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

Máy tính để bàn

Trình duyệt Chrome Firefox I E Cạnh Safari
37 27 Không 79 9.1

Di động / Máy tính bảng

Chrome dành cho Android Android Firefox Android iOS Safari
88 85 4.4.3-4.4.4 9.3