aboutsummaryrefslogtreecommitdiff
path: root/files/pt-pt/orphaned/tutorial_xul
diff options
context:
space:
mode:
authorFlorian Merz <me@fiji-flo.de>2021-02-11 14:50:24 +0100
committerFlorian Merz <me@fiji-flo.de>2021-02-11 14:50:24 +0100
commit2c2df5ea01eb5cd8b9ea226b2869337e59c5fe3e (patch)
tree86ab4534d10092b293d4b7ab169fe1a8a2421bfa /files/pt-pt/orphaned/tutorial_xul
parent8260a606c143e6b55a467edf017a56bdcd6cba7e (diff)
downloadtranslated-content-2c2df5ea01eb5cd8b9ea226b2869337e59c5fe3e.tar.gz
translated-content-2c2df5ea01eb5cd8b9ea226b2869337e59c5fe3e.tar.bz2
translated-content-2c2df5ea01eb5cd8b9ea226b2869337e59c5fe3e.zip
unslug pt-pt: move
Diffstat (limited to 'files/pt-pt/orphaned/tutorial_xul')
-rw-r--r--files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html77
-rw-r--r--files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html89
-rw-r--r--files/pt-pt/orphaned/tutorial_xul/index.html52
-rw-r--r--files/pt-pt/orphaned/tutorial_xul/introdução/index.html61
4 files changed, 279 insertions, 0 deletions
diff --git a/files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html b/files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html
new file mode 100644
index 0000000000..98cc27b169
--- /dev/null
+++ b/files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html
@@ -0,0 +1,77 @@
+---
+title: Adicionando botões
+slug: Tutorial_XUL/Adicionando_botões
+tags:
+ - PrecisaDeRevisãoEditorial
+ - Todas_as_Categorias
+ - Tutorial_XUL
+ - XUL
+---
+<p>
+</p>
+<h3 id="Adicionando_Bot.C3.B5es_a_uma_Janela" name="Adicionando_Bot.C3.B5es_a_uma_Janela"> Adicionando Botões a uma Janela </h3>
+<p>A janela que nós criamos não possuía nada, então ainda não é muito interessante. Nessa sessão, iremos adicionar dois botões, um botão "Find" e outro "Cancel". Iremos também aprender uma maneira simples de posicionar os botões na janela.
+</p><p>Como em HTML, XUL tem uma série de tags que podem ser usadas para criar UIs. A mais básica delas é a tag <code>{{ XULElem("button") }}</code>. Este elemento é usado para criar botões simples.
+</p><p>O elemento botão tem duas propriedades principais associadas a ele, uma <code>label</code> uma <code>image</code>. Você precisará ao menos de uma delas ou das duas para criar um botão simples. Portanto, um botão pode ter apenas uma label (texto), uma imagem ou os dois juntos. Botões são geralmente usados para comandos OK e Cancel numa caixa de diálogo, por exemplo. Vale lembrar que não haverá erro caso não seja colocado nem uma label ou uma imagem, apenas o botão ficará em branco o que não é muito comum em interfaces.
+</p>
+<h4 id="Sintaxe_dos_Bot.C3.B5es" name="Sintaxe_dos_Bot.C3.B5es"> Sintaxe dos Botões </h4>
+<p>A tag <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:button">button</a></code> tem a seguinte sintaxe:
+</p>
+<pre>&lt;button
+ id="identifier"
+ class="dialog"
+ label="OK"
+ image="images/image.jpg"
+ disabled="true"
+ accesskey="t"/&gt;
+</pre>
+<p>Os atributos a seguir são todos opcionais:
+</p>
+<dl><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:id">id</a> </dt><dd> Um identificador único para o botão. Como já dissemos em sessões anteriores, muitos elementos terão esse identificador. Você deverá usar este atributo caso deseje referenciar o botão em um CSS ou script. Entretanto, é aconselhável que você coloque o atributo id mesmo que não vá referenciar o botão em nenhum lugar.
+</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:class">class</a> </dt><dd> A classe do botão. Tem o mesmo efeito do atributo "class" em HTML, usado para CSS. Neste caso, o valor <code>dialog</code> é usado.
+</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:label">label</a> </dt><dd> O texto que irá aparecer dentro do botão. Se for deixado em branco ou não for especificado, nenhum texto irá aparecer.
+</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:image">image</a> </dt><dd> A URL da imagem que aparecerá no botão. Se for deixado em branco ou não for especificado, nenhuma imagem irá aparecer. Você também pode especificar a imagem através da propriedade CSS <code><a href="pt/CSS/list-style-image">list-style-image</a></code>.
+</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:disabled">disabled</a> </dt><dd> Se este atributo for setado como <code>true</code>, o botão ficará desabilitado. Se um botão está desabilitado, as funções que ele possui não poderão ser executadas. O default para esta propriedade é o botão habilitado. Você também pode trocar o estado do botão com <a href="pt/JavaScript">JavaScript</a>.
+</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:accesskey">accesskey</a> </dt><dd> Esta propriedade designa uma letra como tecla de atalho. A letra especificada geralmente sublinhada no texto do botão. Caso não haja a letra especificada como atalho no texto escrito no atributo "label", a letra aparecerá no final do texto, entre parênteses. Quando o usuário pressionar a tecla ALT (ou a tecla similar em outras plataformas) e a letra de atalho, o botão será acionado.
+</dd></dl>
+<p>O botão possui diversas outras propriedades que podem ser vistas no link <a href="pt/XUL_Tutorial/More_Button_Features">Mais propriedades</a>.
+</p>
+<h4 id="Alguns_exemplos_de_bot.C3.B5es" name="Alguns_exemplos_de_bot.C3.B5es"> Alguns exemplos de botões </h4>
+<p><a class="external" href="http://developer.mozilla.org/samples/xultu/examples/ex_buttons_1.xul.txt">"Codigo Fonte"</a> : <a class="external" href="http://developer.mozilla.org/samples/xultu/examples/ex_buttons_1.xul">Visualizar</a>
+</p>
+<div class="float-right"><img alt="Image:buttons1.png"></div>
+<pre>&lt;button label="Normal"/&gt;
+&lt;button label="Disabled" disabled="true"/&gt;
+</pre>
+<p>O exemplo acima irá gerar os botões da imagem ao lado. O primeiro é um botã normal. O segundo está desabilitado, por isso aparece em tom de cinza.
+</p><p>Vamos começar criando um simples botão "Find", para nosso aplicativo de encontrar arquivos. O código abaixo mostra como fazer isso.
+</p>
+<pre>&lt;button id="find-button" label="Find"/&gt;
+</pre>
+<div class="note">Note que o Firefox não permite a você abrir janelas chrome de páginas Web, por isso os links "Visualizar" abrem em janelas normais do browser. Por esse motivo, os botões ocuparão toda a tela. Você pode adicionar o atributo align="start" na tag window para prevenir isso.</div>
+<div class="highlight">
+<h5 id="O_exemplo_findfile.xul" name="O_exemplo_findfile.xul"> O exemplo findfile.xul </h5>
+<p>Vamos adicionar o código acima ao arquivo findfile.xul criado na sessão anterior. O código precisa se inserido entre as tags <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a></code>. O código a ser adicionado está exibido em vermelho, abaixo:
+</p>
+<pre class="eval">&lt;?xml version="1.0"?&gt;
+&lt;?xml-stylesheet href="<a class=" external" rel="freelink">chrome://global/skin/</a>" type="text/css"?&gt;
+&lt;window
+ id="findfile-window"
+ title="Find Files"
+ orient="horizontal"
+ xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"&gt;
+
+ <span class="highlightred">&lt;button id="find-button" label="Find"/&gt;</span>
+ <span class="highlightred">&lt;button id="cancel-button" label="Cancel"/&gt;</span>
+
+&lt;/window&gt;
+</pre>
+<div class="float-right"><img alt="Image:buttons2.png"></div>
+Você irá notar que o botão "Cancel" foi adicionado. Foi dado à janela uma orientação horizontal fazendo com que os botões apareçam um ao lado do outro. Se você abrir o arquivo no Mozilla, você deverá ter alguma coisa parecida como a imagem ao lado.</div>
+<div class="note">Note que é aconselhável não colocar as labels diretamento no arquivo XUL. Devemos usar <a href="pt/XUL_Tutorial/Localization">entidades de forma que o texto seja facilmente traduzido</a>.</div>
+<p>Na próxima sessão, iremos encontrar como
+</p><p>In the next section, we will find out how to <a href="pt/XUL_Tutorial/Adding_Labels_and_Images"> adicionar labels e imagens em um arquivo XUL</a>. </p><p><small>See also <a href="pt/XUL_Tutorial/More_Button_Features">more button fetaures</a></small>
+</p><p>{{ PreviousNext("XUL Tutorial:Creating a Window", "XUL Tutorial:Adding Labels and Images") }}
+</p><p><span class="comment">Categorias</span>
+</p><p><span class="comment">Interwiki Language Links</span>
+</p>{{ languages( { "en": "en/XUL_Tutorial/Adding_Buttons", "es": "es/Tutorial_de_XUL/A\u00f1adiendo_botones", "ja": "ja/XUL_Tutorial/Adding_Buttons", "pl": "pl/Kurs_XUL/Dodawanie_przycisk\u00f3w" } ) }}
diff --git a/files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html b/files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html
new file mode 100644
index 0000000000..37e7ee87a8
--- /dev/null
+++ b/files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html
@@ -0,0 +1,89 @@
+---
+title: Criando uma janela
+slug: Tutorial_XUL/Criando_uma_janela
+tags:
+ - PrecisaDeAtualização
+ - Todas_as_Categorias
+ - Tutorial_XUL
+ - XUL
+---
+<p> </p>
+
+<h3 id="Criando_uma_aplica.C3.A7.C3.A3o_XUL" name="Criando_uma_aplica.C3.A7.C3.A3o_XUL">Criando uma aplicação XUL</h3>
+
+<p>Uma aplicação XUL pode ter qualquer nome mas ela precisa necessariamente ter a extensão <strong>.xul</strong>. A aplicação XUL mais simples tem a seguinte estrutura:</p>
+
+<pre>&lt;?xml version="1.0"?&gt;
+&lt;?xml-stylesheet href="chrome://global/skin/" type="text/css"?&gt;
+
+&lt;window
+ id="findfile-window"
+ title="Find Files"
+ orient="horizontal"
+ xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"&gt;
+&lt;!-- Other elements go here --&gt;
+&lt;/window&gt;
+</pre>
+
+<p>Esta janela não irá fazer nada já que ela não contém nenhum elemento de interação com o usuário (UI). Estes serão adicionados na próxima sessão. Abaixo segue uma explicação de cada linha do código acima:</p>
+
+<ol>
+ <li><strong>&lt;?xml version="1.0"?&gt;</strong><br>
+ Esta linha serve simplesmente para declarar que este é um arquivo XML. Você normalmente colocará essa linha no topo de cada arquivo XUL assim como você coloca a tag HTML em cada arquivo HTML.</li>
+ <li><strong>&lt;?xml-stylesheet href="<a class="external" rel="freelink">chrome://global/skin/</a>" type="text/css"?&gt;</strong><br>
+ Esta linha é usada para especificar o arquivo CSS que será usado pelo arquivo. Esta é a sintaxe que os arquivos XML usam para importar folhas de estilo. Nesse caso, importamos os CSS que se encontram na pasta global do pacote de skins. Repare que não foi designado um arquivo específico então o Mozilla irá determinar qual arquivo CSS será utilzado. Nesse caso, o arquivo global.css será selecionado. Este arquivo contém todas as declarações padrão para todos os elementos XUL. Pelo fato do XML não ter a capacidade de definir como os elementos serão exibidos, o CSS indica como fazê-lo. Geralmente, você colocará esta linha no topo de todos os arquivos XUL. Você poderá também importar um arquivo externo usando a mesma sintaxe. Note que você normalmente irá importar o CSS global de seu próprio arquivo.</li>
+ <li><strong>&lt;window</strong><br>
+ Esta linha declara que você está descrevendo um <a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a>. Cada janela de UI é descrita em um arquivo separado. Esta tag é semelhante à tag BODY do HTML, que engloba o conteúdo do arquivo. <a href="pt/XUL/window#Attributes">Muitos atributos</a> podem ser colocados na tag <a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a> -- nesse caso, são quatro. Neste exemplo, cada atributo é colocado em uma linha separada, mas não é preciso seguir essa regra.</li>
+ <li><strong>id="findfile-window"</strong><br>
+ O atributo <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:id">id</a></code> é usado como um identificador que é usado por scripts para ser rerefenciado. Normalmente é colocado um atributo <code>id</code> em todos os elementos. Você pode dar qualquer nome aos atributos, mas de preferência dê nomes que identifiquem para o que o atributo serve.</li>
+ <li><strong>title="Find Files"</strong><br>
+ O atributo <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:title">title</a></code> descreve o texto que irá aparecer na barra de título da janela quando ela é exibida. Nesse caso, o texto 'Find Files' irá aparecer.</li>
+ <li><strong>orient="horizontal"</strong><br>
+ O atributo <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:orient">orient</a></code> especifica o posicionamento dos itens na janela. O valor <code>horizontal</code> indica que os itens devem aparecer dispostos horizontalmente na janela. Você pode também usar o valor <code>vertical</code> para designar que os elementos aparecerão em forma de colunas. Como este é o valor default, você pode optar por não escrever esse atributo caso deseje que os elementos aparecam na vertical.</li>
+ <li><strong>xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"&gt;</strong><br>
+ Esta linha declara o namespace para o XUL, que você deve colocar em uma elemento janela de forma a indicar que todos os seus 'filhos' são XUL. Note que essa URL não é exibida para você. Mozilla irá reconhecer essa URL internamente.</li>
+ <li><strong><span class="nowiki">&lt;!-- Other elements go here --&gt;</span></strong><br>
+ Você pode substituir esse bloco de comentários por outros elementos (botões, menus e outros componentes de UI) que aparecerão na janela. Nós iremos adicionar alguns deles na próxima sessão.</li>
+ <li><strong>&lt;/window&gt;</strong><br>
+ E finalmente, precisamos fechar a tag <a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a> no final do arquivo.</li>
+</ol>
+
+<h3 id="Abrindo_uma_janela" name="Abrindo_uma_janela">Abrindo uma janela</h3>
+
+<p>Para abrir uma janela XUL, existem vários métodos que podem ser usados. Se você estiver apenas na fase de desenvolvimento, você pode simplesmente escrever a URL (como um chrome:, file: or outros tipos de URL) na barra de endereços do Mozilla. Você pode também dar um duplo-clique no nome do arquivo em seu diretório, assuminfo que os arquivos XUL estão associados com o Mozilla. A janela XUL irá aparecer na janela do browser como se fosse uma nova janela, mas isso é o suficiente durante o estágio de desevolvimento.</p>
+
+<p>A forma correta, é claro, é abrir a janela usando javascript. Nenhuma sintaxe nova é necessária, podendo ser usada a função <a href="pt/DOM/window.open">window.open()</a> como se fosse uma documento <a href="pt/HTML">HTML</a>. Entretanto, um parâmetro adicional com o valor 'chrome' é necessário para indicar ao browser será aberto um documento <a href="pt/DOM/window.open#Window_functionality_features">chrome</a>. Isso ira abrir a janela sem as barras de ferramenta e os menus. A sintaxe é descrita abaixo:</p>
+
+<pre>window.open(url,windowname,flags);
+
+onde o parâmetro 'flags' recebe o valor "chrome", como no exemplo:
+
+window.open("chrome://navigator/content/navigator.xul", "bmarks", "chrome,width=600,height=300");
+</pre>
+
+<div class="highlight">
+<h5 id="O_exemplo_findfile.xul" name="O_exemplo_findfile.xul">O exemplo findfile.xul</h5>
+
+<p>Vamos começar criando um arquivo básico para a janela 'Find File'. Crie um arquivo chamado findfile.xul e o coloque no diretório especificado no arquivo findfile.manifest (nós o criamos na sessão anterior). Adicione o exemplo mostrado anteriormente ao arquivo e salve-o.</p>
+</div>
+
+<p>Você pode usar o parâmetro da linha de comando '-chrome' para especificar o arquivo XUL a ser aberto quando o Mozilla iniciar. Se não for especificado nenhum arquivo, a janela padrão será aberta. (Normalmente a janela do browser.) Por exemplo, podemos abrir a janela 'Find Files' das seguintes formas:</p>
+
+<pre>mozilla -chrome chrome://findfile/content/findfile.xul
+
+mozilla -chrome resource:/chrome/findfile/content/findfile.xul
+</pre>
+
+<p>Se você executar este comando a partir de uma linha de comando (assumindo que você tem uma na sua plataforma), a janela 'Find Files' irá abrir como janela padrão, ao invés da janela do browser. Por nós ainda não termos inserido nenhum elemento de interação na janela, você não verá a janela aparecendo. Iremos adicionar alguns elementos na próxima sessão.</p>
+
+<p>Para ver o efeito, o link a seguir irá abrir a janela de favoritos:</p>
+
+<pre class="eval">mozilla -chrome <a class="external" rel="freelink">chrome://communicator/content/bookma...rksManager.xul</a>
+
+<span class="highlightred">Se você estiver usando o Firefox, utilize o link abaixo</span>
+firefox -chrome <a class="external" rel="freelink">chrome://browser/content/bookmarks/b...rksManager.xul</a>
+</pre>
+
+<p>O argumento '-chrome' não dá ao arquivo nenhum privilégio adicional. Ao contrário, ele abre o arquivo especificado como uma aba, sem barra de endereço ou menus. Apenas URL chromes tem privilégios adicionais.</p>
+
+<div class="note">No link <a class="external" href="http://ted.mielczarek.org/code/mozilla/extensiondev/">Extension Developer's Extension</a> você encontra um editor XUL que permite que você escreva códigos XUL e veja os resultados em tempo real sem o uso do Mozilla!</div>
diff --git a/files/pt-pt/orphaned/tutorial_xul/index.html b/files/pt-pt/orphaned/tutorial_xul/index.html
new file mode 100644
index 0000000000..30f3bbf77a
--- /dev/null
+++ b/files/pt-pt/orphaned/tutorial_xul/index.html
@@ -0,0 +1,52 @@
+---
+title: Tutorial XUL
+slug: Tutorial_XUL
+tags:
+ - Todas_as_Categorias
+ - Tutorial_XUL
+ - XUL
+---
+<p> </p>
+
+<p><br>
+ Este tutorial descreve <a href="pt/XUL">XUL</a>, a Linguagem <a href="pt/XML">XML</a> de Interface de Usuário. Esta linguagem foi criada para aplicações Mozilla e é usada para descrever sua interface de usuário.</p>
+
+<h3 id="Introdu.C3.A7.C3.A3o" name="Introdu.C3.A7.C3.A3o">Introdução</h3>
+
+<ul>
+ <li><a href="pt/Tutorial_XUL/Introdu%c3%a7%c3%a3o">Introdução</a></li>
+ <li><a href="pt/Tutorial_XUL/Estrutura_XUL">Estrutura XUL</a></li>
+ <li><a href="pt/Tutorial_XUL/A_URL_Chrome">A URL Chrome</a></li>
+ <li><a href="pt/Tutorial_XUL/Arquivos_de_manifesto">Arquivos de manifesto</a></li>
+</ul>
+
+<h3 id="Elementos_Simples" name="Elementos_Simples">Elementos Simples</h3>
+
+<ul>
+ <li><a href="pt/Tutorial_XUL/Criando_uma_janela">Criando uma janela</a></li>
+ <li><a href="pt/Tutorial_XUL/Adicionando_bot%c3%b5es">Adicionando botões</a></li>
+ <li><a href="pt/Tutorial_XUL/Adicionando_etiquetas_e_imagens">Adicionando etiquetas e imagens</a></li>
+ <li><a href="pt/Tutorial_XUL/Controles_de_entrada">Controles de entrada</a></li>
+ <li><a href="pt/Tutorial_XUL/Controles_listas">Controles listas</a></li>
+ <li><a href="pt/Tutorial_XUL/Adicionando_elementos_HTML">Adicionando elementos HTML</a></li>
+ <li><a href="pt/Tutorial_XUL/Usando_Espa%c3%a7adores">Usando espaçadores</a></li>
+ <li><a href="pt/Tutorial_XUL/Mais_caracter%c3%adsticas_do_bot%c3%a3o">Mais características do botão</a></li>
+</ul>
+
+<div class="note">
+<p>Este tutorial de XUL foi criado originalmente por <a class="external" href="http://www.xulplanet.com/ndeakin/">Neil Deakin</a>. Deu-nos a permissão de usá-lo no <abbr title="Mozilla Developer Center">MDC</abbr>.</p>
+</div>
+
+<div class="originaldocinfo">
+<h5 id="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original" name="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original">Informações Sobre o Documento Original</h5>
+
+<ul>
+ <li>Autor: <a class="external" href="http://www.xulplanet.com/ndeakin/">Neil Deakin</a></li>
+ <li>Última Atualização: 03/06/2005</li>
+ <li>Informações sobre Copyright: © 1999-2005 XULPlanet.com</li>
+</ul>
+</div>
+
+<p><span class="comment">Categorias</span></p>
+
+<p><span class="comment">Interwiki Language Links</span></p>
diff --git a/files/pt-pt/orphaned/tutorial_xul/introdução/index.html b/files/pt-pt/orphaned/tutorial_xul/introdução/index.html
new file mode 100644
index 0000000000..04753884df
--- /dev/null
+++ b/files/pt-pt/orphaned/tutorial_xul/introdução/index.html
@@ -0,0 +1,61 @@
+---
+title: Introdução
+slug: Tutorial_XUL/Introdução
+tags:
+ - PrecisaDeAtualização
+ - Todas_as_Categorias
+ - Tutorial_XUL
+ - XUL
+---
+<p> </p>
+
+<p>Este tutorial guiará você no aprendizado de <a href="pt/XUL">XUL</a> (<a href="pt/XML">XML</a> User Interface Language), que é uma linguagem multi-plataforma para descrever interfaces (usuário) de aplicações.</p>
+
+<p>Este tutorial demonstrará a criação de uma interface simples de procura de arquivos, similar à provida pelo Sherlock do Macintosh ou o diálogo de procura de arquivos no Windows. Note que só será criada a interface do usuário, junto com algumas funcionalidades limitadas. A procura real por arquivos não será implementada. Uma linha azul aparecerá à esquerda de um parágrafo quando o diálogo de procura de arquivos tiver sido modificado. Você pode seguir através dessas sessões.</p>
+
+<h3 id="O_que_.C3.A9_XUL_e_por_que_foi_criado.3F" name="O_que_.C3.A9_XUL_e_por_que_foi_criado.3F">O que é XUL e por que foi criado?</h3>
+
+<p><abbr title="XML User-interface Language">XUL</abbr> (pronouncia-se zúl, quase como azul - ou cool, em inglês) foi criado para tornar o desenvolvimento do navegador Mozilla mais fácil e rápido. É uma linguagem <abbr title="eXtensible Markup Language">XML</abbr> de modo que todas as características disponíveis para XML estão também disponíveis para XUL.</p>
+
+<p>A maioria das aplicações precisa ser desenvolvida usando características de uma plataforma específica, o que torna a construção de software multi-plataforma cara e demorada. Isso pode não ser importante para alguns, mas usuários podem desejar usar uma aplicação em outros dispositivos tais como computadores de mão.</p>
+
+<p>Um número de soluções multi-plataformas foi desenvolvido no passado. Java, por exemplo, tem portabilidade como um ponto chave. XUL é um projeto de linguagem semelhante especificamente projetado para a criação de interfaces de usuário portáteis.</p>
+
+<p>É levado um longo tempo para construir uma aplicação, mesmo para uma só plataforma. O tempo necessário para compilar e depurar pode ser longo. Com XUL, uma interface pode ser implementada e modificada rápida e facilmente.</p>
+
+<p>XUL tem todas as vantagens de outras linguagens XML. Por exemplo, <abbr title="eXtensible HyperText Markup Language">XHTML</abbr> ou outras linguagens XML tais como o <abbr title="Math Markup Language">MathML</abbr> ou o <abbr title="Scalable Vector Graphics">SVG</abbr> podem ser inseridas nela. Além disso, texto apresentado com XUL é facilmente localizável, o que significa que pode ser traduzido para outros idiomas com pouco esforço. Folhas de estilo podem ser aplicadas para modificar a aparência da interface de usuário (como os skins ou características de temas no WinAmp ou alguns gerenciadores de janelas).</p>
+
+<h3 id="Que_esp.C3.A9cies_de_interfaces_para_usu.C3.A1rio_podem_ser_feitas_com_XUL.3F" name="Que_esp.C3.A9cies_de_interfaces_para_usu.C3.A1rio_podem_ser_feitas_com_XUL.3F">Que espécies de interfaces para usuário podem ser feitas com XUL?</h3>
+
+<p>XUL provê a capacidade de criar a maioria dos elementos encontrados em interfaces gráficas modernas. É genérico o suficiente para que possa ser aplicado às necessidades especiais de certos dispositivos e poderoso o suficiente para que desenvolvedores possam criar interfaces sofisticadas com ele.</p>
+
+<p>Alguns elementos que podem ser criados são:</p>
+
+<ul>
+ <li>Controles de entrada tais como caixas de texto e de checagens (textboxes e checkboxes)</li>
+ <li>Barras de ferramentas com botões ou outros conteúdos</li>
+ <li>Menus em uma barra de menus or menus flutuantes (pop ups)</li>
+ <li>Diálogos organizados em abas</li>
+ <li>Árvores para informação hierárquica ou tabular</li>
+ <li>Atalhos de teclado</li>
+</ul>
+
+<p>O conteúdo exibido pode ser criado a partir de arquivos XUL ou com dados vindos de uma fonte de dados (datasource). No Mozilla, tais fontes de dados incluem uma caixa de correios de usuário, seus marcadores e resultados de buscas. O conteúdo de menus, árvores e outros elementos pode ser habitado com esses dados, ou com seus próprios dados supridos por um arquivo RDF.</p>
+
+<p>O conteúdo XUL pode ser lido de um arquivo local ou de um site remoto. Pode também ser empacotado em um instalador que o usuário copie através de download e instale. Este último método dá à aplicação privilégios adicionais, tais como leitura de arquivos locais e modificação das preferências do usuário.</p>
+
+<p>XUL é atualmente armazenado em arquivos com a extensão .xul. Você pode abrir um arquivo XUL com o Mozilla tanto como com qualquer outro arquivo, usando o comando Abrir Arquivo do menu Arquivo ou escrevendo a URL na barra de endereços.</p>
+
+<p>Quando lendo conteúdo XUL de um site remoto, você deve configurar seu servidor web para enviar arquivos XUL com o tipo de conteúdo 'application/vnd.mozilla.xul+xml'.</p>
+
+<h3 id="O_que_preciso_saber_para_usar_este_tutorial.3F" name="O_que_preciso_saber_para_usar_este_tutorial.3F">O que preciso saber para usar este tutorial?</h3>
+
+<p>Você precisa ter um conhecimento de <a href="pt/HTML">HTML</a> e um mínimo de conhecimento básico de <a href="pt/XML">XML</a> e <a href="pt/CSS">CSS</a>. Aqui estão algumas normas para manter em mente:</p>
+
+<ul>
+ <li>Todos os elementos e atributos XUL precisam ser escritos em caixa baixa (todos minúsculos), visto que XML é sensível à caixa (diferente de HTML).</li>
+ <li>Valores de atributo em XML devem ser colocados entre aspas, mesmo que sejam números.</li>
+ <li>Arquivos XUL são usualmente divididos em quatro arquivos, um deles para esboço e elementos, para declarações de estilo, para declarações de entidade (usadas para localização) e para scripts. Adicionalmente, você pode ter arquivos extra para imagens ou para dados específicos da plataforma.</li>
+</ul>
+
+<p>XUL é suportado no Mozilla e em navegadores baseados nele, tais como o Netscape 6 ou posterior e Mozilla Firefox. Devido a várias mudanças na sintaxe XUL através do tempo, você deverá pegar a última versão para os exemplos funcionarem corretamente.</p>