diff options
Diffstat (limited to 'files/pt-pt/web/html/attributes')
| -rw-r--r-- | files/pt-pt/web/html/attributes/crossorigin/index.html | 87 | ||||
| -rw-r--r-- | files/pt-pt/web/html/attributes/index.html | 659 | ||||
| -rw-r--r-- | files/pt-pt/web/html/attributes/rel/index.html | 418 |
3 files changed, 1164 insertions, 0 deletions
diff --git a/files/pt-pt/web/html/attributes/crossorigin/index.html b/files/pt-pt/web/html/attributes/crossorigin/index.html new file mode 100644 index 0000000000..42f32f77e8 --- /dev/null +++ b/files/pt-pt/web/html/attributes/crossorigin/index.html @@ -0,0 +1,87 @@ +--- +title: 'Atributo CORS: Solicitar acesso CORS para o conteúdo' +slug: Web/HTML/CORS_settings_attributes +tags: + - Avançado + - CORS + - HTML + - Precisa de Exemplo + - Referencia + - Segurança +translation_of: Web/HTML/Attributes/crossorigin +--- +<p><span class="seoSummary">In HTML5, some HTML elements which provide support for <a href="/en-US/docs/Web/HTTP/CORS">CORS</a>, such as {{ HTMLElement("img") }}, {{ HTMLElement("video") }} or {{ HTMLElement("script") }}, have a <code>crossorigin</code> attribute (<code>crossOrigin</code> property), which lets you configure the CORS requests for the element's fetched data.</span> These attributes are enumerated, and have the following possible values:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">Keyword</td> + <td class="header">Description</td> + </tr> + <tr> + <td><code>anonymous</code></td> + <td>CORS requests for this element will have the credentials flag set to 'same-origin'.</td> + </tr> + <tr> + <td><code>use-credentials</code></td> + <td>CORS requests for this element will have the credentials flag set to 'include'.</td> + </tr> + </tbody> +</table> + +<p>By default (that is, when the attribute is not specified), CORS is not used at all. The "anonymous" keyword means that there will be no exchange of <strong>user credentials</strong> via cookies, client-side SSL certificates or HTTP authentication as described in the <a class="external" href="http://www.w3.org/TR/cors/#user-credentials">Terminology section of the CORS specification</a>, unless it is in the same origin.</p> + +<p>An invalid keyword and an empty string will be handled as the <code>anonymous</code> keyword.</p> + +<h3 id="Exemplo_crossorigin_with_the_script_element">Exemplo: crossorigin with the script element</h3> + +<p>You can use the following {{HTMLElement("script")}} element to tell a browser to execute the <code>https://example.com/example-framework.js</code> script without sending user-credentials.</p> + +<pre class="brush: html"><script src="https://example.com/example-framework.js" + crossorigin="anonymous"></script></pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Estado</th> + <th scope="col">Comentário</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'infrastructure.html#cors-settings-attributes', 'CORS settings attributes')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'embedded-content.html#attr-img-crossorigin', 'crossorigin')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_de_navegador">Compatibilidade de navegador</h2> + +<h3 id="<script_crossorigin>"><script crossorigin></h3> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("html.elements.script.crossorigin")}}</p> + +<h3 id="<video_crossorigin>"><video crossorigin></h3> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("html.elements.video.crossorigin")}}</p> + +<h2 id="Consulte_também">Consulte também</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTTP/CORS">Cross-Origin Resource Sharing (CORS)</a></li> +</ul> + +<div>{{QuickLinksWithSubpages("/en-US/docs/Web/HTML/")}}</div> diff --git a/files/pt-pt/web/html/attributes/index.html b/files/pt-pt/web/html/attributes/index.html new file mode 100644 index 0000000000..84ea814756 --- /dev/null +++ b/files/pt-pt/web/html/attributes/index.html @@ -0,0 +1,659 @@ +--- +title: Lista de atributos HTML +slug: Web/HTML/Atributos +tags: + - HTML + - Referencia + - Web + - atributo +translation_of: Web/HTML/Attributes +--- +<p>Elementos em HTML têm <strong>atributos</strong>; estes são valores adicionais que configuram os elementos ou ajustam o seu comportamento em vários modos para corresponderem aos critérios que os utilizadores pretendem.</p> + +<h2 id="Lista_de_Atributos">Lista de Atributos</h2> + +<table class="standard-table"> + <thead> + <tr> + <th>Nome do Atributo</th> + <th>Elementos</th> + <th>Descrição</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>accept</code></td> + <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td> + <td>Lista de tipos que o servidor aceita, é usualmente um tipo de ficheiro.</td> + </tr> + <tr> + <td><code>accept-charset</code></td> + <td>{{ HTMLElement("form") }}</td> + <td>Lista de codificações de caracteres (charsets) que são suportadas.</td> + </tr> + <tr> + <td><code>accesskey</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Atributo global</a></td> + <td>Define um atalho do teclado para activar ou adicionar foco ao elemento.</td> + </tr> + <tr> + <td><code>action</code></td> + <td>{{ HTMLElement("form") }}</td> + <td>O URI dum programa que processa a informação submetida através deste formulário.</td> + </tr> + <tr> + <td><code>align</code></td> + <td>{{ HTMLElement("applet") }}, {{ HTMLElement("caption") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}, {{ HTMLElement("hr") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }}, {{ HTMLElement("td") }}, {{ HTMLElement("tfoot") }} , {{ HTMLElement("th") }}, {{ HTMLElement("thead") }}, {{ HTMLElement("tr") }}</td> + <td>Especifica o alinhamento horizontal do elemento.</td> + </tr> + <tr> + <td><code>alt</code></td> + <td>{{ HTMLElement("applet") }}, {{ HTMLElement("area") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}</td> + <td>Texto alternativo no caso de uma imagem não poder ser mostrada.</td> + </tr> + <tr> + <td><code>async</code></td> + <td>{{ HTMLElement("script") }}</td> + <td>Indicates that the script should be executed asynchronously.</td> + </tr> + <tr> + <td><code>autocomplete</code></td> + <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td> + <td>Indicates whether controls in this form can by default have their values automatically completed by the browser.</td> + </tr> + <tr> + <td><code>autofocus</code></td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>The element should be automatically focused after the page loaded.</td> + </tr> + <tr> + <td><code>autoplay</code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td>The audio or video should play as soon as possible.</td> + </tr> + <tr> + <td><code>autosave</code></td> + <td>{{ HTMLElement("input") }}</td> + <td>Previous values should persist dropdowns of selectable values across page loads.</td> + </tr> + <tr> + <td><code>bgcolor</code></td> + <td>{{ HTMLElement("body") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }}, {{ HTMLElement("tfoot") }}, {{ HTMLElement("td") }}, {{ HTMLElement("th") }}, {{ HTMLElement("tr") }}</td> + <td> + <p>Background color of the element.</p> + + <div class="note"> + <p><strong>Nota:</strong> This is a legacy attribute. Please use the CSS {{ Cssxref("background-color") }} property instead.</p> + </div> + </td> + </tr> + <tr> + <td><code>border</code></td> + <td>{{ HTMLElement("img") }}, {{ HTMLElement("object") }}, {{ HTMLElement("table") }}</td> + <td> + <p>The border width.</p> + + <div class="note"> + <p><strong>Nota:</strong> This is a legacy attribute. Please use the CSS {{ Cssxref("border") }} property instead.</p> + </div> + </td> + </tr> + <tr> + <td><code>buffered</code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td>Contains the time range of already buffered media.</td> + </tr> + <tr> + <td><code>challenge</code></td> + <td>{{ HTMLElement("keygen") }}</td> + <td>A challenge string that is submitted along with the public key.</td> + </tr> + <tr> + <td><code>charset</code></td> + <td>{{ HTMLElement("meta") }}, {{ HTMLElement("script") }}</td> + <td>Declares the character encoding of the page or script.</td> + </tr> + <tr> + <td><code>checked</code></td> + <td>{{ HTMLElement("command") }}, {{ HTMLElement("input") }}</td> + <td>Indicates whether the element should be checked on page load.</td> + </tr> + <tr> + <td><code>cite</code></td> + <td>{{ HTMLElement("blockquote") }}, {{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("q") }}</td> + <td>Contains a URI which points to the source of the quote or change.</td> + </tr> + <tr> + <td><code>class</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Often used with CSS to style elements with common properties.</td> + </tr> + <tr> + <td><code>code</code></td> + <td>{{ HTMLElement("applet") }}</td> + <td>Specifies the URL of the applet's class file to be loaded and executed.</td> + </tr> + <tr> + <td><code>codebase</code></td> + <td>{{ HTMLElement("applet") }}</td> + <td>This attribute gives the absolute or relative URL of the directory where applets' .class files referenced by the code attribute are stored.</td> + </tr> + <tr> + <td><code>color</code></td> + <td>{{ HTMLElement("basefont") }}, {{ HTMLElement("font") }}, {{ HTMLElement("hr") }}</td> + <td> + <p>This attribute sets the text color using either a named color or a color specified in the hexadecimal #RRGGBB format.</p> + + <div class="note"> + <p><strong>Nota:</strong> This is a legacy attribute. Please use the CSS {{ Cssxref("color") }} property instead.</p> + </div> + </td> + </tr> + <tr> + <td><code>cols</code></td> + <td>{{ HTMLElement("textarea") }}</td> + <td>Defines the number of columns in a textarea.</td> + </tr> + <tr> + <td><code>colspan</code></td> + <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td> + <td>The colspan attribute defines the number of columns a cell should span.</td> + </tr> + <tr> + <td><code>content</code></td> + <td>{{ HTMLElement("meta") }}</td> + <td>A value associated with <code>http-equiv</code> or <code>name</code> depending on the context.</td> + </tr> + <tr> + <td><code>contenteditable</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Indicates whether the element's content is editable.</td> + </tr> + <tr> + <td><code>contextmenu</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Defines the ID of a {{ HTMLElement("menu") }} element which will serve as the element's context menu.</td> + </tr> + <tr> + <td><code>controls</code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td>Indicates whether the browser should show playback controls to the user.</td> + </tr> + <tr> + <td><code>coords</code></td> + <td>{{ HTMLElement("area") }}</td> + <td>A set of values specifying the coordinates of the hot-spot region.</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">crossorigin</a></code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("img") }}, {{ HTMLElement("link") }}, {{ HTMLElement("script") }}, {{ HTMLElement("video") }}</td> + <td>How the element handles cross-origin requests</td> + </tr> + <tr> + <td><code>data</code></td> + <td>{{ HTMLElement("object") }}</td> + <td>Specifies the URL of the resource.</td> + </tr> + <tr> + <td><code>data-*</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Lets you attach custom attributes to an HTML element.</td> + </tr> + <tr> + <td><code>datetime</code></td> + <td>{{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("time") }}</td> + <td>Indicates the date and time associated with the element.</td> + </tr> + <tr> + <td><code>default</code></td> + <td>{{ HTMLElement("track") }}</td> + <td>Indicates that the track should be enabled unless the user's preferences indicate something different.</td> + </tr> + <tr> + <td><code>defer</code></td> + <td>{{ HTMLElement("script") }}</td> + <td>Indicates that the script should be executed after the page has been parsed.</td> + </tr> + <tr> + <td><code>dir</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)</td> + </tr> + <tr> + <td><code>dirname</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td> </td> + </tr> + <tr> + <td><code>disabled</code></td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("command") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates whether the user can interact with the element.</td> + </tr> + <tr> + <td><code>download</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td> + <td>Indicates that the hyperlink is to be used for downloading a resource.</td> + </tr> + <tr> + <td><code>draggable</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Defines whether the element can be dragged.</td> + </tr> + <tr> + <td><code>dropzone</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Indicates that the element accept the dropping of content on it.</td> + </tr> + <tr> + <td><code>enctype</code></td> + <td>{{ HTMLElement("form") }}</td> + <td>Defines the content type of the form date when the <code>method</code> is POST.</td> + </tr> + <tr> + <td><code>for</code></td> + <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td> + <td>Describes elements which belongs to this one.</td> + </tr> + <tr> + <td><code>form</code></td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates the form that is the owner of the element.</td> + </tr> + <tr> + <td><code>formaction</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("button") }}</td> + <td>Indicates the action of the element, overriding the action defined in the {{ HTMLElement("form") }}.</td> + </tr> + <tr> + <td><code>headers</code></td> + <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td> + <td>IDs of the <code><th></code> elements which applies to this element.</td> + </tr> + <tr> + <td><code>height</code></td> + <td>{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td> + <td> + <p>Specifies the height of elements listed here. For all other elements, use the CSS {{cssxref("height")}} property.</p> + + <div class="note"> + <p><strong>Nota:</strong> In some instances, such as {{ HTMLElement("div") }}, this is a legacy attribute, in which case the CSS {{ Cssxref("height") }} property should be used instead.</p> + </div> + </td> + </tr> + <tr> + <td><code>hidden</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Prevents rendering of given element, while keeping child elements, e.g. script elements, active.</td> + </tr> + <tr> + <td><code>high</code></td> + <td>{{ HTMLElement("meter") }}</td> + <td>Indicates the lower bound of the upper range.</td> + </tr> + <tr> + <td><code>href</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("link") }}</td> + <td> The URL of a linked resource.</td> + </tr> + <tr> + <td><code>hreflang</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td> + <td>Specifies the language of the linked resource.</td> + </tr> + <tr> + <td><code>http-equiv</code></td> + <td>{{ HTMLElement("meta") }}</td> + <td> </td> + </tr> + <tr> + <td><code>icon</code></td> + <td>{{ HTMLElement("command") }}</td> + <td>Specifies a picture which represents the command.</td> + </tr> + <tr> + <td><code>id</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Often used with CSS to style a specific element. The value of this attribute must be unique.</td> + </tr> + <tr> + <td><code>integrity</code></td> + <td>{{ HTMLElement("link") }}, {{ HTMLElement("script") }} </td> + <td> + <p>Security Feature that allows browsers to verify what they fetch. </p> + + <p><a href="/en-US/docs/">MDN Link</a></p> + </td> + </tr> + <tr> + <td><code>ismap</code></td> + <td>{{ HTMLElement("img") }}</td> + <td>Indicates that the image is part of a server-side image map.</td> + </tr> + <tr> + <td><code>itemprop</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td> </td> + </tr> + <tr> + <td><code>keytype</code></td> + <td>{{ HTMLElement("keygen") }}</td> + <td>Specifies the type of key generated.</td> + </tr> + <tr> + <td><code>kind</code></td> + <td>{{ HTMLElement("track") }}</td> + <td>Specifies the kind of text track.</td> + </tr> + <tr> + <td><code>label</code></td> + <td>{{ HTMLElement("track") }}</td> + <td>Specifies a user-readable title of the text track.</td> + </tr> + <tr> + <td><code>lang</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Defines the language used in the element.</td> + </tr> + <tr> + <td><code>language</code></td> + <td>{{ HTMLElement("script") }}</td> + <td>Defines the script language used in the element.</td> + </tr> + <tr> + <td><code>list</code></td> + <td>{{ HTMLElement("input") }}</td> + <td>Identifies a list of pre-defined options to suggest to the user.</td> + </tr> + <tr> + <td><code>loop</code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("bgsound") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("video") }}</td> + <td>Indicates whether the media should start playing from the start when it's finished.</td> + </tr> + <tr> + <td><code>low</code></td> + <td>{{ HTMLElement("meter") }}</td> + <td>Indicates the upper bound of the lower range.</td> + </tr> + <tr> + <td><code>manifest</code></td> + <td>{{ HTMLElement("html") }}</td> + <td>Specifies the URL of the document's cache manifest.</td> + </tr> + <tr> + <td><code>max</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td> + <td>Indicates the maximum value allowed.</td> + </tr> + <tr> + <td><code>maxlength</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td>Defines the maximum number of characters allowed in the element.</td> + </tr> + <tr> + <td><code>media</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}</td> + <td>Specifies a hint of the media for which the linked resource was designed.</td> + </tr> + <tr> + <td><code>method</code></td> + <td>{{ HTMLElement("form") }}</td> + <td>Defines which <a href="/en-US/docs/Web/HTTP">HTTP</a> method to use when submitting the form. Can be <code>GET</code> (default) or <code>POST</code>.</td> + </tr> + <tr> + <td><code>min</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td> + <td>Indicates the minimum value allowed.</td> + </tr> + <tr> + <td><code>multiple</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td> + <td>Indicates whether multiple values can be entered in an input of the type <code>email</code> or <code>file</code>.</td> + </tr> + <tr> + <td><code>muted</code></td> + <td>{{ HTMLElement("video") }}</td> + <td>Indicates whether the audio will be initially silenced on page load.</td> + </tr> + <tr> + <td><code>name</code></td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}, {{ HTMLElement("map") }}, {{ HTMLElement("meta") }}, {{ HTMLElement("param") }}</td> + <td>Name of the element. For example used by the server to identify the fields in form submits.</td> + </tr> + <tr> + <td><code>novalidate</code></td> + <td>{{ HTMLElement("form") }}</td> + <td>This attribute indicates that the form shouldn't be validated when submitted.</td> + </tr> + <tr> + <td><code>open</code></td> + <td>{{ HTMLElement("details") }}</td> + <td>Indicates whether the details will be shown on page load.</td> + </tr> + <tr> + <td><code>optimum</code></td> + <td>{{ HTMLElement("meter") }}</td> + <td>Indicates the optimal numeric value.</td> + </tr> + <tr> + <td><code>pattern</code></td> + <td>{{ HTMLElement("input") }}</td> + <td>Defines a regular expression which the element's value will be validated against.</td> + </tr> + <tr> + <td><code>ping</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td> + <td> </td> + </tr> + <tr> + <td><code>placeholder</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td>Provides a hint to the user of what can be entered in the field.</td> + </tr> + <tr> + <td><code>poster</code></td> + <td>{{ HTMLElement("video") }}</td> + <td>A URL indicating a poster frame to show until the user plays or seeks.</td> + </tr> + <tr> + <td><code>preload</code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td>Indicates whether the whole resource, parts of it or nothing should be preloaded.</td> + </tr> + <tr> + <td><code>radiogroup</code></td> + <td>{{ HTMLElement("command") }}</td> + <td> </td> + </tr> + <tr> + <td><code>readonly</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates whether the element can be edited.</td> + </tr> + <tr> + <td><code>rel</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td> + <td>Specifies the relationship of the target object to the link object.</td> + </tr> + <tr> + <td><code>required</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates whether this element is required to fill out or not.</td> + </tr> + <tr> + <td><code>reversed</code></td> + <td>{{ HTMLElement("ol") }}</td> + <td>Indicates whether the list should be displayed in a descending order instead of a ascending.</td> + </tr> + <tr> + <td><code>rows</code></td> + <td>{{ HTMLElement("textarea") }}</td> + <td>Defines the number of rows in a text area.</td> + </tr> + <tr> + <td><code>rowspan</code></td> + <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td> + <td>Defines the number of rows a table cell should span over.</td> + </tr> + <tr> + <td><code>sandbox</code></td> + <td>{{ HTMLElement("iframe") }}</td> + <td> </td> + </tr> + <tr> + <td><code>scope</code></td> + <td>{{ HTMLElement("th") }}</td> + <td> </td> + </tr> + <tr> + <td><code>scoped</code></td> + <td>{{ HTMLElement("style") }}</td> + <td> </td> + </tr> + <tr> + <td><code>seamless</code></td> + <td>{{ HTMLElement("iframe") }}</td> + <td> </td> + </tr> + <tr> + <td><code>selected</code></td> + <td>{{ HTMLElement("option") }}</td> + <td>Defines a value which will be selected on page load.</td> + </tr> + <tr> + <td><code>shape</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td> + <td> </td> + </tr> + <tr> + <td><code>size</code></td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td> + <td>Defines the width of the element (in pixels). If the element's <code>type</code> attribute is <code>text</code> or <code>password</code> then it's the number of characters.</td> + </tr> + <tr> + <td><code>sizes</code></td> + <td>{{ HTMLElement("link") }}, {{ HTMLElement("img") }}, {{ HTMLElement("source") }}</td> + <td> </td> + </tr> + <tr> + <td><code>slot</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Assigns a slot in a shadow DOM shadow tree to an element.</td> + </tr> + <tr> + <td><code>span</code></td> + <td>{{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}</td> + <td> </td> + </tr> + <tr> + <td><code>spellcheck</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Indicates whether spell checking is allowed for the element.</td> + </tr> + <tr> + <td><code>src</code></td> + <td>{{ HTMLElement("audio") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("track") }}, {{ HTMLElement("video") }}</td> + <td>The URL of the embeddable content.</td> + </tr> + <tr> + <td><code>srcdoc</code></td> + <td>{{ HTMLElement("iframe") }}</td> + <td> </td> + </tr> + <tr> + <td><code>srclang</code></td> + <td>{{ HTMLElement("track") }}</td> + <td> </td> + </tr> + <tr> + <td><code>srcset</code></td> + <td>{{ HTMLElement("img") }}</td> + <td> </td> + </tr> + <tr> + <td><code>start</code></td> + <td>{{ HTMLElement("ol") }}</td> + <td>Defines the first number if other than 1.</td> + </tr> + <tr> + <td><code>step</code></td> + <td>{{ HTMLElement("input") }}</td> + <td> </td> + </tr> + <tr> + <td><code>style</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Defines CSS styles which will override styles previously set.</td> + </tr> + <tr> + <td><code>summary</code></td> + <td>{{ HTMLElement("table") }}</td> + <td> </td> + </tr> + <tr> + <td><code>tabindex</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Overrides the browser's default tab order and follows the one specified instead.</td> + </tr> + <tr> + <td><code>target</code></td> + <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("form") }}</td> + <td> </td> + </tr> + <tr> + <td><code>title</code></td> + <td><a href="/en-US/docs/HTML/Global_attributes">Global attribute</a></td> + <td>Text to be displayed in a tooltip when hovering over the element.</td> + </tr> + <tr> + <td><code>type</code></td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("command") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("object") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}, {{ HTMLElement("menu") }}</td> + <td>Defines the type of the element.</td> + </tr> + <tr> + <td><code>usemap</code></td> + <td>{{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}</td> + <td> </td> + </tr> + <tr> + <td><code>value</code></td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("li") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("param") }}</td> + <td>Defines a default value which will be displayed in the element on page load.</td> + </tr> + <tr> + <td><code>width</code></td> + <td>{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td> + <td> + <p>For the elements listed here, this establishes the element's width.</p> + + <div class="note"> + <p><strong>Nota:</strong> For all other instances, such as {{ HTMLElement("div") }}, this is a legacy attribute, in which case the CSS {{ Cssxref("width") }} property should be used instead.</p> + </div> + </td> + </tr> + <tr> + <td><code>wrap</code></td> + <td>{{ HTMLElement("textarea") }}</td> + <td>Indicates whether the text should be wrapped.</td> + </tr> + </tbody> +</table> + +<h2 id="Conteúdo_versus_atributos_IDL">Conteúdo versus atributos IDL</h2> + +<p>In HTML, most attributes have two faces: the <strong>content attribute</strong> and the <strong>IDL attribute</strong>.</p> + +<p>The content attribute is the attribute as you set it from the content (the HTML code) and you can set it or get it via {{domxref("element.setAttribute()")}} or {{domxref("element.getAttribute()")}}. The content attribute is always a string even when the expected value should be an integer. For example, to set an {{HTMLElement("input")}} element's <code>maxlength</code> to 42 using the content attribute, you have to call <code>setAttribute("maxlength", "42")</code> on that element.</p> + +<p>The IDL attribute is also known as a JavaScript property. These are the attributes you can read or set using JavaScript properties like <code class="moz-txt-verticalline">element.foo</code>. The IDL attribute is always going to use (but might transform) the underlying content attribute to return a value when you get it and is going to save something in the content attribute when you set it. In other words, the IDL attributes, in essence, reflect the content attributes.</p> + +<p>Most of the time, IDL attributes will return their values as they are really used. For example, the default <code>type</code> for {{HTMLElement("input")}} elements is "text", so if you set <code>input.type="foobar"</code>, the <code><input></code> element will be of type text (in the appearance and the behavior) but the "type" content attribute's value will be "foobar". However, the <code>type</code> IDL attribute will return the string "text".</p> + +<p>IDL attributes are not always strings; for example, <code>input.maxlength</code> is a number (a signed long). When using IDL attributes, you read or set values of the desired type, so <code>input.maxlength</code> is always going to return a number and when you set <code>input.maxlength</code> ,it wants a number. If you pass another type, it is automatically converted to a number as specified by the standard JavaScript rules for type conversion.</p> + +<p>IDL attributes can <a href="https://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">reflect other types</a> such as unsigned long, URLs, booleans, etc. Unfortunately, there are no clear rules and the way IDL attributes behave in conjunction with their corresponding content attributes depends on the attribute. Most of the time, it will follow <a href="https://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">the rules laid out in the specification</a>, but sometimes it doesn't. HTML specifications try to make this as developer-friendly as possible, but for various reasons (mostly historical), some attributes behave oddly (<code>select.size</code>, for example) and you should read the specifications to understand how exactly they behave.</p> + +<h2 id="Consulte_também">Consulte também</h2> + +<ul> + <li><a href="/pt-PT/docs/Web/HTML/Elemento">Elementos de HTML</a></li> +</ul> diff --git a/files/pt-pt/web/html/attributes/rel/index.html b/files/pt-pt/web/html/attributes/rel/index.html new file mode 100644 index 0000000000..fe8307f0c0 --- /dev/null +++ b/files/pt-pt/web/html/attributes/rel/index.html @@ -0,0 +1,418 @@ +--- +title: 'HTML attribute: rel' +slug: Web/HTML/Atributos/rel +translation_of: Web/HTML/Attributes/rel +--- +<p>{{draft}}</p> + +<p class="summary">O atributo <strong><code>rel</code></strong> define a relação entre um recurso ligado e o documento atual. É válido em {{htmlelement('link')}}, {{htmlelement('a')}}, {{htmlelement('area')}}, e {{htmlelement('form')}}. Os valores suportados dependem do elemento em que o atributo é usado.</p> + +<p>O tipo de relação (da ligação) é definido pelo atributo <strong><em><code>rel</code></em></strong> que, se existir, tem de ter um valor que é um conjunto de palavras-chave (<em>keywords</em>) únicas, desordenadas, e separadas por espaços. As palavras-chave possíveis estão na tabela em baixo.</p> + +<table class="standard-table"> + <caption>Valores possíves para o atributo <code>rel</code>, e os elementos em que são relevantes</caption> + <thead> + <tr> + <th><code>rel</code> (valor)</th> + <th>Descrição</th> + <th><code>{{htmlelement('link')}}</code></th> + <th><code>{{htmlelement('a')}}</code> e <code>{{htmlelement('area')}}</code></th> + <th><code>{{htmlelement('form')}}</code></th> + </tr> + </thead> + <tbody> + <tr> + <td><code>{{anch("attr-alternate", "alternate")}}</code></td> + <td>Representações alternativas do documento atual.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-author", "author")}}</code></td> + <td>Autor do documento ou artigo atual.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-bookmark", "bookmark")}}</code></td> + <td><em>Permalink</em> para a secção antecessora mais próxima.</td> + <td class="not-allowed">Não permitido</td> + <td><em>Link</em></td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-canonical", "canonical")}}</code></td> + <td>URL ideal para o documento atual.</td> + <td><em>Link</em></td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/dns-prefetch">dns-prefetch</a></code></td> + <td>Pede ao <em>browser</em> para antecipadamente efetuar a resolução de DNS para o <em>link</em> em questão.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-external", "external")}}</code></td> + <td>O documento referenciado não pertence ao <em>site</em> do documento atual.</td> + <td class="not-allowed">Não permitido</td> + <td>Anotação</td> + <td>Anotação</td> + </tr> + <tr> + <td><code>{{anch("attr-help", "help")}}</code></td> + <td><em>Link</em> para material de apoio sobre o contexto atual.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td><em>Link</em></td> + </tr> + <tr> + <td><code>{{anch("attr-icon", "icon")}}</code></td> + <td>Um ícone representativo do documento atual.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-license", "license")}}</code></td> + <td>O conteúdo principal do documento atual está protegido pela licença de direitos de autor<em> </em>referida no <em>link</em>.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td><em>Link</em></td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/manifest">manifest</a></code></td> + <td><em>Web</em> <em>app</em> <em>manifest</em></td> + <td class="not-allowed"><em>Link</em></td> + <td>Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/modulepreload">modulepreload</a></code></td> + <td>Pede ao <em>browser</em> para antecipadamente descarregar o <em>script </em>e guardá-lo no mapa de módulos do documento, para avaliar depois. As dependências do módulo também podem ser descarregadas, opcionalmente.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-next", "next")}}</code></td> + <td>Indica que o documento atual pertence a uma série de documentos, e que o documento referenciado por este <em>link </em>é o seguinte.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td><em>Link</em></td> + </tr> + <tr> + <td><code>{{anch("attr-nofollow", "nofollow")}}</code></td> + <td>Indica que o autor ou editor do documento atual não aprova o documento referenciado.</td> + <td class="not-allowed">Não permitido</td> + <td>Anotação</td> + <td>Anotação</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/noopener">noopener</a></code></td> + <td>Cria um contexto de navegação de nível superior e não é "auxiliar" (não está relacionado com outro contexto de navegação), mesmo que a hiperligação estivesse configurada para criar outro tipo de contexto (atribuindo um certo valor ao atributo<code> target</code>, por exemplo).</td> + <td class="not-allowed">Não permitido</td> + <td>Anotação</td> + <td>Anotação</td> + </tr> + <tr> + <td><code>{{anch("attr-noreferrer", "noreferrer")}}</code></td> + <td>Comporta-se do mesmo modo que <code>noopener</code>, mas exclui o <em>header</em> <code>Referer</code> do pedido.</td> + <td class="not-allowed">Não permitido</td> + <td>Anotação</td> + <td>Anotação</td> + </tr> + <tr> + <td><code>{{anch("attr-opener", "opener")}}</code></td> + <td>Cria um contexto de navegação auxiliar, mesmo que a hiperligação fosse criar um contexto de navegação de nível superior que não fosse auxiliar (por exemplo, no caso de um link com "<code>_blank</code>" como valor do atributo <code>target</code>).</td> + <td class="not-allowed">Não permitido</td> + <td>Anotação</td> + <td>Anotação</td> + </tr> + <tr> + <td><code>{{anch("attr-pingback", "pingback")}}</code></td> + <td>Indica o endereço do servidor <em>pingback</em> que controla <em>pingbacks</em> para o document atual.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/preconnect">preconnect</a></code></td> + <td>Informa o <em>user agent</em> de que este deve ligar-se antecipadamente à origem do recurso apontado pelo <em>link</em>.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/prefetch">prefetch</a></code></td> + <td>Informa o <em>user agent</em> de que este deve antecipadamente descarregar o recurso apontado e guardá-lo em <em>cache</em>, porque é provável que este seja necessário numa futura navegação.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/preload">preload</a></code></td> + <td> + <p>Informa o <em>user agent</em> de que este deve antecipadamente descarregar o recurso apontado e guardá-lo em <em>cache. </em>Tal deverá ocorrer para para que o recurso seja usado na navegação atual, com base no atributo <code><a href="as">as</a></code> (e na prioridade associada ao recurso apontado).</p> + </td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code><a href="/en-US/docs/Web/HTML/Link_types/prerender">prerender</a></code></td> + <td>Informa o <em>user agent</em> de que este deve antecipadamente descarregar o recurso apontado e futuramente responder mais rapidamente ao mesmo pedido.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-prev", "prev")}}</code></td> + <td>Indica que o documento atual pertence a uma série de documentos, e que o documento referenciado por este <em>link </em>é o anterior.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td><em>Link</em></td> + </tr> + <tr> + <td><code>{{anch("attr-search", "search")}}</code></td> + <td>Aponta para um recurso onde se pode pesquisar por conteúdo do documento atual e de páginas relacionadas.</td> + <td><em>Link</em></td> + <td><em>Link</em></td> + <td><em>Link</em></td> + </tr> + <tr> + <td><code>{{anch("attr-stylesheet", "stylesheet")}}</code></td> + <td>Importa uma <em>style sheet</em>.</td> + <td>Recurso externo</td> + <td class="not-allowed">Não permitido</td> + <td class="not-allowed">Não permitido</td> + </tr> + <tr> + <td><code>{{anch("attr-tag", "tag")}}</code></td> + <td>Fornece uma <em>tag</em> (identificada pelo endereço referido) a ser usada no documento atual.</td> + <td class="not-allowed">Não permitido</td> + <td><em>Link</em></td> + <td class="not-allowed">Não aplicado</td> + </tr> + </tbody> +</table> + +<p>O atributo <code>rel</code> é relevate para os elementos {{htmlelement('link')}}, {{htmlelement('a')}}, {{htmlelement('area')}}, e {{htmlelement('form')}}. No entanto, alguns dos valores só são relevantes para casos específicos deste grupo de elementos. Para o valor de <code>rel</code>, não há diferenciação entre maiúsculas e minúsculas, tal como em nos atributos HTML em geral.</p> + +<p><code>rel</code> não tem um valor por defeito. Se o atributo for omitido ou se os seus valores forem inválidos, então não existe qualquer relação entre o documento atual e o recurso apontado, fora a existência de uma hiperligação. Por exemplo, para {{htmlelement('link')}} e {{htmlelement('form')}}, se <code>rel</code> for omitido, ou se não tiver pelo menos uma das <em>keywords</em> em cima (separadas por espaços), então não são criadas hiperligações. Mas se o mesmo acontecer com os elementos {{htmlelement('a')}} ou {{htmlelement('area')}}, então os elementos criam hiperligações sem uma relação específica.</p> + +<h2 id="Valores">Valores</h2> + +<p>Se houverem vários elementos <code><link rel="icon"></code>, o <em>browser</em> verifica os atributos <a href="media"><code>media</code></a>, <a href="type"><code>type</code></a> e <a href="sizes"><code>sizes</code></a> destes para selecionar o ícone mais adequado. Se mais do que um elemento for adequado, é o último que é usado. Se o ícone selecionado acabar por não ser apropriado (porque usa um formato não suportado, por exemplo), o <em>browser </em>seleciona o próximo elemento mais adequado.</p> + +<p><strong>Nota:</strong> Sistemas Apple iOS não usam este tipo de <em>link</em>, nem o atributo <a href="sizes"><code>sizes</code></a> (usado por outros <em>browsers </em>para dispositivos móveis), para escolher um ícone para um Web Clip ou para um <em>placeholder</em> visível no arranque. Sistemas iOS usam <a class="external external-icon" href="https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4"><code>apple-touch-icon</code></a> e <a class="external external-icon" href="https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW6"><code>apple-touch-startup-image</code></a> respetivamente, atributos que não são padrão.</p> + +<p class="note">O tipo de <em>link</em> <code>shortcut</code> é frequentemente encontrado antes de <code>icon</code>, mas não é padrão, é ignorado, e <strong>já não deve ser usado por autores para a<em> web</em></strong>.</p> + +<dl> + <dt>{{htmlattrdef("alternate")}}</dt> + <dd>Aponta para uma versão alternativa do documento atual. É compatível com elementos <code>link</code>, <code>a</code>, e <code>area</code>. O efeito de <code>alternate</code> depende do valor de outros atributos: + <ul> + <li>Em conjunto com <code>{{anch('stylesheet')}} num </code><code>link</code>, <code>alternate</code> cria uma folha de estilo (<em>style sheet)</em> alternativa. + <pre class="brush:html notranslate"><!-- uma folha de estilo persistente --> +<link rel="stylesheet" href="default.css"> +<!-- folhas de estilo alternativas --> +<link rel="alternate stylesheet" href="highcontrast.css" title="High contrast"></pre> + </li> + <li>Com um atributo <code><a href="hreflang">hreflang</a></code> que tenha um valor diferente da língua do documento, <code>alternate</code> aponta para uma versão traduzida do documento.</li> + <li>Com um atributo <code><a href="type">type</a></code>, aponta para um documento com o mesmo contexto mas formato diferente. Por exemplo, com <code>type="application/rss+xml"</code> cria uma hiperligação para um <em>feed RSS</em>. + <pre class="brush:html notranslate"><link rel="alternate" type="application/atom+xml" href="posts.xml" title="Blog"></pre> + </li> + <li>Os atributos <a href="hreflang">hreflang</a> e <a href="type">type</a> apontam para versões do documento atua com formatos ou línguas diferentes, que podem ser dedicados a outros <em>media</em> + <pre class="brush:html notranslate"><link rel=alternate href="/fr/html/print" hreflang=fr type=text/html media=print title="French HTML (for printing)"> +<link rel=alternate href="/fr/pdf" hreflang=fr type=application/pdf title="French PDF"></pre> + </li> + </ul> + </dd> + <dt>{{htmlattrdef("author")}}</dt> + <dd>Cria uma hiperligação que indica o autor do documento ou artigo atual. Compatível com elementos {{htmlelement('link')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. Quando usado com {{htmlelement('a')}} ou {{htmlelement('area')}}, aponta para um documento (ou <code>mailto:</code>) com informação sobre o autor ou do {{htmlelement('article')}} pai mais próximo (se existir), ou do documento em si. No caso de um elemento {{htmlelement('link')}}, aponta para informação sobre o autor do documento atual. + <p class="note">Nota: O atributo obsoleto <code>rev="made"</code> é tratado como <code>rel="alternate"</code></p> + </dd> + <dt>{{htmlattrdef("bookmark")}}</dt> + <dd>Compatível com elementos {{htmlelement('a')}} e {{htmlelement('area')}}, <code>bookmark</code> informa que o <em>link é</em> um <em>permalink</em> para uma secção pai, que pode ser o {{htmlelement('article')}} ou {{htmlelement('section')}} mais próximo. Se tal secção não existir, o <em>link</em> refere-se ou ao <em>heading</em> mais próximo (que pode ser irmão do link, ou descender de um pai comum).</dd> + <dt>{{htmlattrdef("canonical")}}</dt> + <dd>Compatível com {{htmlelement('link')}}. Define o URL ideal para o documento atual, que é útil para motores de busca.</dd> + <dt>{{htmlattrdef("dns-prefetch")}}</dt> + <dd>Compatível com {{htmlelement('link')}}, seja dentro do {{htmlelement('body')}} ou do {{htmlelement('head')}}. Alerta o <em>browser</em> para antecipadamente efetuar resolução de DNS para a origem do recurso apontado. É útil para recursos que provavelmente serão úteis para o utilizador, porque este será capaz de aceder aos recursos mais rapidamente. Consulte a página sobre <a href="/pt-PT/docs/">como utilizar o DNS <em>prefetch</em></a> para mais informações.</dd> + <dt>{{htmlattrdef("external")}}</dt> + <dd>Compatível com {{htmlelement('form')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. Indica que o documento referenciado não pertence ao <em>site </em>atual. Este valor é útil para estilizar links externos, e assim informar os utilizadores de que, se ativarem o elemento, vão abandonar o site atual.</dd> + <dt>{{htmlattrdef("help")}}</dt> + <dd>Compatível com {{htmlelement('form')}}, {{htmlelement('link')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. Usado para representar uma ligação para conteúdo informativo sobre o pai do elemento com a hiperligação (e descendentes desse mesmo pai). Se um <code><link></code> contiver este valor, então o documento referenciado serve de apoio para o documento atual (em geral). Quando o valor está presente num elemento {{htmlelement('a')}} ou {{htmlelement('area')}}, o cursor {{cssxref('cursor')}} passará a <code>help</code> em vez de <code>pointer</code> (se possível).</dd> + <dt>{{htmlattrdef("icon")}}</dt> + <dd> + <p>Compatível com {{htmlelement('link')}}. Indica que o recurso referenciado é um ícone representativo do documento atual.</p> + + <p>Este valor é principalmente utilizado para definir um <em>favicon</em>:</p> + + <pre class="brush: html notranslate"><link rel="icon" href="favicon.ico"></pre> + + <p>Se houverem vários elementos <code><link rel="icon"></code>, então o <em>browser</em> deduz que <em>favicon</em> utilizar com base nos atributos <a href="media"><code>media</code></a>, <a href="type"><code>type</code></a>, e <a href="sizes"><code>sizes</code></a>. Caso mais que um destes elementos sejam os mais adequados (com base nestes critérios), então o <em>browser</em> seleciona o último destes. Se, posteriormente, o ícone mais adequado deixar de o ser, então o <em>browser </em>passa a usar o próximo ícone mais adequado.</p> + + <p><strong>Nota:</strong> para selecionar um ícone para um Web Clip ou para <em>placeholder</em> de arranque, o sistema iOS da Apple não usa nem este tipo de <em>link</em> nem o atributo <a href="sizes"><code>sizes</code></a>. Ao contrário de outros <em>browsers mobile</em>, este sistema usa os valores <a class="external external-icon" href="https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4"><code>apple-touch-icon</code></a> e <a class="external external-icon" href="https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW6"><code>apple-touch-startup-image</code></a> respetivamente. Estes valores não são considerados <em>standard</em>.</p> + + <p class="note">O valor <code>shortcut</code> é frequentemente encontrado antes de <code>icon</code>, mas <strong>já não deve ser utilizado por autores na <em>web</em></strong>. <em>shortcut</em> não pertence a uma especificação, e é ignorado por diversos <em>browsers.</em> </p> + </dd> + <dt>{{htmlattrdef("license")}}</dt> + <dd> + <p>Compatível com elementos {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("form")}}, {{HTMLElement("link")}}. O valor indica que a hiperligação aponta para informação de licenciamento relativa ao documento atual. Deste modo, sabe-se que o conteúdo principal do documento atual está protegido pela licença de <em>copyright </em>descrita no documento referenciado. Mesmo quando utilizado num descendente que não pertence ao elemento {{HTMLElement("head")}}, não há distinção entre uma hiperligação para uma licença associada ou a parte do documento ou ao documento em geral. Esta distinção só é possível através da informação na página.</p> + + <pre class="brush: html notranslate"><link rel="license" href="#license"></pre> + + <p><strong>Nota:</strong> Apesar de reconhecido, o valor "equivalente" <code>copyright</code> não é correto, pelo que deve ser evitado.</p> + </dd> + <dt>{{htmlattrdef("manifest")}}</dt> + <dd><a href="/en-US/docs/Web/Manifest">Manifesto <em>web app</em></a>. Requer o protocolo CORS para adquirir dados de origens diferentes (<em>cross-origin</em>).</dd> + <dt>{{htmlattrdef("modulepreload")}}</dt> + <dd>Útil para questões de <em>performance</em>, compatível com elementos {{htmlelement('link')}} em todo o documento. Informa o <em>browser </em>de que este deve antecipadamente descarregar o <em>script </em>referenciado (com as dependências respetivas), e armazená-lo no módulo de mapa de módulos para futura avaliação. Hiperligações com <code>modulepreload</code> podem ser usados para garantir que o recurso é descarregado com o módulo pronto (mas não avaliado) no mapa de módulo ainda antes de ser necessário. Veja também a página sobre <a href="/en-US/docs/Web/HTML/Link_types/modulepreload">tipos de <em>link</em>: <code>modulepreload</code></a>.</dd> + <dt>{{htmlattrdef("next")}}</dt> + <dd>Compatível com {{htmlelement('form')}}, {{htmlelement('link')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. Indica que o documento atual pertence a uma série de documentos, e que o documento na série que se segue é referenciado pelo elemento em questão. Quando o valor está presente num elemento <code><link></code>, os <em>browsers</em> podem assumir que este recurso vai ser necessário posteriormente, e considerar esta informação uma "resource hint" (dica de recurso que podem descarregar antecipadamente).</dd> + <dt>{{htmlattrdef("nofollow")}}</dt> + <dd>Compatível com {{htmlelement('form')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. <code>nofollow</code> informa <em>spiders </em>(de motores de busca) de que devem ignorar a relação definida pelo <em>link</em>. Este valor pode indicar que o dono do documento atual não confia ou aprova o documento referenciado. <code>nofollow</code> é frequentemente incluído por <em>Search Engine Optimizers</em> (otimizadores de motores de busca) para dar a impressão de que os seus <em>link farms</em> não são páginas de <em>spam</em>.</dd> + <dt>{{htmlattrdef("noopener")}}</dt> + <dd>Compatível com {{htmlelement('form')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. Quando selecionado, o <em>link</em> cria um contexto de navegação de topo (<em>top-level browsing context</em>) que não é auxiliar (<em>auxiliary</em>), mesmo que tenha condições para criar um contexto auxiliar (ex.: por ter um valor para<code> target </code>adequado). Por outras palavras, o <em>link</em> comporta-se como se <code><a href="/en-US/docs/Web/API/Window/opener">window.opener</a></code> fosse nulo e <code><a href="target">target</a>="_parent"</code> estivesse definido.<br> + <br> + <code>noopener</code> faz o contrário de {{anch("opener")}}.</dd> + <dt>{{htmlattrdef("noreferrer")}}</dt> + <dd>Compatível com {{htmlelement('form')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. Quando incluído, o <em>referrer </em>(página com referência para o recurso) desconhecido. Deste modo, o pedido não inclui <code>Referer</code> no <em>header, </em>e cria um contexto de navegação de topo (<em>top-level browsing context</em>), como se <code>noopener</code> também estivesse definido.</dd> + <dt>{{htmlattrdef("opener")}}</dt> + <dd>Cria um contexto de navegação auxiliar (<em>auxiliary browsing context</em>), mesmo que o <em>link</em> tenha características para criar um contexto de navegação que não fosse auxiliar (via <code>target="_blank"</code>).</dd> + <dd><code>opener</code> faz o contrário de {{anch("noopener")}}.</dd> + <dt>{{htmlattrdef("pingback")}}</dt> + <dd>Define o endereço do servidor de <em>pingback</em> que controla <em>pingbacks</em> para o documento atual.</dd> + <dt>{{htmlattrdef("preconnect")}}</dt> + <dd>Define que o <em>user agent </em>deve antecipadamente conectar-se à origem do recurso apontado.</dd> + <dt>{{htmlattrdef("prefetch")}}</dt> + <dd>Define que o <em>user agent</em> deve antecipadamente descarregar e guardar em <em>cache</em> o recurso apontado. Deste modo, o recurso fica pronto se requisitado posteriormente.</dd> + <dt>{{htmlattrdef("preload")}}</dt> + <dd>Define que o <em>user agent</em> deve antecipadamente descarregar e guardar em <em>cache</em> o recurso apontado para a navegação atual. Deste modo, o recurso está preparado para ser usado num potencial destino da navegação, definido pelo atributo <code><a href="as">as</a></code> (a prioridade associada a este destino também é considerada).</dd> + <dt>{{htmlattrdef("prerender")}}</dt> + <dd>Define que o <em>user agent </em>deve antecipadamente descarregar e renderizar o recurso apontado, acelerando respostas a pedidos equivalentes.</dd> + <dt>{{htmlattrdef("prev")}}</dt> + <dd> + <p>Equivalente à palavra-chave {{anch("next")}}, compatível com os elementos {{htmlelement('form')}}, {{htmlelement('link')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. O valor <code>prev</code> indica que o documento atual pertence a uma série de documentos, sendo o link referenciado para o documento que se segue ao atual.</p> + + <p>Nota: O valor sinónimo <code>previous</code> não deve ser usado incorrect and should not be used, porque é incorreto.</p> + </dd> + <dt>{{htmlattrdef("search")}}</dt> + <dd> + <p>Compatível com elementos {{htmlelement('form')}}, {{htmlelement('link')}}, {{htmlelement('a')}}, e {{htmlelement('area')}}. <code>search</code> indica que o <em>link</em> referencia um documento com uma <em>interface</em> para pesquisar por conteúdo do documento atual, seja no <em>site </em>ou em recursos relacionados.</p> + + <p>Se o atributo <code><a href="type">type</a></code> do elemento for <code>application/opensearchdescription+xml,</code> então o recurso apontado é um <em>plugin</em> <a href="/en-US/docs/Creating_OpenSearch_plugins_for_Firefox">OpenSearch</a> que pode ser facilmente adicionado a alguns <em>browsers,</em> como o Firefox ou o Internet Explorer.</p> + </dd> + <dt>{{htmlattrdef("stylesheet")}}</dt> + <dd> + <p>Compatível com elementos {{htmlelement('link')}}. Importa um recurso externo que é uma <em>stylesheet</em> (folha de estilos). Caso o <em>link</em> aponte para uma <em>stylesheet</em> do tipo <code>text/css</code>, então pode-se omitir o atributo <code><a href="type">type</a></code>.</p> + + <p>Apesar do valor identificar o <em>link </em>como uma <em>stylesheet</em>, outros atributos ou valores poderão determinar se esta é descarregada ou usada.</p> + + <p>Quando o valor <code>stylesheet</code> é usado em conjunto com {{anch('alternate')}}, passa a definir uma <em>stylesheet</em> alternativa. Neste caso, deve ter o atributo <code><a href="type">title</a></code> com um valor não-vazio.</p> + + <p>O recurso <em>stylesheet</em> externo não será usado nem descarregado em contextos multimédia que não correspondam ao definido pelo atributo <code><a href="media">media</a></code> (ex.: se o <em>link</em> para a <em>stylesheet </em>tiver um atributo <code>media </code>com valor "print", então a <em>stylesheet</em> não será descarregada quando a página é renderizada numa tela).</p> + + <p>Requer o uso do protocolo CORS para pedidos com origens diferentes.</p> + </dd> + <dt>{{htmlattrdef("tag")}}</dt> + <dd>Compatível com elementos {{htmlelement('a')}} e {{htmlelement('area')}}. Define que o <em>link </em>referenciado identifica uma palavra-chave<em> </em>que se aplica ao documento atual. Este tipo de <em>link</em> não deve identificar palavras-chave numa <em>tag cloud</em>, porque estas aplicam-se apenas a um grupo de páginas, e não a uma página só (que é o objetivo do valor <code>tag</code>).</dd> +</dl> + +<h3 id="Valores_que_não_são_standard">Valores que não são <em>standard</em></h3> + +<dl> + <dt>apple-touch-icon-precomposed</dt> + <dd> + <pre class="brush: html notranslate"> <!-- iPad de terceira geração com tela Retina de alta resolução: --> + <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/static/img/favicon144.e7e21ca263ca.png"> + <!-- iPhone com tela Retina de alta resolução: --> + <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/static/img/favicon114.d526f38b09c5.png"> + <!-- iPad de primeira e segunda gerações: --> + <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/static/img/favicon72.cc65d1d762a0.png"> + <!-- iPhone e iPod Touch sem telas Retina, e dispositivos Android 2.1 ou superior: --> + <link rel="apple-touch-icon-precomposed" href="/static/img/favicon57.de33179910ae.png"> + <!-- favicon básico --> + <link rel="shortcut icon" href="/static/img/favicon32.7f3da72dcea1.png"></pre> + </dd> +</dl> + +<h2 id="Compatibilidade_de_Browsers_do_atributo_rel_em_geral">Compatibilidade de Browsers do atributo <em>rel </em>em geral</h2> + +<div class="hidden">Esta tabela de compatibilidade de <em>browsers</em> é gerada automaticamente a partir de dados organizados. Se quiser contribuir ao atualizar os dados, veja <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e envie-nos um <em>pull request</em>.</div> + +<p>{{Compat("html.elements.attributes.rel")}}</p> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Estado</th> + <th scope="col">Comentários</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'links.html#linkTypes', 'rel attribute')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Adicionado <code>opener</code>. <code>noopener</code> passou a ser definido por omissão com <code>target="_blank"</code>.</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'links.html#linkTypes', 'rel attribute')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Adicionados <code>tag</code>, <code>search</code>, <code>prefetch</code>, <code>noreferrer</code>, <code>nofollow</code>, <code>icon</code>, e <code>author</code>.<br> + <code>copyright</code> passou a ser <code>license</code>.<br> + Removidos <code>start</code>, <code>chapter</code>, <code>section</code>, <code>subsection</code>, e <code>appendix</code></td> + </tr> + <tr> + <td>{{SpecName("Preload", "#x2.link-type-preload", "preload")}}</td> + <td>{{Spec2("Preload")}}</td> + <td>Adicionado <code>preload</code>.</td> + </tr> + <tr> + <td>{{SpecName("Resource Hints", "#dfn-preconnect", "preconnect")}}</td> + <td>{{Spec2("Resource Hints")}}</td> + <td>Adicionados <code>dns-prefetch</code>, <code>preconnect</code>, e <code>prerender</code>.</td> + </tr> + <tr> + <td>{{SpecName("HTML4.01", "types.html#type-links", "link types")}}</td> + <td>{{Spec2("HTML4.01")}}</td> + <td>Adicionados <code>alternate</code>, <code>stylesheet</code>, <code>start</code>, <code>chapter</code>, <code>section</code>, <code>subsection</code>, <code>appendix</code>, e <code>bookmark</code>.<br> + <code>previous</code> passou a ser <code>prev</code>.<br> + Removidos <code>top</code>, e <code>search</code>.</td> + </tr> + <tr> + <td>{{SpecName("HTML3.2", "#link", "<link>")}}</td> + <td> + <p>{{Spec2("HTML3.2")}}<span class="spec-Obsolete"> (Obsoleto)</span></p> + </td> + <td>Adicionados <code>top</code>, <code>contents</code>, <code>index</code>, <code>glossary</code>, <code>copyright</code>, <code>next</code>, <code>previous</code>, <code>help</code>, e <code>search</code>.</td> + </tr> + <tr> + <td>{{RFC(1866, "HTML 2.0")}}</td> + <td>{{Spec2("HTML2.0")}}<span class="spec-Obsolete">(Obsolete)</span></td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_de_Browsers_de_valores_rel_para_elementos_link">Compatibilidade de <em>Browsers </em>de valores <em>rel </em>para elementos <em>link</em></h2> + +<p class="hidden">Esta tabela de compatibilidade de <em>browsers</em> é gerada automaticamente a partir de dados organizados. Se quiser contribuir ao atualizar os dados, veja <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e envie-nos um <em>pull request</em>.</p> + +<p>{{Compat("html.elements.link.rel")}}</p> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>{{domxref("HTMLLinkElement.relList")}}</li> + <li>{{domxref("HTMLAnchorElement.relList")}}</li> + <li>{{domxref("HTMLAreaElement.relList")}}</li> +</ul> |