diff options
| author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:45 -0500 |
|---|---|---|
| committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:45 -0500 |
| commit | 1109132f09d75da9a28b649c7677bb6ce07c40c0 (patch) | |
| tree | 0dd8b084480983cf9f9680e8aedb92782a921b13 /files/es/web/css/_doublecolon_-webkit-progress-value | |
| parent | 4b1a9203c547c019fc5398082ae19a3f3d4c3efe (diff) | |
| download | translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.gz translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.bz2 translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.zip | |
initial commit
Diffstat (limited to 'files/es/web/css/_doublecolon_-webkit-progress-value')
| -rw-r--r-- | files/es/web/css/_doublecolon_-webkit-progress-value/index.html | 111 |
1 files changed, 111 insertions, 0 deletions
diff --git a/files/es/web/css/_doublecolon_-webkit-progress-value/index.html b/files/es/web/css/_doublecolon_-webkit-progress-value/index.html new file mode 100644 index 0000000000..4e6d5bd10f --- /dev/null +++ b/files/es/web/css/_doublecolon_-webkit-progress-value/index.html @@ -0,0 +1,111 @@ +--- +title: '::-webkit-progress-value' +slug: 'Web/CSS/::-webkit-progress-value' +tags: + - CSS + - No estándar(2) + - Pseudo-elemento + - Referencia +translation_of: 'Web/CSS/::-webkit-progress-value' +--- +<div>{{CSSRef}}{{Non-standard_header}}</div> + +<h2 id="Resumen">Resumen</h2> + +<p>El <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento </a><a href="/es/docs/Web/CSS">CSS </a><strong><code>::-webkit-progress-value</code></strong> representa la parte rellena de la barra del elemento {{HTMLElement("progress")}}. Es hija del pseudo-elemento {{cssxref("::-webkit-progress-bar")}}.</p> + +<div class="note"> +<p><strong>Nota:</strong> para que <code>::-webkit-progress-value</code> tenga efecto en el elemento <progress> {{cssxref("-webkit-appearance")}} deberá tener <em>none </em>como valor.</p> +</div> + +<h2 id="Especificaciones">Especificaciones</h2> + +<p>No es parte de ninguna especificación. Es un elemento propietario y específico de WebKit/Blink.</p> + +<h2 id="Ejemplo">Ejemplo</h2> + +<h3 id="Contenido_CSS">Contenido CSS</h3> + +<pre class="brush: css">progress { + -webkit-appearance: none; +} + +::-webkit-progress-value { + background-color: orange; +}</pre> + +<h3 id="Contenido_HTML">Contenido HTML</h3> + +<pre class="brush: html"><progress value="10" max="50"> +</pre> + +<h2 id="Resultado">Resultado</h2> + +<p>{{EmbedLiveSample("Ejemplo", 200, 50)}}</p> + +<p>Una barra de progreso con el estilo indicado anteriormente será similar a esta:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/13490/progress-value.png" style="height: 60px; width: 249px;"></p> + +<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_además">Ver además</h2> + +<ul> + <li>Los pseudo-elemento de WebKit/Blink para dar estilos a otras partes de un elemento {{HTMLElement("progress")}}: + <ul> + <li>{{ cssxref("::-webkit-progress-bar") }}</li> + <li>{{ cssxref("::-webkit-progress-inner-element") }}</li> + </ul> + </li> + <li>{{ cssxref("::-moz-progress-bar") }}</li> + <li>{{ cssxref("::-ms-fill") }}</li> +</ul> |
