From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/ca/web/css/_colon_not/index.html | 176 +++++++++++++++++++++++++++++++++ 1 file changed, 176 insertions(+) create mode 100644 files/ca/web/css/_colon_not/index.html (limited to 'files/ca/web/css/_colon_not/index.html') diff --git a/files/ca/web/css/_colon_not/index.html b/files/ca/web/css/_colon_not/index.html new file mode 100644 index 0000000000..2c0171e00b --- /dev/null +++ b/files/ca/web/css/_colon_not/index.html @@ -0,0 +1,176 @@ +--- +title: ':not()' +slug: 'Web/CSS/:not' +tags: + - CSS + - Layout + - Pseudo-class + - Reference + - Web +translation_of: 'Web/CSS/:not' +--- +
{{CSSRef}}
+ +

La pseudo-class CSS :not() representa elements que no coincideixen amb una llista de selectors. Atès que impedeix que es seleccionin elements específics, es coneix com a pseudo-class de negació.

+ +
/* Selecciona qualsevol element que NO sigui un paràgraf */
+:not(p) {
+  color: blue;
+}
+ +
+

Notes:

+ + +
+ +

Sintaxi

+ +

La pseudo-class :not() requereix una llista separada per comes d'un o més selectors com a argument. La llista no ha de contenir un altre selector de negació o un pseudo-element.

+ +
+

La capacitat d'enumerar més d'un selector és experimental i encara no està àmpliament suportada.

+
+ +
{{csssyntax}}
+ +

Exemple

+ +

HTML

+ +
<p>I am a paragraph.</p>
+<p class="fancy">I am so very fancy!</p>
+<div>I am NOT a paragraph.</div>
+
+ +

CSS

+ +
.fancy {
+  text-shadow: 2px 2px 3px gold;
+}
+
+/* <p> elements that are not in the class `.fancy` */
+p:not(.fancy) {
+  color: green;
+}
+
+/* Elements that are not <p> elements */
+body :not(p) {
+  text-decoration: underline;
+}
+
+/* Elements that are not <div> or <span> elements */
+body :not(div):not(span) {
+  font-weight: bold;
+}
+
+/* Elements that are not `.crazy` or `.fancy` */
+/* Note that this syntax is not well supported yet. */
+body :not(.crazy, .fancy) {
+  font-family: sans-serif;
+}
+ +

Resultat

+ +

{{EmbedLiveSample('Example')}}

+ +

Especificacions

+ + + + + + + + + + + + + + + + + + + + + +
EspecificacióEstatComentari
{{ SpecName('CSS4 Selectors', '#negation', ':not()') }}{{ Spec2('CSS4 Selectors') }}Estén el seu argument per permetre a alguns selectors no simples.
{{ SpecName('CSS3 Selectors', '#negation', ':not()') }}{{ Spec2('CSS3 Selectors') }}Definició inicial.
+ +

Navegadors compatibles

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
CaracterísticaChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Suport bàsic1.0{{CompatVersionUnknown}}{{CompatGeckoDesktop("1")}}9.09.53.2
Arguments estesos{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}9.0
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
CaracterísticaAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Suport bàsic2.1{{CompatVersionUnknown}}{{CompatGeckoMobile("1")}}9.010.03.2
Arguments estesos{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}9.0
+
-- cgit v1.2.3-54-g00ecf