aboutsummaryrefslogtreecommitdiff
path: root/files/es/web/css/user-select
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:45 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:45 -0500
commit1109132f09d75da9a28b649c7677bb6ce07c40c0 (patch)
tree0dd8b084480983cf9f9680e8aedb92782a921b13 /files/es/web/css/user-select
parent4b1a9203c547c019fc5398082ae19a3f3d4c3efe (diff)
downloadtranslated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.gz
translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.bz2
translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.zip
initial commit
Diffstat (limited to 'files/es/web/css/user-select')
-rw-r--r--files/es/web/css/user-select/index.html138
1 files changed, 138 insertions, 0 deletions
diff --git a/files/es/web/css/user-select/index.html b/files/es/web/css/user-select/index.html
new file mode 100644
index 0000000000..0e597df92a
--- /dev/null
+++ b/files/es/web/css/user-select/index.html
@@ -0,0 +1,138 @@
+---
+title: user-select
+slug: Web/CSS/user-select
+translation_of: Web/CSS/user-select
+---
+<div>{{CSSRef}}</div>
+
+<p>La propiedad <a href="/en-US/docs/Web/CSS">CSS </a><code><strong>user-select</strong></code> controla si el usuario puede seleccionar el texto. Esto no tiene ningún efecto en el contenido cargado bajo {{Glossary("Chrome", "chrome")}}, excepto en cuadros de texto.</p>
+
+<pre class="brush:css">/* Valores de palabras clave */
+user-select: none;
+user-select: auto;
+user-select: text;
+user-select: contain;
+user-select: all;
+
+/* Varoles globales */
+user-select: inherit;
+user-select: initial;
+user-select: unset;
+
+/* Valores Mozilla-specific */
+-moz-user-select: none;
+-moz-user-select: text;
+-moz-user-select: all;
+
+/* Valores WebKit-specific */
+-webkit-user-select: none;
+-webkit-user-select: text;
+-webkit-user-select: all; /* No funciona el Safari; solo usa
+ "none" or "text", o si no hará
+ permitir escribir en el contenedor &lt;html&gt; */
+
+/* Valores Microsoft-specific */
+-ms-user-select: none;
+-ms-user-select: text;
+-ms-user-select: element;
+</pre>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<dl>
+ <dt><code>none</code></dt>
+ <dd>El texto y sus sub elementos no son seleccionables. Tenga en cuenta que el objeto {{domxref("Selection")}} puede contener estos elementos.</dd>
+ <dt><code>auto</code></dt>
+ <dd>El valor calculado auto se determina de la siguiente manera: En los pseudo elementos <code>::before</code> y <code>::after</code>, el valor calculado es <code>none</code>
+ <ul>
+ <li>Si el elemento es un elemento editable, el valor calculado es <code>contain</code></li>
+ <li>De lo contrario, si el valor calculador de <code>user-select</code> en la matriz de este elemento es <code>all</code>, el valor calculado es <code>all</code></li>
+ <li>De lo contrario, si el valor calulado de <code>user-select</code>  en la matriz de este elemento es  <code>none</code>, el valor calculado es <code>none</code></li>
+ <li>De lo contrario, el valor calculado es <code>text</code></li>
+ </ul>
+ </dd>
+ <dt><code>text</code></dt>
+ <dd>El texto puede ser seleccionado por el usuario.</dd>
+ <dt><code>all</code></dt>
+ <dd>En el editor HTML, si  se realiza doble-click o click-contextual en el subelemento, se seleccionará el antecesor más alto de el valor.</dd>
+ <dt><code>contain</code></dt>
+ <dd>Permite que la selección comience dentro del elemento; sin embargo, la selección estará contenida por los límites de ese elemento.</dd>
+ <dt><code>element</code>{{non-standard_inline}} (IE-specific alias)</dt>
+ <dd>Igual que <code>contain</code>. Solo lo soportado en Internet Explorer.</dd>
+</dl>
+
+<div class="note">
+<p id="Formal_syntax"><strong>Nota:</strong> CSS UI 4 <a href="https://github.com/w3c/csswg-drafts/commit/3f1d9db96fad8d9fc787d3ed66e2d5ad8cfadd05">renombra user-select: a contain</a>.</p>
+</div>
+
+<h3 id="Formal_syntax_2">Formal syntax</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;p&gt;Debería poder seleccionar este texto.&lt;/p&gt;
+&lt;p class="unselectable"&gt;No puedes seleccionar este texto&lt;/p&gt;
+&lt;p class="all"&gt;Al hacer clic una vez se seleccionará todo este texto.&lt;/p&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">.unselectable {
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.all {
+  -moz-user-select: all;
+  -webkit-user-select: all;
+  -ms-user-select: all;
+  user-select: all;
+}
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedLiveSample("Examples")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Especificación</th>
+ <th scope="col">Estado</th>
+ <th scope="col">Comentario</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('CSS4 UI', '#propdef-user-select', 'user-select')}}</td>
+ <td>{{Spec2('CSS4 UI')}}</td>
+ <td>Initial definition. Also defines <code>-webkit-user-select</code> as a deprecated alias of <code>user-select</code>.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, visite<br>
+<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud.</div>
+
+<p>{{Compat("css.properties.user-select")}}</p>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{Cssxref("::selection")}}</li>
+ <li>The JavaScript {{domxref("Selection")}} object.</li>
+ <li><a href="http://www.w3.org/TR/css-ui-4/#propdef-user-select">user-select</a> in <a href="http://www.w3.org/TR/css-ui-4/">CSS Basic User Interface Module Level 4</a>.</li>
+</ul>