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_default/index.html | 145 +++++++++++++++++++++++++++++ 1 file changed, 145 insertions(+) create mode 100644 files/ca/web/css/_colon_default/index.html (limited to 'files/ca/web/css/_colon_default') diff --git a/files/ca/web/css/_colon_default/index.html b/files/ca/web/css/_colon_default/index.html new file mode 100644 index 0000000000..1cec2992e7 --- /dev/null +++ b/files/ca/web/css/_colon_default/index.html @@ -0,0 +1,145 @@ +--- +title: ':default' +slug: 'Web/CSS/:default' +tags: + - CSS + - Layout + - NeedsMobileBrowserCompatibility + - Pseudo-class + - Reference + - Web +translation_of: 'Web/CSS/:default' +--- +
{{CSSRef}}
+ +

La pseudo-classe CSS :default representa qualsevol element de formulari que sigui el predeterminat entre un grup d'elements relacionats.

+ +

Aquest selector es pot utilitzar en els elements {{htmlelement("button")}}, <input type="checkbox">, <input type="radio"> i {{htmlelement("option")}}.

+ +
/* Selects any default <input> */
+input:default {
+  background-color: lime;
+}
+ +

Els elements agrupats que permeten seleccions múltiples també poden tenir múltiples valors predeterminats, és a dir, poden tenir diversos elements seleccionats inicialment. En aquest cas, tots els valors predeterminats es representen utilitzant la pseudo-classe :default. Per exemple, podeu aplicar un estil a les caselles de selecció predeterminades d'un grup de caselles de selecció.

+ +

Sintaxi

+ +
{{csssyntax}}
+
+ +

Exemple

+ +

HTML

+ +
<input type="radio" name="season" id="spring">
+<label for="spring">Spring</label>
+
+<input type="radio" name="season" id="summer" checked>
+<label for="spring">Summer</label>
+
+<input type="radio" name="season" id="fall">
+<label for="spring">Fall</label>
+
+<input type="radio" name="season" id="winter">
+<label for="spring">Winter</label>
+
+ +

CSS

+ +
input:default {
+  box-shadow: 0 0 2px 1px coral;
+}
+
+input:default + label {
+  color: coral;
+}
+
+ +

Resultat

+ +

{{EmbedLiveSample("Example")}}

+ +

Especificacions

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EspecificacióEstatComentari
{{SpecName('HTML WHATWG', '#selector-default', ':default')}}{{Spec2('HTML WHATWG')}}Sense canvis.
{{SpecName('HTML5 W3C', '#selector-default', ':default')}}{{Spec2('HTML5 W3C')}}Defineix la semàntica HTML associada i la validació de restriccions.
{{SpecName('CSS4 Selectors', '#default-pseudo', ':default')}}{{Spec2('CSS4 Selectors')}}Sense canvis.
{{SpecName('CSS3 Basic UI', '#pseudo-default', ':default')}}{{Spec2('CSS3 Basic UI')}}Definició inicial, però sense la semàntica associada
+ + + +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
DescripcióChromeFirefox (Gecko)Internet ExplorerOperaSafari
Suport bàsic10.0{{CompatGeckoDesktop("2.0")}}{{CompatNo}}10.05.0
+
+ +
+ + + + + + + + + + + + + + + + + + + +
DescripcióAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Suport bàsic{{CompatUnknown}}{{CompatGeckoMobile("2.0")}}{{CompatNo}}10.05.0
+
-- cgit v1.2.3-54-g00ecf