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_fullscreen/index.html | 241 ++++++++++++++++++++++++++ 1 file changed, 241 insertions(+) create mode 100644 files/ca/web/css/_colon_fullscreen/index.html (limited to 'files/ca/web/css/_colon_fullscreen') diff --git a/files/ca/web/css/_colon_fullscreen/index.html b/files/ca/web/css/_colon_fullscreen/index.html new file mode 100644 index 0000000000..f1a7bad43f --- /dev/null +++ b/files/ca/web/css/_colon_fullscreen/index.html @@ -0,0 +1,241 @@ +--- +title: ':fullscreen' +slug: 'Web/CSS/:fullscreen' +tags: + - CSS + - Experimental + - Full-screen + - Pseudo-class + - Reference +translation_of: 'Web/CSS/:fullscreen' +--- +
{{CSSRef}} {{SeeCompatTable}}
+ +

La pseudo-class CSS :fullscreen representa un element que es mostra quan el navegador està en mode de pantalla completa (fullscreen mode).

+ +
/* Selecciona qualsevol <div> que es mostri en mode de pantalla completa */
+/* S'ha implementat a Firefox, WebKit / Chrome i Edge / IE amb prefixos; Edge també és compatible amb la versió no prefixada */
+div:-moz-full-screen {
+  background-color: pink;
+}
+
+div:-webkit-full-screen {
+  background-color: pink;
+}
+
+div:fullscreen {
+  background-color: pink;
+}
+ +
+

Note: L'especificació del W3C utilitza la paraula única :fullscreen,  - sense guió -, però ambdues implementacions experimentals de WebKit i Gecko utilitzen una variant prefixada amb dues paraules separades per un guió: :-webkit-full-screen i :-moz-full-screen, respectivament. Microsoft Edge i Internet Explorer utilitzen la convenció estàndard: :fullscreen i :-ms-fullscreen, respectivament.

+
+ +

Sintaxi

+ +
{{csssyntax}}
+ +

Exemple

+ +

HTML

+ +
<div id="fullscreen">
+  <h1>:fullscreen Demo</h1>
+  <p>This text will become big and red when the browser is in fullscreen mode.</p>
+  <button id="fullscreen-button">Enter Fullscreen</button>
+</div>
+
+ + + +

CSS

+ +
#fullscreen:fullscreen {
+  padding: 42px;
+  background-color: pink;
+  border:2px solid #f00;
+  font-size: 200%;
+}
+
+#fullscreen:fullscreen > h1 {
+  color: red;
+}
+
+#fullscreen:fullscreen > p {
+  color: darkred;
+}
+
+#fullscreen:fullscreen > button {
+  display: none;
+}
+
+ +

Resultats

+ +

{{ LiveSampleLink('Example', "Feu clic aquí per provar aquest exemple.") }}

+ +

Especificacions

+ + + + + + + + + + + + + + + + +
EspecificacióEstatComentari
{{SpecName('Fullscreen', '#:fullscreen-pseudo-class', ':fullscreen')}}{{Spec2('Fullscreen')}}Definició inicial
+ + + +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
DescripcióChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Suport bàsic15.0 {{property_prefix("-webkit")}}[1]12{{CompatGeckoDesktop("9.0")}}{{property_prefix("-moz")}}[1]
+ {{CompatGeckoDesktop("47.0")}}[2]		11 {{property_prefix("-ms")}}[3]{{CompatUnknown}}6.0 {{property_prefix("-webkit")}}[1]
Seleccionar tots els elements en la pila de la pantalla completa{{CompatUnknown}}12{{CompatGeckoDesktop(43)}}11{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
DescripcióAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Suport bàsic{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile("9.0")}}
+ {{CompatGeckoDesktop("47.0")}}[2]		{{CompatNo}}{{CompatNo}}{{CompatNo}}
Seleccionar tots els elements en la pila de la pantalla completa{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile("43")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

[1] Tant les versions prefixades de WebKit com Gecko tenen un guió entre full i screen, però la proposta de W3C utilitza una sola paraula: :fullscreen, :-webkit-full-screen, :-moz-full-screen.

+ +

[2] Gecko 47.0 {{geckoRelease("47.0")}} implementa la pseudo-classe sense prefix darrere de la preferència full-screen-api.unprefix.enabled, per defecte a false.

+ +

[3] Internet Explorer utilitza el prefix -ms però no té un guió entre full i screen: :-ms-fullscreen.

+ +

Vegeu també

+ + -- cgit v1.2.3-54-g00ecf