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/html/atributos_globales | |
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/html/atributos_globales')
25 files changed, 2831 insertions, 0 deletions
diff --git a/files/es/web/html/atributos_globales/accesskey/index.html b/files/es/web/html/atributos_globales/accesskey/index.html new file mode 100644 index 0000000000..cb8bbcc16c --- /dev/null +++ b/files/es/web/html/atributos_globales/accesskey/index.html @@ -0,0 +1,143 @@ +--- +title: accesskey +slug: Web/HTML/Atributos_Globales/accesskey +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/accesskey +--- +<p>{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a> <strong>accesskey</strong> provee un indicio para generar un atajo de teclado para el elemento actual . Este atributo consiste en una lista de caracteres separada por espacios (un único punto de código Unicode). El explorador usa el primero que existe en la distribución del teclado de la computadora .</p> + +<p>La operación para activar el accesskey depende del explorador y su plataforma .</p> + +<table class="standard-table"> + <tbody> + <tr> + <th> </th> + <th>Windows</th> + <th>Linux</th> + <th>Mac</th> + </tr> + <tr> + <th>Firefox</th> + <td colspan="2" rowspan="1"><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>tecla</em></kbd></td> + <td>En Firefox 14 o posteriores, <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd><br> + En Firefox 13 o anteriores, <kbd>Control</kbd> + <kbd><em>tecla</em></kbd></td> + </tr> + <tr> + <th>Internet Explorer</th> + <td><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td> + <td colspan="2" rowspan="1">N/A</td> + </tr> + <tr> + <th>Google Chrome</th> + <td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td> + <td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td> + </tr> + <tr> + <th>Safari</th> + <td><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td> + <td>N/A</td> + <td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td> + </tr> + <tr> + <th>Opera</th> + <td colspan="3" rowspan="1"><kbd>Shift</kbd> + <kbd>Esc</kbd> abre una lista de contenidos , los cuales son accesibles a través de accesskey , después se puede elegir un item presionando <kbd><em>tecla</em></kbd></td> + </tr> + </tbody> +</table> + +<p>Notar que Firefox puede personalizar la tecla de modificación requerida por las preferencias del usuario .</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "interaction.html#the-accesskey-attribute", "accesskey")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el útlimo snapshot {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#the-accesskey-attribute", "accesskey")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "editing.html#the-accesskey-attribute", "accesskey")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}. De {{SpecName('HTML4.01')}}, varios caracteres pueden se pueden establecer como el accesskey . Tambien puede establecerse sobre cualquier elemento.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', "interact/forms.html#h-17.11.2", "accesskey")}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Solo soportado en {{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }} y {{ HTMLElement("textarea") }}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_con_exploradores">Compatibilidad con exploradores</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/autocapitalize/index.html b/files/es/web/html/atributos_globales/autocapitalize/index.html new file mode 100644 index 0000000000..d1f8fc446c --- /dev/null +++ b/files/es/web/html/atributos_globales/autocapitalize/index.html @@ -0,0 +1,50 @@ +--- +title: autocapitalización +slug: Web/HTML/Atributos_Globales/autocapitalize +tags: + - Atributos globales + - HTML + - Reference + - Referencia + - autocapitalización +translation_of: Web/HTML/Global_attributes/autocapitalize +--- +<p>{{HTMLSidebar("Global_attributes")}}</p> + +<p><span class="seoSummary">El {{web.link("/es/docs/Web/HTML/Global_attributes", "atributo global")}} {{HTMLAttrxRef("autocapitalize", "input")}} es un atributo enumerado que controla si la entrada de texto se escribe en mayúsculas automáticamente a medida que el usuario la introduce/edita.</span> El atributo debe tomar uno de los siguientes valores:</p> + +<ul> + <li><code>off</code> o <code>none</code>, no se aplica capitalización automática (todas las letras están predeterminadas en minúsculas)</li> + <li><code>on</code> o <code>sentences</code>, la primera letra de cada oración de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li> + <li><code>words</code>, la primera letra de cada palabra de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li> + <li><code>characters</code>, todas las letras de manera predeterminada deben estar en mayúsculas</li> +</ul> + +<p>El atributo {{HTMLAttrDef("autocapitalize")}} no afecta el comportamiento al escribir en un teclado físico. En cambio, afecta el comportamiento de otros mecanismos de entrada, como teclados virtuales en dispositivos móviles y entrada de voz. El comportamiento de tales mecanismos es que a menudo ayudan a los usuarios escribiendo en mayúscula automáticamente la primera letra de las oraciones. El atributo {{HTMLAttrDef("autocapitalize")}} permite a los autores redefinir ese comportamiento por elemento.</p> + +<p>El atributo {{HTMLAttrDef("autocapitalize")}} nunca hace que se habilite la autocapitalización para un elemento {{HTMLElement("input")}} con un atributo {{HTMLAttrxRef("type", "input")}} cuyo valor es {{HTMLAttrDef("url")}}, {{HTMLAttrDef("email")}} o {{HTMLAttrDef("password")}}.</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('HTML WHATWG', "interaction.html#autocapitalization", "autocapitalize")}}</td> + <td>{{ Spec2('HTML WHATWG') }}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2> + +<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div> + +<p>{{Compat("html.global_attributes.autocapitalize")}}</p> diff --git a/files/es/web/html/atributos_globales/class/index.html b/files/es/web/html/atributos_globales/class/index.html new file mode 100644 index 0000000000..ba82c66e65 --- /dev/null +++ b/files/es/web/html/atributos_globales/class/index.html @@ -0,0 +1,105 @@ +--- +title: class +slug: Web/HTML/Atributos_Globales/class +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/class +--- +<p>{{HTMLSidebar("Global_attributes")}}<br> + El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>class</strong> es una lista de las clases del elemento separada por espacios . Las clases permiten a CSS y Javascript seleccionar y acceder a elementos específicos a través de los <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors">selectores de clase</a> o funciones como el método {{domxref("document.getElementsByClassName")}} del DOM.</p> + +<p>Aunque la especificación no define los requerimientos para el nombre de las clases , se alienta a los desarrolladores web a usar nombres que describan el propósito semántico del elemento, en lugar de la presentación del elemento (e.g., <em>atributo </em>para describir un atributo en lugar de <em>itálica, </em>aunque un elemento de esta clase puesde ser presentado por <em>itálica</em>). Los nombres semanticos permanecen lógicos incluso si la presentación de la página cambia .</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "elements.html#classes", "class")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "elements.html#classes", "class")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "elements.html#classes", "class")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName('HTML4.01')}}, <code>class</code> es ahora un verdadero atributo global .</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', "struct/global.html#h-7.5.2", "class")}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Soportado en todos los elementos pero {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }} [1]</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitca</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }} [1]</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] <strong>class</strong> es un atributo global verdadero solo desde Firefox 32.</p> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/contenteditable/index.html b/files/es/web/html/atributos_globales/contenteditable/index.html new file mode 100644 index 0000000000..9db8119af2 --- /dev/null +++ b/files/es/web/html/atributos_globales/contenteditable/index.html @@ -0,0 +1,107 @@ +--- +title: contenteditable +slug: Web/HTML/Atributos_Globales/contenteditable +tags: + - Atributos globales + - HTM + - Referencia +translation_of: Web/HTML/Global_attributes/contenteditable +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>contenteditable</strong> es un atributo enumerado que indica si el elemento debe de ser editable por el usuario . Si es así, el explorador modifca su widget para permitir la edición . El atributo debe de tener alguno de los siguientes valores :</p> + +<ul> + <li><span><code>true</code> </span> o una string vacia , que indica que el elemento debe de ser editable .</li> + <li><span><code>false</code> </span> , que indica que el elemento no debe ser editable.</li> +</ul> + +<p>Si este atributo no se establece , el valor de default es <em>heredado </em>de su elemento padre .</p> + +<p>Este es un atributo enumerado y no uno <em>booleano .</em> Esto significa que el uso explicito de uno de los valores <code>true , false </code>o la cadena vacía es obligatorio y que una código como <code><label contenteditable>Example Label</label></code> no esta permitido . El uso correcto es <code><label contenteditable="true">Example Label</label></code>.</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "editing.html#attr-contenteditable", "contenteditable")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#attr-contenteditable", "contenteditable")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "editing.html#attr-contenteditable", "contenteditable")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatiblidad_en_exploradores">Compatiblidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("1.9") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("1.9") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li> + <li>{{domxref("HTMLElement.contentEditable")}} and {{domxref("HTMLElement.isContentEditable")}}</li> +</ul> diff --git a/files/es/web/html/atributos_globales/contextmenu/index.html b/files/es/web/html/atributos_globales/contextmenu/index.html new file mode 100644 index 0000000000..9cc32f7ace --- /dev/null +++ b/files/es/web/html/atributos_globales/contextmenu/index.html @@ -0,0 +1,139 @@ +--- +title: contextmenu +slug: Web/HTML/Atributos_Globales/contextmenu +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/contextmenu +--- +<p>{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>contextmenu </strong>es el <a href="/es/docs/Web/HTML/Atributos_Globales/id"><strong>id</strong></a> de un {{HTMLElement("menu")}} para nosotros como el menu contextual para este elemento .</p> + +<p>Un <em>menu contextual </em>es un menu que aparece sobre la interacción del usuario , como por ejemplo un click derecho . HTML5 ahora permite modificar este menú . Aquí hay unos ejemplos de implementación , incluyendo menús anidados .</p> + +<div id="ContextMenu_Example"> +<h2 id="Ejemplo">Ejemplo</h2> + +<p> </p> + +<pre class="brush:html; highlight:[1,10,15]"><body contextmenu="share"> + <menu type="context" id="share"> + <menu label="share"> + <menuitem label="Twitter" onclick="window.open('https://twitter.com/intent/tweet?text=Hurra! Estos aprendiendo sobre ContextMenuI en MDN a través de Mozilla ');"></menuitem> + <menuitem label="Facebook" onclick="window.open('https://facebook.com/sharer/sharer.php?u=https://https://developer.mozilla.org/en/HTML/Element/Using_HTML_context_menus');"></menuitem> + </menu> + </menu> + <ol> + <li>En cualquier parte del ejemplo puedes compartir la página en twitter y Facebook usando el menú de compartir de tu menú contextual.</li> + <li><pre contextmenu="changeFont" id="fontSizing">En este elemento específico de la lista , puedes cambiar el tamaño del texto usando las acciones "Incremenrar/Decrementar" de tu menú contextual ./pre></li> + <menu type="context" id="changeFont"> + <menuitem label="Increase Font" onclick="incFont()"></menuitem> + <menuitem label="Decrease Font" onclick="decFont()"></menuitem> + </menu> + <li contextmenu="ChangeImage" id="changeImage">En la imagen de abajo , puedes accionar la accion "Cambio de Imagen " en tu menú contextual .</li><br /> + <img src="https://developer.mozilla.org/media/img/promote/promobutton_mdn5.png" contextmenu="ChangeImage" id="promoButton" /> + <menu type="context" id="ChangeImage"> + <menuitem label="Change Image" onclick="changeImage()"></menuitem> + </menu> + </ol> +</body> +</pre> + +<p>en conjunto con este Javascript</p> + +<pre class="brush:js">function incFont(){ + document.getElementById("fontSizing").style.fontSize="larger"; +} +function decFont(){ + document.getElementById("fontSizing").style.fontSize="smaller"; +} +function changeImage(){ + var j = Math.ceil((Math.random()*39)+1); + document.images[0].src="https://developer.mozilla.org/media/img/promote/promobutton_mdn" + j + ".png"; +}</pre> + +<p>resulta en :</p> + +<div>{{EmbedLiveSample("ContextMenu_Example",550,200)}}</div> +</div> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "forms.html#attr-contextmenu", "contextmenu")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "interactive-elements.html#context-menus", "contextmenu")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatGeckoDesktop(9) }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatGeckoDesktop(20) }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/data-_star_/index.html b/files/es/web/html/atributos_globales/data-_star_/index.html new file mode 100644 index 0000000000..436b156299 --- /dev/null +++ b/files/es/web/html/atributos_globales/data-_star_/index.html @@ -0,0 +1,108 @@ +--- +title: data-* +slug: Web/HTML/Atributos_Globales/data-* +translation_of: Web/HTML/Global_attributes/data-* +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>Los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> <strong>data-* </strong>forman una clase de atributos , llamados atributos de datos modificables , permite a la información propietaria ser intercambiada entre el <a href="/es/docs/Web/HTML">HTML</a> y su representación en el <a href="/es/docs/Referencia_DOM_de_Gecko">DOM</a> que puede ser usada por scripts . Todos esos datos modificables están disponibles a través de la interface del elemento {{domxref("HTMLElement")}} , el atributo se establece encendido . La propiedad {{domxref("HTMLElement.dataset")}} otorga acceso a ellos . </p> + +<p>El * puede ser remplazado por cualquier nombre siguiedo las<a href="http://www.w3.org/TR/REC-xml/#NT-Name"> reglas de producción de nombres xml</a> con las siguientes restricciones :</p> + +<ul> + <li>el nombre no debe de empezar con <code>xml</code> , cualquiera sea el caso usado para estas letras.</li> + <li>el nombre no debe de contener algún punto y coma (<code>U+003A</code>) .</li> + <li>el nombre no debe de contener letras mayúsculas de la A a la Z .</li> +</ul> + +<p>Notar que la propiedad {{domxref("HTMLElement.dataset")}} es un {{domxref("StringMap")}} y que el nombre del atributo de datos modificable<em>data-test-value </em>será accesible a través de <code>HTMLElement.dataset.testValue </code>como cualquier guión (<code>U+002D</code>) es reemplazado por la versión en mayúscula de la siguiente letra (camelcase) . </p> + + + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table" style="line-height: 1.5;"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop(6) }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile(6) }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="sect1"></h2> + +<h2 id="Ver_también">Ver también </h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li> + <li>La propiedad {{domxref("HTMLElement.dataset")}} que permite el acceso y modifica estos valores .</li> +</ul> diff --git a/files/es/web/html/atributos_globales/dir/index.html b/files/es/web/html/atributos_globales/dir/index.html new file mode 100644 index 0000000000..4bcd43eb40 --- /dev/null +++ b/files/es/web/html/atributos_globales/dir/index.html @@ -0,0 +1,122 @@ +--- +title: dir +slug: Web/HTML/Atributos_Globales/dir +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/dir +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a>dir es un atributo enumerado que indica la direccionalidad del texto de los elementos . Puede tener los siguientes valores : </p> + +<ul> + <li><code>ltr ,</code> significa <em>izquierda</em> a <em>derecha</em> y es usado para los lenguajes que son escritos de izquierda a derecha ( como el Inglés ) .</li> + <li><code>rtl , </code>significa <em>derecha</em> a <em>izquierda</em> y es usado para los lenguajes que son escritos de la derecha a la izquierda (como el árabe ) .</li> + <li><code>auto , </code>permite al agente usuario decidir . Usa un algoritmo básico mientras parsea los caracteres dentro de un elemento hasta que encuentra un elemento con una direccionalidad fuerte , después aplica esa direccionalidad a todo el elemento .</li> +</ul> + +<div class="note"> +<p><span style="font-size: 14px; line-height: 21px;"><strong>Notas de uso</strong></span></p> + +<p>Este atributo es obligatorio para el elemento {{ HTMLElement("bdo") }} donde este tiene un significado semántico diferente.</p> + +<ul> + <li>Este atributo no es heredado por el elemento {{ HTMLElement("bdi") }} . Si no se establece , su valor es <code>auto</code> .</li> + <li>Este atributo puede ser anulado por las propiedades de CSS {{ cssxref("direction") }} y {{ cssxref("unicode-bidi") }} , si una página CSS está activa y el elemento soporta estas propiedades.</li> + <li>Mientras la direccionalidad del texto esté semánticamente relacionada con su contenido y no con su presentación , se recomienda que los desarrolladores web usen este atributo en lugar de propiedades de CSS relacionadas , cuando sea posible . De esta forma , el texto se mostrará correctamente incluso en un explorador que no soporte CSS o que tenga CSS desactivado .</li> + <li>El valor <code>auto</code> debe de ser usada para datos con una direccionalidad desconocida , com datos procedentes de la entrada de usuario , eventualmente almacenados en una base de datos .</li> +</ul> +</div> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-dir-attribute", "dir")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-dir-attribute", "dir")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-dir-attribute", "dir")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, desde {{SpecName('HTML4.01')}} añadió el valor auto y ahora es un verdadero atributo global .</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', "dirlang.html#h-8.2", "dir")}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Soportado en todos los elementos pero no en {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, y {{HTMLElement("script")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<h2 id="CompatibilityTable()"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{ CompatibilityTable() }}</span></h2> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracteristica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a></li> + <li>{{domxref("HTMLElement.dir")}} que refleja este atributo .</li> +</ul> diff --git a/files/es/web/html/atributos_globales/draggable/index.html b/files/es/web/html/atributos_globales/draggable/index.html new file mode 100644 index 0000000000..2aee2d8443 --- /dev/null +++ b/files/es/web/html/atributos_globales/draggable/index.html @@ -0,0 +1,108 @@ +--- +title: draggable +slug: Web/HTML/Atributos_Globales/draggable +tags: + - Atributos globales + - Experimental + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/draggable +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a>draggable es un atributo enumerado que indica si el elemento puede ser arrastrado , usando el {{domxref("HTML_Drag_and_Drop_API","HTML Drag and Drop API")}} . Puede tener los siguientes valores :</p> + +<ul> + <li><code>true</code> , indica que el elemento puede ser arrastrado.</li> + <li><code>false</code>, indica que el elemento no puede ser arrastrado .</li> +</ul> + +<p>Si este atriuto no se establece , su valor por default es <code>auto</code> , significando que el comportamiento debe de ser el definido por default en el explorador .</p> + +<p>Este es un atributo <em>enumerado </em> y no uno <em>booleano</em> . Esto signigica que el uso explícito de uno de los valores <em>true </em>o <em>false </em>es obligatorio y que una declaración como <code><label draggable>Example Label</label> </code>no está permitida . El uso correcto es <code><label draggable="true">Example Label</label></code>.</p> + +<p>Por default , unicamente el texto , las imagenes y los vínculos pueden ser arrastrados . Para todos los demás elementos el evento <strong>{{domxref('GlobalEventHandlers.ondragstart','ondragstart')}}</strong> debe de ser establecido para el mecanismo de arrastrar y soltar para que funcione , como se muestra en este <a href="/en-US/docs/DragDrop/Drag_Operations" title="https://developer.mozilla.org/En/DragDrop/Drag_Operations">ejempl</a>o .</p> + +<p> </p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "interaction.html#the-draggable-attribute", "draggable")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#the-draggable-attribute", "draggable")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial .</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<h2 id="CompatibilityTable()"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{ CompatibilityTable() }}</span></h2> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("1.8.1") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("1.8.1") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p> </p> + +<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>Ver también</strong></span></p> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales </a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/dropzone/index.html b/files/es/web/html/atributos_globales/dropzone/index.html new file mode 100644 index 0000000000..27abb8f133 --- /dev/null +++ b/files/es/web/html/atributos_globales/dropzone/index.html @@ -0,0 +1,99 @@ +--- +title: dropzone +slug: Web/HTML/Atributos_Globales/dropzone +tags: + - Atributos globales + - Experimental + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/dropzone +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p> + +<p>El atributo global <strong>dropzone </strong>es un atributo enumerado que indica qué los tipos de contenido pueden ser soltados en un elemento , usando la <a href="/es/docs/DragDrop/Drag_and_Drop">API Drag and Drop</a> . Pueden tener los siguientes valores :</p> + +<ul> + <li>copy , indica que el soltado creará una copia del elemento que fue arrastrado .</li> + <li>move , indica que el elemento que fue arrastrado será movido a su nueva localización .</li> + <li>link, indica que creara un link para el dato arrastrado.</li> +</ul> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "interaction.html#the-dropzone-attribute", "dropzone")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#the-dropzone-attribute", "dropzone")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial .</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico </td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Cataracterística</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown}}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_también">Ver también </h2> + +<ul> + <li>Tos los atributos globales </li> +</ul> diff --git a/files/es/web/html/atributos_globales/hidden/index.html b/files/es/web/html/atributos_globales/hidden/index.html new file mode 100644 index 0000000000..bc29d88b5a --- /dev/null +++ b/files/es/web/html/atributos_globales/hidden/index.html @@ -0,0 +1,107 @@ +--- +title: hidden +slug: Web/HTML/Atributos_Globales/hidden +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/hidden +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales/">atributo global</a> <strong>hidden</strong> es un atributo Booleano que indica que el elemento todavía no está , o ya no es relevante . Por ejemplo , puede ser usado para ocultar elelementos de la página que no pueden ser usados hasta que el proceso de login se haya completado . El explorador no dibujará dichos elementos .</p> + +<p>Esta atributo no debe de usarse para ocultar contenido que pudera ser legítimamente mostrado . Por ejemplo , no debe de ser usado para ocultar paneles de pestañas o una interfaz con pestañas , ya que esta es una decisión de estilo y otro estilo mostrandolos lo llevaría a una página perfectamente mostrada .</p> + +<p>Los elementos ocultos no deben de ser vinculados desde elementos no ocultos y elementos que son descendientes de un elemento oculto todavía activo ; lo que significa que los elementos del script pueden todavía ejecutarse y los elementos de formulario pueden todavía enviarse .</p> + +<div class="note"> +<p><strong>Nota:</strong> Cambiando el valor de la propiedad CSS {{cssxref("display")}} de un elemento con el atributo <code>hidden</code> sobrecarga el comportamiento . For ejemplo , un elemeneto diseñado <code>display : flex </code>será mostrado en la pantalla independientemente de que el atributo <code>hidden </code>esté presente .</p> +</div> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "interaction.html#the-hidden-attribute", "hidden")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "rendering.html#hiddenCSS", "Hidden elements")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> + <p>Define el dibujado por default sugerido del atributo hidden usando CSS</p> + </td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "hidden")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>11</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>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>4</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("2") }}</td> + <td>11</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_también">Ver también </h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales/">atributos globales</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/id/index.html b/files/es/web/html/atributos_globales/id/index.html new file mode 100644 index 0000000000..3dd947cf27 --- /dev/null +++ b/files/es/web/html/atributos_globales/id/index.html @@ -0,0 +1,113 @@ +--- +title: id +slug: Web/HTML/Atributos_Globales/id +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/id +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <strong>id</strong> define un identificador único (ID) el cual no debe repetirse en todo el documento. Su propósito es identificar el elemento al vincularlo (usando un identificador de fragmento), en scripts u hojas de estilo (con CSS).</p> + +<p>El valor de este atributo es una cadena de caracteres opaca: es decir, el autor del sitio no debe usarlo para proporcionar información. De forma particular, en sentido semántico por ejemplo, no debe ser derivado de la misma cadena.</p> + +<p>El valor de este atributo no debe contener espacios en blanco. Los navegadores tratan los IDs que contienen espacios en blanco como si los espacios fueran parte del ID. En contraste con el atributo <strong>class</strong>, el cual permite valores separados por espacios, los elementos pueden tener sólo un ID definido mediante el atributo ID. Tenga en cuenta que un elemento puede tener muchos ID, pero los demás deben ser definidos de otra forma, como por medio de un script interactuando con el DOM.</p> + +<div class="note"> +<p><strong>Nota:</strong> El uso de caracteres a excepción de letras en ASCII, dígitos, '_', <code>'-'</code> y <code>'.'</code> pueden ocasionar problemas de compatibilidad, por no ser permitidos en HTML 4. A pesar de que esta limitación ha sido removida en HTML 5, un ID debe iniciar con una letra para asegurar la compatibilidad.</p> +</div> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estado</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-id-attribute", "id")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambios desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-id-attribute", "id")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambios de {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-id-attribute", "id")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, ahora acepta <code>'_'</code>, <code>'-'</code> and <code>'.'</code> si no se encuentra al principio del id. También es un atributo global verdadero.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/global.html#adef-id', 'id')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Soportado en todos los elementos a excepción de {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Atributo</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}[1]</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Atributo</th> + <th>Android</th> + <th>Chrome para Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}[1]</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] <strong>class</strong> es un atributo global verdadero desde Firefox 32.</p> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li>Todos los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</li> + <li>{{domxref("Element.id")}} que se asemeja a este atributo.</li> +</ul> diff --git a/files/es/web/html/atributos_globales/index.html b/files/es/web/html/atributos_globales/index.html new file mode 100644 index 0000000000..86769245c6 --- /dev/null +++ b/files/es/web/html/atributos_globales/index.html @@ -0,0 +1,199 @@ +--- +title: Atributos globales +slug: Web/HTML/Atributos_Globales +tags: + - Atributos globales + - HTML + - Referencia + - Web +translation_of: Web/HTML/Global_attributes +--- +<div>{{HTMLSidebar("Atributos_globales")}}</div> + +<p class="summary"><span class="seoSummary">Los <strong>atributos globales</strong> son atributos comunes a todos los elementos HTML; se pueden usar en todos los elementos, aunque es posible que no tengan ningún efecto en algunos elementos.</span></p> + +<p>Los atributos globales se pueden especificar en todos los {{web.link("/es/docs/Web/HTML/Element", "elementos HTML")}}, <em>incluso aquellos no especificados en el estándar</em>. Eso significa que cualquier elemento no estándar debe permitir estos atributos, aunque el uso de esos elementos significa que el documento ya no es compatible con HTML5. Por ejemplo, los navegadores compatibles con HTML5 ocultan el contenido marcado como <code><foo hidden>...</foo></code>, aunque <code><foo></code> no sea un elemento HTML válido.</p> + +<p>Además de los atributos globales HTML básicos, también existen los siguientes atributos globales:</p> + +<ul> + <li>{{HTMLAttrDef("xml:lang")}} y {{HTMLAttrDef("xml:base")}} — estos se heredan de las especificaciones XHTML y están en desuso, pero se mantienen por motivos de compatibilidad.</li> + <li>Los múltiples atributos <code><strong>{{web.link("/es/docs/Web/Accessibility/ARIA", "aria-*")}}</strong></code>, utilizados para mejorar la accesibilidad.</li> + <li>Los atributos de {{web.link("/es/docs/Web/Guide/Events/Event_handlers", "control de eventos")}}: <code><strong>onabort</strong></code>, <code><strong>onautocomplete</strong></code>, <code><strong>onautocompleteerror</strong></code>, <code><strong>onblur</strong></code>, <code><strong>oncancel</strong></code>, <code><strong>oncanplay</strong></code>, <code><strong>oncanplaythrough</strong></code>, <code><strong>onchange</strong></code>, <code><strong>onclick</strong></code>, <code><strong>onclose</strong></code>, <code><strong>oncontextmenu</strong></code>, <code><strong>oncuechange</strong></code>, <code><strong>ondblclick</strong></code>, <code><strong>ondrag</strong></code>, <code><strong>ondragend</strong></code>, <code><strong>ondragenter</strong></code>, <code><strong>ondragexit</strong></code>, <code><strong>ondragleave</strong></code>, <code><strong>ondragover</strong></code>, <code><strong>ondragstart</strong></code>, <code><strong>ondrop</strong></code>, <code><strong>ondurationchange</strong></code>, <code><strong>onemptied</strong></code>, <code><strong>onended</strong></code>, <code><strong>onerror</strong></code>, <code><strong>onfocus</strong></code>, <code><strong>oninput</strong></code>, <code><strong>oninvalid</strong></code>, <code><strong>onkeydown</strong></code>, <code><strong>onkeypress</strong></code>, <code><strong>onkeyup</strong></code>, <code><strong>onload</strong></code>, <code><strong>onloadeddata</strong></code>, <code><strong>onloadedmetadata</strong></code>, <code><strong>onloadstart</strong></code>, <code><strong>onmousedown</strong></code>, <code><strong>onmouseenter</strong></code>, <code><strong>onmouseleave</strong></code>, <code><strong>onmousemove</strong></code>, <code><strong>onmouseout</strong></code>, <code><strong>onmouseover</strong></code>, <code><strong>onmouseup</strong></code>, <code><strong>onmousewheel</strong></code>, <code><strong>onpause</strong></code>, <code><strong>onplay</strong></code>, <code><strong>onplaying</strong></code>, <code><strong>onprogress</strong></code>, <code><strong>onratechange</strong></code>, <code><strong>onreset</strong></code>, <code><strong>onresize</strong></code>, <code><strong>onscroll</strong></code>, <code><strong>onseeked</strong></code>, <code><strong>onseeking</strong></code>, <code><strong>onselect</strong></code>, <code><strong>onshow</strong></code>, <code><strong>onsort</strong></code>, <code><strong>onstalled</strong></code>, <code><strong>onsubmit</strong></code>, <code><strong>onsuspend</strong></code>, <code><strong>ontimeupdate</strong></code>, <code><strong>ontoggle</strong></code>, <code><strong>onvolumechange</strong></code>, <code><strong>onwaiting</strong></code>.</li> +</ul> + +<h2 id="Lista_de_atributos_globales">Lista de atributos globales</h2> + +<dl> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/accesskey", "accesskey")}}</code></strong></dt> + <dd>Proporciona una pista para generar un atajo de teclado para el elemento actual. Este atributo consta de una lista de caracteres separados por espacios. El navegador debe utilizar el primero que exista en la distribución del teclado del ordenador.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/autocapitalize", "autocapitalize")}}</code></strong></dt> + <dd>Controla si la entrada de texto se pone en mayúsculas automáticamente a medida que el usuario la introduce o edita. Puede tener los siguientes valores: + <ul> + <li><code>off</code> o <code>none</code>, no se aplica capitalización automática (todas las letras están predeterminadas en minúsculas)</li> + <li><code>on</code> o <code>sentences</code>, la primera letra de cada oración de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li> + <li><code>words</code>, la primera letra de cada palabra de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li> + <li><code>characters</code>, todas las letras de manera predeterminada deben estar en mayúsculas</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/class", "class")}}</code></strong></dt> + <dd>Una lista separada por espacios de las clases del elemento. Las clases permiten que CSS y JavaScript seleccionen y accedan a elementos específicos a través de los {{web.link("/es/docs/Web/CSS/Class_selectors", "selectores de clase")}} o funciones como el método {{DOMxRef("document.getElementsByClassName()")}}.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/contenteditable", "contenteditable")}}</code></strong></dt> + <dd>Un atributo enumerado que indica si el usuario debe poder editar el elemento. Si es así, el navegador modifica su «<em>widget</em>» para permitir la edición. El atributo debe tomar uno de los siguientes valores: + <ul> + <li><code>true</code> o la <em>cadena vacía</em>, la cual indica que el elemento debe ser editable;</li> + <li><code>false</code>, el cual indica que el elemento no debe ser editable.</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/contextmenu", "contextmenu")}}</code></strong> {{Obsolete_Inline}}</dt> + <dd>El {{anch("attr-id", "id")}} de un {{HTMLElement ("menu")}} para usar como el menú contextual para este elemento.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/data-*", "data-*")}}</code></strong></dt> + <dd>Forma una clase de atributos, denominados atributos de datos personalizados, que permiten el intercambio de información de propiedad entre el {{web.link("/es/docs/Web/HTML", "HTML")}} y su representación {{Glossary("DOM")}} que pueden utilizar los scripts. Todos estos datos personalizados están disponibles a través de la interfaz {{DOMxRef("HTMLElement")}} del elemento en el que está configurado el atributo. La propiedad {{DOMxRef("HTMLElement.dataset")}} les da acceso.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/dir", "dir")}}</code></strong></dt> + <dd>Un atributo enumerado que indica la direccionalidad del texto del elemento. Puede tener los siguientes valores: + <ul> + <li><code>ltr</code>, que significa <em>de izquierda a derecha</em> y s debe usar para idiomas que se escriben de izquierda a derecha (tal como el Español);</li> + <li><code>rtl</code>, que significa <em>de derecha a izquierda</em> y se utiliza para idiomas que se escriben de derecha a izquierda (tal como el Árabe);</li> + <li><code>auto</code>, permite que el agente de usuario decida. Utiliza un algoritmo básico ya que analiza los caracteres dentro del elemento hasta que encuentra un carácter con una direccionalidad fuerte, luego aplica esa direccionalidad a todo el elemento.</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/draggable", "draggable")}}</code></strong></dt> + <dd>Un atributo enumerado que indica si el elemento se puede arrastrar mediante la {{web.link("/es/docs/DragDrop/Drag_and_Drop", "API de arrastrar y soltar")}}. Puede tener los siguientes valores: + <ul> + <li><code>true</code>, indica que el elemento se puede arrastrar</li> + <li><code>false</code>, indica que el elemento <strong>no</strong> se puede arrastrar.</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/dropzone", "dropzone")}}</code></strong> {{deprecated_inline}}</dt> + <dd>Un atributo enumerado que indica qué tipos de contenido se pueden colocar en un elemento, utilizando la {{web.link("/es/docs/DragDrop/Drag_and_Drop", "API de arrastrar y soltar")}}. Puede tener los siguientes valores: + <ul> + <li><code>copy</code>, indica que soltar creará una copia del elemento que se arrastró</li> + <li><code>move</code>, indica que el elemento que se arrastró se moverá a esta nueva ubicación.</li> + <li><code>link</code>, creará un enlace a los datos arrastrados.</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/exportparts", "exportparts")}}</code></strong> {{Experimental_Inline}}</dt> + <dd>Se utiliza para exportar de forma transitiva partes de sombras de un árbol de sombras anidado a un árbol contenedor de luz.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/hidden", "hidden")}}</code></strong></dt> + <dd>Un atributo booleano indica que el elemento aún no es o ya no es <em>relevante</em>. Por ejemplo, se puede utilizar para ocultar elementos de la página que no se pueden utilizar hasta que se haya completado el proceso de inicio de sesión. El navegador no representará tales elementos. Este atributo no se debe utilizar para ocultar contenido que se podría mostrar legítimamente.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/id", "id")}}</code></strong></dt> + <dd>Define un identificador (ID) único que debe ser único en todo el documento. Su propósito es identificar el elemento al vincularlo (usando un identificador de fragmento), al escribir un script o al aplicarle estilo (con CSS).</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/inputmode", "inputmode")}}</code></strong></dt> + <dd>Proporciona una pista a los navegadores sobre el tipo de configuración de teclado virtual que se debe utilizar al editar este elemento o su contenido. Se usa principalmente en elementos {{HTMLElement("input")}}, pero se puede usar en cualquier elemento mientras esté en modo {{HTMLAttrxRef("contenteditable")}}.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/is", "is")}}</code></strong></dt> + <dd>Te permite especificar que un elemento HTML estándar se debe comportar como un elemento integrado personalizado registrado (consulta {{web.link("/es/docs/Web/Web_Components/Using_custom_elements", "Uso de elementos personalizados")}} para obtener más detalles).</dd> +</dl> + +<div class="note"> +<p><strong>Nota</strong>: Los atributos <code>item*</code> son parte de <a class="external" href="https://html.spec.whatwg.org/multipage/microdata.html#microdata">Función de microdatos HTML de WHATWG</a>.</p> +</div> + +<dl> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemid", "itemid")}}</code></strong></dt> + <dd>El identificador único y global de un artículo.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemprop", "itemprop")}}</code></strong></dt> + <dd>Se usa para agregar propiedades a un elemento. Se puede especificar a cada elemento HTML un atributo <code>itemprop</code>, donde un <code>itemprop</code> consiste en un par de nombre y valor.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemref", "itemref")}}</code></strong></dt> + <dd>Las propiedades que no son descendientes de un elemento con el atributo <code>itemscope</code> se pueden asociar con el elemento usando un <code>itemref</code>. Proporciona una lista de IDs de elementos (no <code>itemid</code>s) con propiedades adicionales en otras partes del documento.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemscope", "itemscope")}}</code></strong></dt> + <dd><code>itemscope</code> (normalmente) funciona junto con {{HTMLAttrxRef("itemtype")}} para especificar que el HTML contenido en un bloque es sobre un elemento en particular. <code>itemscope</code> crea el «<em>Item</em>» y define el alcance del <code>itemtype</code> asociado con él. <code>itemtype</code> es una URL válida de un vocabulario (tal como <a class="external external-icon" href="https://schema.org/">schema.org</a>) que describe el elemento y las propiedades de su contexto.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemtype", "itemtype")}}</code></strong></dt> + <dd>Especifica la URL del vocabulario que se utilizará para definir <code>itemprop</code>s (propiedades del elemento) en la estructura de datos. {{HTMLAttrxRef("itemscope")}} se utiliza para establecer el alcance de la estructura de datos en la que estará activo el vocabulario establecido por <code>itemtype</code>.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/lang", "lang")}}</code></strong></dt> + <dd>Ayuda a definir el idioma de un elemento: el idioma en el que se encuentran los elementos no editables o el idioma en el que el usuario debe escribir los elementos editables. El atributo contiene una “etiqueta de idioma” (compuesta de “subetiquetas de idioma” separadas por guiones) en el formato definido en <a class="external" href="https://www.ietf.org/rfc/bcp/bcp47.txt"><em>Etiquetas para identificar idiomas (BCP47)</em></a>. {{anch("attr-xml:lang", "xml:lang")}} tiene prioridad sobre él.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/part", "part")}}</code></strong></dt> + <dd>Una lista separada por espacios de los nombres de las partes del elemento. Los nombres de las partes permiten que CSS seleccione y aplique estilo a elementos específicos en la sombra de un árbol mediante el pseudoelemento {{CSSxRef("::part")}}.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/slot", "slot")}}</code></strong></dt> + <dd>Asigna un espacio en la sombra de un árbol {{web.link("/es/docs/Web/Web_Components/Shadow_DOM", "DOM de sombra")}} a un elemento: Un elemento con un atributo <code>slot</code> es asignado al espacio creado por el elemento {{HTMLElement("slot")}} cuyo valor del atributo {{HTMLAttrxRef("name", "slot")}} coincide con el valor del atributo <code>slot</code>.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/spellcheck", "spellcheck")}}</code></strong></dt> + <dd>Un atributo enumerado define si se puede verificar el elemento para detectar errores ortográficos. Puede tener los siguientes valores: + <ul> + <li><code>true</code>, el cual indica que, si es posible, el elemento se debe revisar para detectar errores ortográficos;</li> + <li><code>false</code>, indica que el elemento <strong>no</strong> se debe revisar para detectar errores ortográficos.</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/style", "style")}}</code></strong></dt> + <dd>Contiene declaraciones de estilo {{web.link("/en-US/docs/Web/CSS", "CSS")}} que se aplicarán al elemento. Ten en cuenta que se recomienda que los estilos se definan en un archivo o archivos separados. Este atributo y el elemento {{HTMLElement("style")}} principalmente tienen el propósito de permitir un estilo rápido, por ejemplo, con fines de prueba.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/tabindex", "tabindex")}}</code></strong></dt> + <dd>Un atributo entero que indica si el elemento puede tomar el foco de entrada (es <em>enfocable</em>), si debe participar en la navegación secuencial del teclado y, de ser así, en qué posición. Puede tomar varios valores: + <ul> + <li>un <em>valor negativo</em> significa que el elemento se debe poder enfocar, pero no debe ser accesible mediante la navegación secuencial del teclado;</li> + <li><code>0</code> significa que el elemento se debe poder enfocar y ser accesible a través de la navegación secuencial del teclado, pero su orden relativo está definido por la convención de la plataforma;</li> + <li>un <em>valor positivo</em> significa que el elemento se debe poder enfocar y ser accesible mediante la navegación secuencial del teclado; el orden en el que se enfocan los elementos es el valor creciente del {{anch("attr-tabindex", "tabindex")}}. Si varios elementos comparten el mismo <code>tabindex</code>, su orden relativo sigue sus posiciones relativas en el documento.</li> + </ul> + </dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/title", "title")}}</code></strong></dt> + <dd>Contiene un texto que representa información de advertencia relacionada con el elemento al que pertenece. Normalmente, pero no necesariamente, dicha información se puede presentar al usuario como información sobre herramientas.</dd> + <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/translate", "translate")}}</code></strong> {{Experimental_Inline}}</dt> + <dd>Un atributo enumerado que se utiliza para especificar si los valores de atributo de un elemento y los valores de sus hijos de nodo {{DOMxRef("Text")}} se deben traducir cuando la página está localizada, o si se deben dejar sin cambios. Puede tener los siguientes valores: + <ul> + <li>la cadena vacía y <code>yes</code>, indican que el elemento se traducirá.</li> + <li><code>no</code>, lo cual indica que el elemento <strong>no</strong> se traducirá.</li> + </ul> + </dd> +</dl> + +<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("HTML WHATWG", "dom.html#global-attributes", "Atributos globales")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName("CSS Shadow Parts", "#exposing")}}</td> + <td>{{Spec2("CSS Shadow Parts")}}</td> + <td>Se agregaron los atributos globales <code>part</code> y <code>exportparts</code>.</td> + </tr> + <tr> + <td>{{SpecName("HTML5.2", "dom.html#global-attributes", "Atributos globales")}}</td> + <td>{{Spec2("HTML5.2")}}</td> + <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML5.1")}}, se han añadido <code>itemid</code>, <code>itemprop</code>, <code>itemref</code>, <code>itemscope</code> y <code>itemtype</code>.</td> + </tr> + <tr> + <td>{{SpecName("HTML5.1", "dom.html#global-attributes", "Atributos globales")}}</td> + <td>{{Spec2("HTML5.1")}}</td> + <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML5 W3C")}}, ha sido añadido <code>contextmenu</code>, <code>draggable</code>, <code>dropzone</code> y <code>spellcheck</code>.</td> + </tr> + <tr> + <td>{{SpecName("HTML5 W3C", "dom.html#global-attributes", "Atributos globales")}}</td> + <td>{{Spec2("HTML5 W3C")}}</td> + <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML4.01")}}, se introduce el concepto de atributos globales y <code>dir</code>, <code>lang</code>, <code>style</code>, <code>id</code>, <code>class</code>, <code>tabindex</code>, <code>accesskey</code>, y <code>title</code> ahora son verdaderos atributos globales.<br> + <code>xml:lang</code> que inicialmente formaba parte de XHTML, ahora también forma parte de HTML.<br> + Se han agregado <code>hidden</code>, <code>data-*</code>, <code>contenteditable</code> y <code>translate</code>.</td> + </tr> + <tr> + <td>{{SpecName("HTML4.01")}}</td> + <td>{{Spec2("HTML4.01")}}</td> + <td>No hay atributos globales definidos. Varios atributos que se convertirán en atributos globales en especificaciones posteriores se definen en un subconjunto de elementos.<br> + <code>class</code> y <code>style</code> son compatibles con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.<br> + <code>dir</code> es compatible con todos los elementos excepto {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} y {{HTMLElement("script")}}.<br> + <code>id</code> es compatible con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.<br> + <code>lang</code> es compatible con todos los elementos excepto {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} y {{HTMLElement("script")}}.<br> + <code>tabindex</code> solo es compatible con {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.<br> + <code>accesskey</code> solo es compatible con {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{HTMLElement("label")}}, {{HTMLElement("legend")}} t {{HTMLElement("textarea")}}.<br> + <code>title</code> es compatibles con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}} y {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2> + +<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div> + +<p>{{Compat("html.global_attributes")}}</p> + +<h2 id="Ve_también">Ve también</h2> + +<ul> + <li>Las interfaces {{DOMxRef("Element")}} y {{DOMxRef("GlobalEventHandlers")}} que permiten consultar la mayoría de los atributos globales.</li> +</ul> diff --git a/files/es/web/html/atributos_globales/is/index.html b/files/es/web/html/atributos_globales/is/index.html new file mode 100644 index 0000000000..aa57cab27d --- /dev/null +++ b/files/es/web/html/atributos_globales/is/index.html @@ -0,0 +1,67 @@ +--- +title: is +slug: Web/HTML/Atributos_Globales/is +tags: + - Atributos globales + - HTML + - Referencia + - is +translation_of: Web/HTML/Global_attributes/is +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><span class="seoSummary">La construcción is <a href="/es/docs/Web/HTML/Atributos_Globales">global attribute</a> permite especificar que un elemento HTML estándar se debería comportar como un elemento personalizado provisto originalmente por el lenguaje (para más detalles, vea <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">Utilizando elementos personalizados</a>).</span></p> + +<p>Este atributo puede ser utilizado sólo si nombre del elemento personalizado especificado ha sido <a href="/en-US/docs/Web/API/CustomElementRegistry/define">definido</a> extósamente en el documento actual, y extiende el tipo de elemento al que está siendo aplicado.</p> + +<h2 id="Ejemplos">Ejemplos</h2> + +<p>El siguiente código fue tomado de nuestro ejemplo <a href="https://github.com/mdn/web-components-examples/tree/master/word-count-web-component">word-count-web-component</a> (<a href="https://mdn.github.io/web-components-examples/word-count-web-component/">véalo también en vivo</a>).</p> + +<pre class="brush: js">// Crea una clase para el elemento +class WordCount extends HTMLParagraphElement { + constructor() { + // Siempre llamar a super al comienzo del constructor + super(); + + // Contenido del constructor omitido para mayor brevedad + ... + + } +} + +// Define el nuevo elemento +customElements.define('word-count', WordCount, { extends: 'p' });</pre> + +<pre class="brush: html"><<span class="pl-ent">p</span> <span class="pl-e">is</span>=<span class="pl-s"><span class="pl-pds">"</span>word-count<span class="pl-pds">"</span></span>></<span class="pl-ent">p</span>></pre> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estado</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "custom-elements.html#attr-is", "is")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2> + +<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si desea contribuir a estos datos, por favor clone el repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div> + +<p>{{Compat("html.global_attributes.is")}}</p> + +<h2 id="Vea_también">Vea también</h2> + +<ul> + <li>Todos los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</li> +</ul> + +<p> </p> diff --git a/files/es/web/html/atributos_globales/itemid/index.html b/files/es/web/html/atributos_globales/itemid/index.html new file mode 100644 index 0000000000..72ce64456e --- /dev/null +++ b/files/es/web/html/atributos_globales/itemid/index.html @@ -0,0 +1,78 @@ +--- +title: itemid +slug: Web/HTML/Atributos_Globales/itemid +translation_of: Web/HTML/Global_attributes/itemid +--- +<h2 id="Resumen">Resumen</h2> + +<p>El atributo <strong>Itemid </strong>es un identificador global y único de un item.</p> + +<p>Los atributos Itemid attributes sólo se pueden especificar en elmentos que tiene atributos tanto de <strong>itemscope </strong>como <strong>itemtype</strong>. Además, el itemid sólo puede ser especficiado en elemento con un atributo itemscope cuyo correspondiente itemtype hace referencia o define un vocabulario que soporte identificadores globales.</p> + +<p>Un vocabulario de itemtype nos proporcionará el significado exacto de un identificador global definido dentro del vocabulario. El vocabulario definirá si varios item con el mismo identificador global puede co-existir y, si están permitidos, cómo item con el mismo identificador son gestionados.</p> + +<p class="note"><strong>Nota:</strong> La definición de itemid hecha por Whatwg.org dice que debe ser una URL. No parece que sea el caso de el ejemplo que se muestra más abajo. Sin embargo la definición de facto es que un itemid es un identificador único, así que los apropiado es URB. Esta inconsistencia refleja sin dudarlo la naturaleza incompleta de la espeficicación Microdata.</p> + +<h2 id="Ejemplo">Ejemplo</h2> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html"><dl itemscope + itemtype="http://vocab.example.net/book" + itemid="urn:isbn:0-330-34032-8"> +<dt>Título <dd itemprop="titulo">The Reality Dysfunction +<dt>Autor <dd itemprop="autor">Peter F. Hamilton +<dt>Fecha de publicación +<dd><time itemprop="fechapublicacion" datetime="26-01-1996">26 Enero 1996</time> </dl></pre> + +<h3 id="Datos_estructurados">Datos estructurados</h3> + +<table class="standard-table"> + <tbody> + <tr> + <td colspan="1" rowspan="14">itemscope</td> + <td>itemtype: itemid</td> + <td colspan="2" rowspan="1"> + <div class="jyrRxf-eEDwDf jcd3Mb IZ65Hb-hUbt4d"><span>http://vocab.example.net/book</span>: urn:isbn:0-330-34032-8</div> + </td> + </tr> + <tr> + <td>itemprop</td> + <td><span>titulo</span></td> + <td><span>The Reality Dysfunction</span></td> + </tr> + <tr> + <td>itemprop</td> + <td><span>autor</span></td> + <td> + <div class="jyrRxf-eEDwDf jcd3Mb"><span>Peter F. Hamilton</span></div> + </td> + </tr> + <tr> + <td>itemprop</td> + <td><span>fechapublicacion</span></td> + <td><span>26-01-1996</span></td> + </tr> + </tbody> +</table> + +<h3 id="Resultado">Resultado</h3> + +<p>{{ EmbedLiveSample('HTML', '', '', '', 'Web/HTML/Global_attributes/itemid') }}</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table" style="height: 105px; width: 490px;"> + <thead> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estad</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="https://html.spec.whatwg.org/multipage/microdata.html#attr-itemid">itemid</a></td> + <td>Nota WG - No está siendo ya activamente desarrollado.</td> + </tr> + </tbody> +</table> diff --git a/files/es/web/html/atributos_globales/itemprop/index.html b/files/es/web/html/atributos_globales/itemprop/index.html new file mode 100644 index 0000000000..232af938aa --- /dev/null +++ b/files/es/web/html/atributos_globales/itemprop/index.html @@ -0,0 +1,22 @@ +--- +title: itemprop +slug: Web/HTML/Atributos_Globales/itemprop +tags: + - atributo + - metatag +translation_of: Web/HTML/Global_attributes/itemprop +--- +<p style="margin: 0.5em 0px 0px 50px; padding-top: 0px; padding-bottom: 2px; color: rgb(58, 73, 86); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Tahoma, Arial, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">Podemos dar más información al motor de búsqueda acerca de imágenes o datos adentro de cualquier tipo de etiquetas , como las propiedades : actores , clasificación ,genero . Para etiquetar las propiedades de un elemento , usa el atributo itemprop . Por ejemplo , para identificar al actor de una película añadir itemprop="director" al elemento que encierra el nombre del director.</p> + +<p style="margin: 0.5em 0px 0px 50px; padding-top: 0px; padding-bottom: 2px; color: rgb(58, 73, 86); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Tahoma, Arial, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">Aquí hay un ejemplo .</p> + +<pre style="font-family: Courier, monospace; font-size: 14.4px; width: auto; padding: 0px 5px 2px 10px; margin: 0.5em 0px 0px 50px; text-align: left; overflow: auto; color: rgb(58, 73, 86); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-indent: 0px; text-transform: none; background: rgb(225, 225, 225);"><div itemscope itemtype="http://schema.org/Movie"> + <h1 <strong>itemprop="name"</strong>>Avatar</h1> + <span>Director: <span <strong>itemprop="director"</strong>>James Cameron</span> (born August 16, 1954)</span> + <span <strong>itemprop="genre"</strong>>Ciencia ficcion</span> + <a href="../movies/avatar-theatrical-trailer.html" <strong>itemprop="trailer"</strong>>Trailer</a> +</div></pre> + +<p> </p> + +<p> Para más información acerca de los atributos relacionados consultar https://schema.org/docs/gs.html</p> diff --git a/files/es/web/html/atributos_globales/itemref/index.html b/files/es/web/html/atributos_globales/itemref/index.html new file mode 100644 index 0000000000..9dac55140b --- /dev/null +++ b/files/es/web/html/atributos_globales/itemref/index.html @@ -0,0 +1,106 @@ +--- +title: itemref +slug: Web/HTML/Atributos_Globales/itemref +translation_of: Web/HTML/Global_attributes/itemref +--- +<h2 id="Resumen">Resumen</h2> + +<p>Las propiedades que no son descendientes de un elemento con el atributo <code>itemscope</code> pueden ser asociadas con el elemento usando un <strong>itemref</strong> . <strong>Itemref</strong> provee una lista de ids de los elementos (no <code>itemids</code>) con propiedades adicionales en otras partes dentro del documento .</p> + +<p>El atributo itemref puede ser solo especificado en elementos que tienen un atributo itemscope especificado .</p> + +<p class="note"><strong>Nota: </strong>el atributo itemref no es parte del modelo de micro datos . Es solamente un constructor sintáctico que ayuda a los autores en el ingreso de anotaciones a las páginas donde los datos que se van a anotar no siguen una estructura de arbol conveniente . Por ejemplo , permite a los autores marcar los datos en una tabla para que cada columna defina un item separado mientras se mantienen las propiedades en las celdas .</p> + +<div class="syntaxbox"> +<h2 class="syntaxbox" id="Ejemplo">Ejemplo</h2> + +<h3 id="HTML">HTML</h3> + +<div class="syntaxbox"> +<pre class="brush: html"><div itemscope id="amanda" itemref="a b"></div> +<p id="a">Name: <span itemprop="name">Amanda</span> </p> +<div id="b" itemprop="band" itemscope itemref="c"></div> +<div id="c"> + <p>Band: <span itemprop="name">Jazz Band</span> </p> + <p>Size: <span itemprop="size">12</span> players</p> +</div> +</pre> +</div> + +<article id="wikiArticle"> +<h3 id="Datos_estructurados">Datos estructurados </h3> + +<table class="standard-table"> + <tbody> + <tr> + <th>id's</th> + <th>itemscope</th> + <th>itemref</th> + <th> </th> + <th>(nombre de itemprop )</th> + <th>(valor de itemprop)</th> + </tr> + <tr> + <td>id=amanda</td> + <td>itemscope</td> + <td>itemref=a,b</td> + <td> </td> + <td> </td> + <td> </td> + </tr> + <tr> + <td>id=a</td> + <td> </td> + <td> </td> + <td>itemprop</td> + <td>name</td> + <td><span>Amanda</span></td> + </tr> + <tr> + <td>id=b</td> + <td>itemscope</td> + <td>itemref=c</td> + <td> </td> + <td>band</td> + <td> </td> + </tr> + <tr> + <td colspan="1" rowspan="2">id=c</td> + <td> </td> + <td> </td> + <td>itemprop</td> + <td>Band</td> + <td><span>Jazz Band</span></td> + </tr> + <tr> + <td> </td> + <td> </td> + <td>itemprop</td> + <td>Size</td> + <td><span>12</span></td> + </tr> + </tbody> +</table> + +<h3 id="Resultado">Resultado</h3> + +<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/HTML/Global_attributes/itemref') }}</p> + +<h2 id="EspecificaciónEditEdit">Especificación<a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-alternates$edit#Specifications"><span>Edit</span></a><a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemid$edit#SpecificationsEdit"><span>Edit</span></a></h2> + +<table class="standard-table" style="height: 105px; width: 490px;"> + <thead> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + </tr> + </thead> + <tbody> + <tr> + <td style="text-align: left; vertical-align: middle;"><a class="external-icon external" href="https://html.spec.whatwg.org/multipage/microdata.html#items">itemref</a></td> + <td style="text-align: left; vertical-align: middle; white-space: nowrap;">Nota WG - No se encuentra activamente en desarrollo</td> + </tr> + </tbody> +</table> +</article> +</div> diff --git a/files/es/web/html/atributos_globales/itemscope/index.html b/files/es/web/html/atributos_globales/itemscope/index.html new file mode 100644 index 0000000000..b57fc1c6bc --- /dev/null +++ b/files/es/web/html/atributos_globales/itemscope/index.html @@ -0,0 +1,284 @@ +--- +title: itemscope +slug: Web/HTML/Atributos_Globales/itemscope +tags: + - Ejemplo + - itemscope + - itemtype +translation_of: Web/HTML/Global_attributes/itemscope +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><code><strong>itemscope</strong></code> es un <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> booleano que define el scope asociado del metadata. Especificando el atributo <code><strong>itemscope</strong></code> en un elemento crea un nuevo item, cuyos resultados estan en los numeros de pares name-value asociados con el elemento. Un atributo relativo, {{htmlattrxref("itemtype")}}, es usado para especificar el URL valido de un medio/recipe (como lo es <a href="http://schema.org/">schema.org</a>) que describe que el item es de propiedad contextual. En cada uno de los siguientes ejemplos, el medio/recipe es de <a href="https://schema.org/">schema.org</a>.</p> + +<p>Todos los elementos HTML pueden tener un atributo <code>itemscope</code> especifico. Un elemento <code>itemscope</code> no tiene un asociado <code>itemtype</code> pero tiene un sociado <code>itemref</code>.</p> + +<div class="note"> +<p><strong>Nota:</strong> Encuentra mas acerca del atributo <code>itemtype</code> en <a href="http://schema.org/Thing">http://schema.org/Thing</a></p> +</div> + +<h3 id="Ejemplo_simple">Ejemplo simple</h3> + +<h4 id="HTML">HTML</h4> + +<p>El siguiente ejemplo especifica que el atributo <code>itemscope</code>. El ejemplo especificado en el <code>itemtype</code> es "http://schema.org/Movie", y especifica tres atributos <code>itemprop</code> relativos.</p> + +<pre class="brush:html"><div itemscope itemtype="http://schema.org/Movie"> + <h1 itemprop="nombre">Avatar</h1> + <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span> + <span itemprop="genero">Ciencia ficcion</span> + <a href="https://youtu.be/0AY1XIkX7bY" itemprop="trailer">Trailer</a> +</div> +</pre> + +<h4 id="sect1"> </h4> + +<h4 id="Esctructura_de_informacion">Esctructura de informacion</h4> + +<p>La siguiente tabla muestran los datos esctructurados mostrados en el anterior ejemplo.</p> + +<p> </p> + +<table class="standard-table"> + <tbody> + <tr> + <td rowspan="6">itemscope</td> + <td>Itemtype</td> + <td colspan="2">Movie</td> + </tr> + <tr> + <td>itemprop</td> + <td>(itemprop name)</td> + <td>(itemprop value)</td> + </tr> + <tr> + <td>itemprop</td> + <td>director</td> + <td>James Cameron</td> + </tr> + <tr> + <td>itemprop</td> + <td>genero</td> + <td>Ciencia Ficcion</td> + </tr> + <tr> + <td>itemprop</td> + <td>nombre</td> + <td>Avatar</td> + </tr> + <tr> + <td>itemprop</td> + <td>https://youtu.be/0AY1XIkX7bY</td> + <td>Trailer</td> + </tr> + </tbody> +</table> + +<h3 id="itemscope_Atributos_ID"><code>itemscope</code> Atributos ID</h3> + +<p>Cuando especificas el atributo <code>itemscope</code> para un elemento, un nuevo item es creado. El item consiste de un grupo de pares de name-value. Para elementos con un atributo <code>itemscope</code> y un atributo <code>itemtype</code>, podrias tambien especificar un {{htmlattrxref("id")}} attribute. Puedes usar el atributo <code>id</code> para establecer un identificador global para el nuevo item. Un identificador global permite que los items relativos a otros items encuentren paginas atraves de la Web.</p> + +<h3 id="Ejemplo">Ejemplo</h3> + +<p>Hay 4 atributos <code>itemscope</code> en el siguiente ejemplo. Cada atributo <code>itemscope</code> establecen el scope correspondiente a sus atributos <code>itemtype</code>. El <code>itemtype</code>s, <code>Recipe</code>, <code>AggregateRating</code>, y <code>NutritionInformation</code> en el siguiente ejemplo son parte de la informacion estructura por medio de <a href="www.schema.org">schema.org</a>, se especifico el primer <code>itemtype</code>, http://schema.org/Recipe.</p> + +<pre class="brush: html"><div itemscope itemtype="http://schema.org/Recipe"> +<h2 itemprop="name">Grandma's Holiday Apple Pie</h2> +<img itemprop="image" src="https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg" width="50" height="50"/> +<p>By <span itemprop="author" itemscope itemtype="http://schema.org/Person"> +<span itemprop="name">Carol Smith</p></span> +</span> +<p>Published: <time datetime="2009-11-05" itemprop="datePublished"> +November 5, 2009</p></time> +<span itemprop="description">This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.<br></span> + <span itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> + <span itemprop="ratingValue">4.0</span> stars based on <span itemprop="reviewCount">35</span> reviews<br></span> +Prep time: <time datetime="PT30M" itemprop="prepTime">30 min<br></time> + Cook time: <time datetime="PT1H" itemprop="cookTime">1 hour<br></time> + Total time: <time datetime="PT1H30M" itemprop="totalTime">1 hour 30 min<br></time> + Yield: <span itemprop="recipeYield">1 9" pie (8 servings)<br></span> + <span itemprop="nutrition" itemscope itemtype="http://schema.org/NutritionInformation"> + Serving size: <span itemprop="servingSize">1 medium slice<br></span> + Calories per serving: <span itemprop="calories">250 cal<br></span> + Fat per serving: <span itemprop="fatContent">12 g<br></span> +</span> +<p>Ingredients:<br> + <span itemprop="recipeIngredient">Thinly-sliced apples: 6 cups<br></span> + <span itemprop="recipeIngredient">White sugar: 3/4 cup<br></span> + ... </p> + +Directions: <br> + <div itemprop="recipeInstructions"> + 1. Cut and peel apples<br> + 2. Mix sugar and cinnamon. Use additional sugar for tart apples. <br> + ... + </div> +</div> </pre> + +<h3 id="Resultados">Resultados</h3> + +<h4 id="HTML_2">HTML</h4> + +<p>Los siguientes son un ejemplo renderizado resultado del codigo del anterior ejemplo.</p> + +<p>{{EmbedLiveSample('Example', '500', '550', '', 'Web/HTML/Global_attributes/itemscope')}}</p> + +<h4 id="Structured_data">Structured data</h4> + +<table class="standard-table"> + <tbody> + <tr> + <td colspan="1" rowspan="14">itemscope</td> + <td>itemtype</td> + <td colspan="2" rowspan="1">Medio/Recipe</td> + </tr> + <tr> + <td>itemprop</td> + <td>name</td> + <td>Grandma's Holiday Apple Pie</td> + </tr> + <tr> + <td>itemprop</td> + <td>image</td> + <td>https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg</td> + </tr> + <tr> + <td>itemprop</td> + <td>datePublished</td> + <td>2009-11-05</td> + </tr> + <tr> + <td>itemprop</td> + <td>description</td> + <td>This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.</td> + </tr> + <tr> + <td>itemprop</td> + <td>prepTime</td> + <td>PT30M</td> + </tr> + <tr> + <td>itemprop</td> + <td>cookTime</td> + <td>PT1H</td> + </tr> + <tr> + <td>itemprop</td> + <td>totalTime</td> + <td>PT1H30M</td> + </tr> + <tr> + <td>itemprop</td> + <td>recipeYield</td> + <td>1 9" pie (8 servings)</td> + </tr> + <tr> + <td>itemprop</td> + <td>recipeIngredient</td> + <td>Thinly-sliced apples: 6 cups</td> + </tr> + <tr> + <td>itemprop</td> + <td>recipeIngredient</td> + <td>White sugar: 3/4 cup</td> + </tr> + <tr> + <td>itemprop</td> + <td>recipeInstructions</td> + <td>1. Cut and peel apples 2. Mix sugar and cinnamon. Use additional sugar for tart apples .</td> + </tr> + <tr> + <td>itemprop</td> + <td colspan="2" rowspan="1">author [Person]</td> + </tr> + <tr> + <td>itemprop</td> + <td>name</td> + <td>Carol Smith</td> + </tr> + <tr> + <td colspan="1" rowspan="3">itemscope</td> + <td>itemprop[itemtype]</td> + <td colspan="2" rowspan="1">aggregateRating [AggregateRating]</td> + </tr> + <tr> + <td>itemprop</td> + <td>ratingValue</td> + <td>4.0</td> + </tr> + <tr> + <td>itemprop</td> + <td>reviewCount</td> + <td>35</td> + </tr> + <tr> + <td colspan="1" rowspan="4">itemscope</td> + <td>itemprop[itemtype]</td> + <td colspan="2" rowspan="1">nutrition [NutritionInformation]</td> + </tr> + <tr> + <td>itemprop</td> + <td>servingSize</td> + <td>1 medium slice</td> + </tr> + <tr> + <td>itemprop</td> + <td>calories</td> + <td>250 cal</td> + </tr> + <tr> + <td>itemprop</td> + <td>fatContent</td> + <td>12 g</td> + </tr> + </tbody> +</table> + +<div class="note"> +<p><strong>Note</strong>: Una herramienta practica para extraer estructuras microdata del HTML es<a href="https://developers.google.com/structured-data/testing-tool/"> Structured Data Testing Tool</a> de Google. Pruebalo en el HTML del ejemplo anterior.</p> +</div> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Especificaciones</th> + <th scope="col">Estados</th> + <th scope="col">Comentario</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML Microdata', "#dfn-itemscope", "itemscope")}}</td> + <td>{{Spec2('HTML Microdata')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "microdata.html#attr-itemscope", "itemscope")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Navegadores_compatibles">Navegadores compatibles</h2> + + + +<p>{{Compat("html.global_attributes.itemscope")}}</p> + +<h2 id="Ver_tambien">Ver tambien</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTML/Global_attributes">Otros atributos globales diferentes</a></li> + <li>Otro, microdata relativo, atributos globales: + <ul> + <li>{{htmlattrxref("itemid")}}</li> + <li>{{htmlattrxref("itemprop")}}</li> + <li>{{htmlattrxref("itemref")}}</li> + <li>{{htmlattrxref("itemscope")}}</li> + <li>{{htmlattrxref("itemtype")}}</li> + </ul> + </li> +</ul> diff --git a/files/es/web/html/atributos_globales/lang/index.html b/files/es/web/html/atributos_globales/lang/index.html new file mode 100644 index 0000000000..dcea33a66f --- /dev/null +++ b/files/es/web/html/atributos_globales/lang/index.html @@ -0,0 +1,108 @@ +--- +title: lang +slug: Web/HTML/Atributos_Globales/lang +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/lang +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>lang</strong> participa en la definición del lenguaje del elemento , el lenguaje en que están escritos los elementos no editables o el lenguaje en el cual los elementos editables deberían de estar escritos . La etiqueta contiene un valor sencillo de entrada en el formato que define el documento <a href="http://www.ietf.org/rfc/bcp/bcp47.txt">tags para identificar lenguajes </a><em><a href="http://www.ietf.org/rfc/bcp/bcp47.txt"> </a>(BCP47)</em> de la IETF . Si el contenido de la etiqueta es la <em>cadena vacía </em>, el lenguaje se establece como <em>desconocido</em> , si el contenido de la etiqueta no es válido respecto al documento BCP47 , se establece como <em>inválido . </em></p> + +<p>Incluso si el atributo <strong>lang </strong>está establecido , puede que no se tome en cuenta , ya que el atributo <strong>xml:lang </strong>tiene prioridad . Leer el algoritmo para determinar el lenguaje de el contenido de un elemento para ver como es determinado el lenguaje en todos los casos.</p> + +<p>Para la pseudo clase { cssxref(":lang") }} de CSS, dos nombres invalidos de lenguaje son diferentes si sus nombres son diferentes .</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, comportandose con <strong>xml:lang</strong> y el algoritmo de determinación del lenguaje . También es un verdadero atributo global .</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/dirlang.html#h-8.1', 'lang')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Soportado en todos los elementos menos en {HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, y {{HTMLElement("script")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="sect1"> </h2> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/slot/index.html b/files/es/web/html/atributos_globales/slot/index.html new file mode 100644 index 0000000000..ed2b8688db --- /dev/null +++ b/files/es/web/html/atributos_globales/slot/index.html @@ -0,0 +1,46 @@ +--- +title: slot +slug: Web/HTML/Atributos_Globales/slot +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/slot +--- +<div>{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</div> + +<p>El <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <strong>slot</strong> asigna un espacio en un <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a> árbol shadow a un elemento: Un elemento con un atributo <code>slot</code> es asignado al espacio creado por el elemento {{HTMLElement("slot")}} cuyo valor de atributo {{htmlattrxref("name", "slot")}} coincide con el valor de ese atributo <code>slot</code>.</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#attr-slot", "slot attribute")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG', "#dom-element-slot", "slot attribute")}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2> + +<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si le gustaría contribuir con estos datos, por favor clone el repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div> + +<p>{{Compat("html.global_attributes.slot")}}</p> + +<h2 id="Vea_también">Vea también</h2> + +<ul> + <li>Todos los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</li> +</ul> diff --git a/files/es/web/html/atributos_globales/spellcheck/index.html b/files/es/web/html/atributos_globales/spellcheck/index.html new file mode 100644 index 0000000000..c6ced2de46 --- /dev/null +++ b/files/es/web/html/atributos_globales/spellcheck/index.html @@ -0,0 +1,218 @@ +--- +title: spellcheck +slug: Web/HTML/Atributos_Globales/spellcheck +tags: + - Atributos globales + - Experimental + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/spellcheck +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>spellcheck</strong> es un atributo enumerado que define si el elemento debe de ser verificado por errores de deletreado. Puede tener los siguientes valores :</p> + +<ul> + <li><code>true , </code>que indica que elemento debe de ser checado para errores de deletreado si es posible .</li> + <li><code>false </code>, que indica que el elemento no debe de ser checado para errores de deletreado .</li> +</ul> + +<p>Si este atributo no está establecido , su valor por default es de tipo elemento y definido por el explorador . El valor por default puede der <em>heredado , </em>lo que significa que el contenido del elemento será checado para errores de deletreado solo si el ancestro más cercano tiene un estado de <em>spellcheck </em>con valor <code>true .</code></p> + +<p>Puedes consultar <a href="/es/docs/Control_de_la_corrección_ortográfica_en_formularios_HTML">este artículo</a> para ver un ejemplo comprensivo del uso de este atributo. <br> + </p> + +<p>Este es un atributo <em>enumerado </em>y no uno<em>Booleano </em>. Esto significa que el uso explícito de uno de los valores <code>true </code>o <code>false </code>es obligatorio y que una escritura como <code><label spellcheck>Example Label</label> </code>no está permitida . El uso correcto es <code><label spellcheck="true">Example Label</label></code>.</p> + +<p>Este atributo es meramente un indicio para el explorador : los exploradores no son obligados a tener disponibilidad para verificar los errores de deletreado , incluso si el atributo <strong>spellcheck</strong> es establecido como <code>true </code>y el explorador soporta verificación de deletreado .</p> + +<p>El valor por default de este atributo es dependiente del explorador y del elemento :</p> + +<table class="fullwidth-table" style="line-height: 1.5;"> + <tbody> + <tr> + <th>Explorador</th> + <th>{{ HTMLElement("html") }}</th> + <th>{{ HTMLElement("textarea") }}</th> + <th>{{ HTMLElement("input") }}</th> + <th>others</th> + <th>Comment</th> + </tr> + <tr> + <td rowspan="3">Firefox</td> + <td><code>false</code></td> + <td><code>false</code></td> + <td><code>false</code></td> + <td><em>inherited</em></td> + <td>When <code>layout.spellcheckDefault</code> is <code>0</code></td> + </tr> + <tr> + <td><strong><code>false</code></strong></td> + <td><strong><code>true</code></strong></td> + <td><strong><em>inherited</em></strong></td> + <td><strong><em>inherited</em></strong></td> + <td><strong>When <code>layout.spellcheckDefault</code> is <code>1</code> (default value)</strong></td> + </tr> + <tr> + <td><code>false</code></td> + <td><code>true</code></td> + <td><code>true</code></td> + <td><em>inherited</em></td> + <td>When <code>layout.spellcheckDefault</code> is <code>2</code></td> + </tr> + <tr> + <td rowspan="3">Seamonkey</td> + <td><code>false</code></td> + <td><code>false</code></td> + <td><code>false</code></td> + <td><em>inherited</em></td> + <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>0</code></span></td> + </tr> + <tr> + <td><strong><code>false</code></strong></td> + <td><strong><code>true</code></strong></td> + <td><strong><em>inherited</em></strong></td> + <td><strong><em>inherited</em></strong></td> + <td><strong>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;">1</span> (default value)</strong></td> + </tr> + <tr> + <td><code>false</code></td> + <td><code>true</code></td> + <td><code>true</code></td> + <td><em>inherited</em></td> + <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>2</code></span></td> + </tr> + <tr> + <td rowspan="3">Camino</td> + <td><code>false</code></td> + <td><code>false</code></td> + <td><code>false</code></td> + <td><em>inherited</em></td> + <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>0</code></span></td> + </tr> + <tr> + <td><code>false</code></td> + <td><code>true</code></td> + <td><em>inherited</em></td> + <td><em>inherited</em></td> + <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>1</code></span></td> + </tr> + <tr> + <td><strong><code>false</code></strong></td> + <td><strong><code>true</code></strong></td> + <td><strong><code>true</code></strong></td> + <td><strong><em>inherited</em></strong></td> + <td><strong>When <span style="font-family: courier new;">layout.spellcheckDefault</span> is <span style="font-family: courier new;"><code>2</code> </span><strong>(default value)</strong></strong></td> + </tr> + <tr> + <td>Chrome</td> + <td><code>false</code></td> + <td><code>true</code></td> + <td>?</td> + <td><em>inherited</em></td> + </tr> + <tr> + <td>Internet Explorer</td> + <td><code>false</code></td> + <td><code>true</code></td> + <td>?</td> + <td><em>inherited</em></td> + </tr> + <tr> + <td>Opera</td> + <td><code>false</code></td> + <td><code>true</code></td> + <td>?</td> + <td><em>inherited</em></td> + </tr> + <tr> + <td>Safari</td> + <td><code>false</code></td> + <td><code>true</code></td> + <td>?</td> + <td><em>inherited</em></td> + </tr> + </tbody> +</table> + +<h2 id="Espeficicaciones">Espeficicaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Espeficifación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "interaction.html#spelling-and-grammar-checking", "spellcheck")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#spelling-and-grammar-checking", "spellcheck")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, declaración inicial</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_con_exploradores">Compatibilidad con exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("1.8.1") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatUnknown}}</td> + <td>{{ CompatGeckoMobile("1.8.1") }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p> </p> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">Atributos globales</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/style/index.html b/files/es/web/html/atributos_globales/style/index.html new file mode 100644 index 0000000000..1da99e039b --- /dev/null +++ b/files/es/web/html/atributos_globales/style/index.html @@ -0,0 +1,111 @@ +--- +title: style +slug: Web/HTML/Atributos_Globales/style +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/style +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>style</strong> contiene declaraciones de estilo <a href="/es/docs/Web/CSS">CSS</a> a ser aplicados a un elemento . Notar que es recomandado para los estilos ser definidos en archivo o archivos separados . Este atributo y el elemento {{ HTMLElement("style") }} tienen principalmente el propósito de permitir el estilizamiento rápido , por ejemplo para propósitos de pruebas .</p> + +<p><strong>Nota de uso : </strong>Este atributo no debe de ser usado para comunicar información semántica . Incluso si todo el estilo es removido , una página debería mantenerse semánticamente correcta . Típicamente no debe de ser usado para ocultar información irrelevante ; esto debe de hacerse usando el atributo <a href="/en-US/docs/Web/HTML/Global_attributes/style$translate?tolocale=es#attr-hidden">hidden</a> .</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-style-attribute", "style")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-style-attribute", "style")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-style-attribute", "style")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, es ahora un verdadero atributo global .</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'present/styles.html#h-14.2.2', 'style')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Soportado en todos los elementos menos en {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td> + </tr> + <tr> + <td>{{ SpecName("CSS3 Style", "", "") }}</td> + <td>{{Spec2("CSS3 Style")}}</td> + <td>Define el contenido del atributo <strong>style </strong>.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Caracterísitica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="sect1"> </h2> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales.</a></li> +</ul> diff --git a/files/es/web/html/atributos_globales/tabindex/index.html b/files/es/web/html/atributos_globales/tabindex/index.html new file mode 100644 index 0000000000..2159639208 --- /dev/null +++ b/files/es/web/html/atributos_globales/tabindex/index.html @@ -0,0 +1,118 @@ +--- +title: tabindex +slug: Web/HTML/Atributos_Globales/tabindex +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/tabindex +--- +<p>{{HTMLSidebar("Global_attributes")}}</p> + +<p class="note">Nota: El valor máximo para tabindex no debe de exceder 32767 (<a href="https://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">sección 17.11.1 del W3C</a>). Si no se especifica, el valor asignado por defecto es -1.</p> + +<p><a href="https://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">El </a><a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>tabindex </strong>indica si su elemento puede ser enfocado, y si participa en la navegación secuencial del teclado (usualmente con la tecla <em>Tab</em>, de ahí el nombre). Acepta un entero como valor, con diferentes resultados que dependen de dicho valor:</p> + +<ul> + <li>un <em>valor negativo </em>(usualmente tabindex="-1")<em> </em>significa que el elemento debe ser enfocado, pero no debe de ser accesible a través de la navegación secuencial del teclado. Es útil para crear widgets accesibles con JavaScript.</li> + <li>tabindex="0" significa que el elemento debe ser enfocado y ser accesible a través de la navegación secuencial del teclado, pero su orden relativo es definido por convención de la plataforma.</li> + <li>un <em>valor positivo</em> significa que debe poder recoger el foco y alcanzable a través de la navegación secuencial del teclado; su orden relativo es definido por el valor del atributo: la secuencia sigue el aumento del número de <strong>tabindex</strong>. Si varios elementos comparten el mismo tabindex, su orden relativo sigue la posición relativa en el documento.</li> + <li>Un elemento con valor 0, un valor inválido o sin valor de <strong>tabindex</strong>, debe de ser posicionado después de elementos con un <strong>tabindex </strong>postivo en el orden de navegación secuencial del teclado.</li> +</ul> + +<p>Puede consultar <a href="/en/Focus_management_in_HTML">este artículo </a>para ver una explicación compresiva de la administración de la recepción de foco.</p> + +<h2 id="Especificaciones">Especificaciones</h2> + + + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "editing.html#attr-tabindex", "tabindex")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#attr-tabindex", "tabindex")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "editing.html#attr-tabindex", "tabindex")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, el atributo es ahora soportado en todos los elementos (atributos globales).</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'interact/forms.html#adef-tabindex', 'tabindex')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Solo soportado en {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}}, y {{HTMLElement("textarea")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</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>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + + + +<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>Ver también </strong></span></p> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li> + <li>{{domxref("HTMLElement.tabindex")}} que refleja este atributo .</li> +</ul> diff --git a/files/es/web/html/atributos_globales/title/index.html b/files/es/web/html/atributos_globales/title/index.html new file mode 100644 index 0000000000..ab8e0dd92f --- /dev/null +++ b/files/es/web/html/atributos_globales/title/index.html @@ -0,0 +1,138 @@ +--- +title: title +slug: Web/HTML/Atributos_Globales/title +tags: + - Atributos globales + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/title +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>title </strong>contiene un texto representado información relacionada al elemento al cual pertenece . Tal información puede típicamente , pero no necesariamente , ser presentada al usuario como un tip . Aquí hay algunos usos típicos para este atributo :</p> + +<ul> + <li>Vínculo : el título o la descripción del documento vinculado </li> + <li>Elemento mediático como una imagen : una descripción o créditos asociados</li> + <li>Párrafo : una nota de pié de página o comentario acerca de este </li> + <li>Cita : alguna información sobre el autor y otros datos .</li> +</ul> + +<p>Si este atributo es omitido , significa que el título del ancestro más cercano de este elemento es todavía relevante para este (puede usarse legítimamente como un tip para ese elemento ) . Si el atributo es establecido como la <em>cadena vacía </em>, significa explícitamente que el título de su ancestro más cercano no es relevante para este elemento ( y no debería de usarse en el tip para ese elemento )</p> + +<p>Semánticas adicionales se adjuntan a los atributos de <strong>title </strong>de los elementos {{ HTMLElement("link") }}, {{ HTMLElement("abbr") }}, {{ HTMLElement("input") }} y {{ HTMLElement("menuitem") }} </p> + +<p>El atributo <strong>title </strong>puede contener varias líneas . Cada <code>U+000A LINE FEED</code> (<code>LF</code>) insertada representa una línea nueva . Se debe tener precaución ya que esto significa que :</p> + +<pre class="brush: html"><p>Líneas nuevas en title deben de tomarse en cuenta , como esta <abbr title="Este es un título multilínea">ejemplo </abbr>.</p> +</pre> + +<p>define un título de dos líneas .</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "elements.html#the-title-attribute", "title")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-title-attribute", "title")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-title-attribute", "title")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, es ahora un verdadero atributo global.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/global.html#adef-title', 'title')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Soportado en todos los elementos pero no en {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, y {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + <tr> + <td>Soporte multi línea</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoDesktop(12)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + <tr> + <td>Soporte multi línea</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoMobile(12)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li> + <li>{{domxref("HTMLElement.title")}} que refleja a este atributo .</li> +</ul> diff --git a/files/es/web/html/atributos_globales/translate/index.html b/files/es/web/html/atributos_globales/translate/index.html new file mode 100644 index 0000000000..5182acec3c --- /dev/null +++ b/files/es/web/html/atributos_globales/translate/index.html @@ -0,0 +1,103 @@ +--- +title: translate +slug: Web/HTML/Atributos_Globales/translate +tags: + - Atributos globales + - Experimental + - HTML + - Referencia +translation_of: Web/HTML/Global_attributes/translate +--- +<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p> + +<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>translate </strong> es un atributo enumerado que es usado para especificar si los valores del atributo de un elemento y los valores de sus nodos hijos de <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#text">Texto</a> serán traducidos cuando la página es localizada , o si se debe de dejarlos sin cambio . Puede tener los siguientes valores : </p> + +<ul> + <li>Cadena vacía y "yes" , que indica que el elemento debe de ser traducido cuando la página es localizada .</li> + <li>"no", que indica que el elemento no debe de ser traducido .</li> +</ul> + +<p> </p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estatus</th> + <th scope="col">Comentario</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#attr-translate", "translate")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-translate-attribute", "translate")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatNo }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="sect1"> </h2> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales </a></li> + <li>La propiedad {{domxref("HTMLElement.translate")}} que refleja a este atributo </li> +</ul> diff --git a/files/es/web/html/atributos_globales/x-ms-acceleratorkey/index.html b/files/es/web/html/atributos_globales/x-ms-acceleratorkey/index.html new file mode 100644 index 0000000000..26cf4a2599 --- /dev/null +++ b/files/es/web/html/atributos_globales/x-ms-acceleratorkey/index.html @@ -0,0 +1,32 @@ +--- +title: x-ms-acceleratorkey +slug: Web/HTML/Atributos_Globales/x-ms-acceleratorkey +translation_of: Web/HTML/Global_attributes/x-ms-acceleratorkey +--- +<div>{{HTMLSidebar("Global_attributes")}}{{Non-standard_Header}}</div> + +<p> </p> + +<p><font><font>La </font></font><code><strong>x-ms-acceleratorkey</strong></code><font><font>propiedad proporciona una forma de declarar que una tecla de aceleración se ha asignado a un elemento.</font></font></p> + +<p><font><font>Esta propiedad propietaria es específica de Internet Explorer y Microsoft Edge.</font></font></p> + +<p><font><font>La </font></font><code>x-ms-acceleratorkey</code><font><font>propiedad le permite exponer una notificación en el árbol de accesibilidad a los lectores de pantalla y otras tecnologías de asistencia de que existe una clave de aceleración. </font><font>Este atributo no proporciona el comportamiento de la clave del acelerador. </font><font>Debe proporcionar controladores de eventos de teclado, como por ejemplo </font></font><code>onkeypress</code><font><font>, </font></font><code>onkeydown</code><font><font>o </font></font><code>onkeyup</code><font><font>, para procesar las teclas de aceleración en el documento.</font></font></p> + +<p> </p> + +<h2 id="Sintaxis">Sintaxis</h2> + +<pre class="brush: html"><button x-ms-acceleratorkey="string">...</button></pre> + +<h2 id="Valor">Valor</h2> + +<p>Tipo: <strong>String</strong></p> + +<p>Nombre de la tecla de aceleración, por ejemplo: <code><em>Ctrl+B</em> or <em>Ctrl+S</em></code>.</p> + +<h2 id="See_Also" name="See_Also">Ver también</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Microsoft_API_extensions">Microsoft API extensions </a></li> +</ul> |