<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:blogger='http://schemas.google.com/blogger/2008' xmlns:georss='http://www.georss.org/georss' xmlns:gd="http://schemas.google.com/g/2005" xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-3328448332534498582</id><updated>2024-11-01T03:33:11.326-07:00</updated><category term="artigos"/><category term="diario"/><category term="da"/><category term="informatica"/><category term="java"/><category term="programacao"/><category term="basico"/><category term="jdk"/><category term="jre"/><category term="noticias"/><category term="de"/><category term="eclipse"/><category term="engenharia"/><category term="so"/><category term="linux"/><category term="dados"/><category term="softwares"/><category term="uml"/><category term="android"/><category term="apple"/><category term="banco"/><category term="sistemas"/><category term="software"/><category term="desenvolvimento"/><category term="diagramas"/><category term="entrada"/><category term="eua"/><category term="globo"/><category term="ide"/><category term="operacionais"/><category term="paradigma"/><category term="programas"/><category term="saída"/><category term="smartphone"/><category term="tutoriais"/><category term="ubuntu"/><category term="usa"/><category term="windows"/><category term="12.04"/><category term="america"/><category term="atividade"/><category term="ativistas"/><category term="blackberry"/><category term="c3"/><category term="c5"/><category term="casos"/><category term="chat"/><category term="ciomputacao"/><category term="cloud"/><category term="code"/><category term="coke"/><category term="compilador"/><category term="computing"/><category term="conferencia"/><category term="confiabilidade"/><category term="confiavel"/><category term="cream"/><category term="db"/><category term="ddl"/><category term="debian"/><category term="desktop"/><category term="diagrama"/><category term="dml"/><category term="documentacao"/><category term="dql"/><category term="editor"/><category term="engenheira"/><category term="entidade"/><category term="er"/><category term="espionagem"/><category term="estados"/><category term="estavel"/><category term="galaxy"/><category term="games"/><category term="gnome"/><category term="google"/><category term="ice"/><category term="implantação"/><category term="informatiica"/><category term="informação"/><category term="invaders"/><category term="ios"/><category term="ipad"/><category term="iphone"/><category term="j2se"/><category term="jobs"/><category term="jogos"/><category term="joptionpane"/><category term="ling"/><category term="lion"/><category term="lista"/><category term="macos"/><category term="manipulando"/><category term="maquina"/><category term="meego"/><category term="mensagem"/><category term="microsoft"/><category term="modelagem"/><category term="modelos"/><category term="mulheres"/><category term="mundo"/><category term="nokia"/><category term="nuvem"/><category term="obama"/><category term="ola"/><category term="operacional"/><category term="operacoes"/><category term="oracle"/><category term="outlook"/><category term="paradigm"/><category term="phone"/><category term="processos"/><category term="protesto"/><category term="rad"/><category term="relacional"/><category term="relacionamento"/><category term="relação"/><category term="requisitos"/><category term="samsung"/><category term="scanner"/><category term="segurança"/><category term="sistema"/><category term="skydrive"/><category term="skype"/><category term="space"/><category term="sql"/><category term="steve"/><category term="symbian"/><category term="tecnologia"/><category term="testing"/><category term="unidos"/><category term="unity"/><category term="uso"/><category term="variavel"/><category term="video"/><category term="virtual"/><category term="virtualbox"/><category term="visual"/><category term="x"/><category term="xing"/><title type='text'>Diário da Informática</title><subtitle type='html'></subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default?redirect=false'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><link rel='next' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default?start-index=26&amp;max-results=25&amp;redirect=false'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>33</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>25</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-6261570320617890449</id><published>2013-07-18T03:57:00.000-07:00</published><updated>2013-07-18T03:57:39.532-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="eclipse"/><category scheme="http://www.blogger.com/atom/ns#" term="entrada"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="joptionpane"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="mensagem"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><category scheme="http://www.blogger.com/atom/ns#" term="saída"/><title type='text'>Programação - Java Básico 07 - Mensagens de Entrada e Saída (Interface Gráfica)!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2pP6IxK0vJZ6Dteg2a9QhC65lCLY-PzM53eR7JcwnahEx_HnlLi4GTF_-fkV-JWe0csyalKH-QHLUGQ5JBJw7NAIxQFU8k_0tZLMOonCWTWP8dv_PzhNhDqbHunlHU4KuP-I1qJq0g44p/s1600/joptionpane-showconfirmdialog-exemplo1.gif&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2pP6IxK0vJZ6Dteg2a9QhC65lCLY-PzM53eR7JcwnahEx_HnlLi4GTF_-fkV-JWe0csyalKH-QHLUGQ5JBJw7NAIxQFU8k_0tZLMOonCWTWP8dv_PzhNhDqbHunlHU4KuP-I1qJq0g44p/s1600/joptionpane-showconfirmdialog-exemplo1.gif&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;O que nos diferencia é a escolha que fazemos, mesmo quando só há um caminho a seguir!&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Até agora em nossas postagens, vimos como capturar entradas do usuário, tratar este valor e exibir saídas, porém tudo em cima da interface modo texto.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Hoje veremos como trabalhar com janelas de Diálogo de entrada e saída que, em JAVA, a classe responsável por isso é a JOptionPane.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
A JOptionPane, como muitos elementos da interface gráfica na linguagem, faz parte da biblioteca &lt;b&gt;javax.swing.*&lt;/b&gt;, logo precisaremos declarar com o &lt;b&gt;import&lt;/b&gt; antes de iniciarmos a classe:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;import&lt;/b&gt; javax.swing.JOptionPane;&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
A classe JOptionPane tem dois métodos padrões que realizam as operações de exibição de mensagem (saída) e captura de dados (entrada), que são eles, respectivamente: &lt;b&gt;showMessageDialog(ComponentePai, Mensagem)&lt;/b&gt; e &lt;b&gt;showInputDialog(Mensagem);&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
No primeiro, o &lt;b&gt;ComponentePai&lt;/b&gt; nós vamos ignorá-lo por enquanto e colocar o valor nulo (&lt;b&gt;null&lt;/b&gt;), e ainda no primeiro, o segundo parâmetro (&lt;b&gt;Mensagem&lt;/b&gt;) é onde nós passamos o que será visualizado pelo usuário.&lt;/div&gt;
&lt;br /&gt;
Exemplo:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
JOptionPane.showMessageDialog(null, &quot;Olá mundo&quot;);&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguYMfUZ-baa0ouc64KpaSS3peZfOqx-ZtS533oHahCrPNljwIizw0rOKi0QWyTFkqRPGa7Y2LD4kng4t_KCcgFV4ZbvJYn3C9YfDZ2dwFPXn6TQG68WrHx9R7eTbXwA_o1VC5U0Rtn3gJb/s1600/joptionpanemessage.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguYMfUZ-baa0ouc64KpaSS3peZfOqx-ZtS533oHahCrPNljwIizw0rOKi0QWyTFkqRPGa7Y2LD4kng4t_KCcgFV4ZbvJYn3C9YfDZ2dwFPXn6TQG68WrHx9R7eTbXwA_o1VC5U0Rtn3gJb/s1600/joptionpanemessage.png&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O segundo método (showInputDialog) possui somente um parâmetro (&lt;b&gt;Mensagem&lt;/b&gt;), que é idêntico ao de mesmo nome do primeiro método.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
A diferença deste é que ele tem como retorno uma String, fazendo com que o programa possa capturar e manipular um valor inserido pelo usuário.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;String nome = JOptionPane.showInputDialog(&quot;Qual o seu nome?&quot;);&lt;/b&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
JOptionPane.showMessageDialog(null, &quot;O seu nome é &quot;+nome);&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvq6YqqwF7uS3bN0QvBgZaGo6cv5a5oenSAbF0exgoAC2PibJp4aOo-bsljNHDiOo54aMpG2TINmk1EE22BJnUdTFnpW_T-oEA1URJJOBuiqFrMS_ahK-8e0j8mRLB7e735pC7m5KPaR5n/s1600/joptionpaneinput.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvq6YqqwF7uS3bN0QvBgZaGo6cv5a5oenSAbF0exgoAC2PibJp4aOo-bsljNHDiOo54aMpG2TINmk1EE22BJnUdTFnpW_T-oEA1URJJOBuiqFrMS_ahK-8e0j8mRLB7e735pC7m5KPaR5n/s1600/joptionpaneinput.png&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
Então o nosso programinha ficaria assim:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;import&lt;/b&gt; javax.swing.JOptionPane;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;public class&lt;/b&gt; EntradasGrafica {&lt;br /&gt;
&lt;b&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp; public static void&lt;/b&gt; main(String[] args) {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp;&amp;nbsp; String nome = JOptionPane.showInputDialog(&quot;Qualo seu nome?&quot;);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp;&amp;nbsp; JOptionPane.showMessageDialog(null, &quot;O seu nome é &quot;+nome);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Na próxima veremos como converter valores texto para números, daí poderemos capturar entradas do usuário, transformar em numérico e realizar operações matemáticas.&lt;/div&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;b&gt;&lt;i&gt;Ass.: David de Almeida Bezerra Júnior&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/6261570320617890449/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-07-mensagens-de.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/6261570320617890449'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/6261570320617890449'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-07-mensagens-de.html' title='Programação - Java Básico 07 - Mensagens de Entrada e Saída (Interface Gráfica)!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2pP6IxK0vJZ6Dteg2a9QhC65lCLY-PzM53eR7JcwnahEx_HnlLi4GTF_-fkV-JWe0csyalKH-QHLUGQ5JBJw7NAIxQFU8k_0tZLMOonCWTWP8dv_PzhNhDqbHunlHU4KuP-I1qJq0g44p/s72-c/joptionpane-showconfirmdialog-exemplo1.gif" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-8381517846771630259</id><published>2013-07-17T04:14:00.000-07:00</published><updated>2013-07-17T04:14:17.436-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="eclipse"/><category scheme="http://www.blogger.com/atom/ns#" term="entrada"/><category scheme="http://www.blogger.com/atom/ns#" term="ide"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><category scheme="http://www.blogger.com/atom/ns#" term="saída"/><category scheme="http://www.blogger.com/atom/ns#" term="scanner"/><title type='text'>Programação - Java Básico 06 - Capturando entradas do usuário!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS43vhDKCaMKYpvwyK-99brxzWreEHiAGi8cw43hCw1Hw2Puwva0CfEDYd_Wxl07jg-IkWz6rr-b2VrmsVRKBBNnOa0PRmNKa2xhsEZx9YiF0hC9YSMScaL7wb3tKsRB2uvOFZTdn2StLX/s1600/capturando.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;164&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS43vhDKCaMKYpvwyK-99brxzWreEHiAGi8cw43hCw1Hw2Puwva0CfEDYd_Wxl07jg-IkWz6rr-b2VrmsVRKBBNnOa0PRmNKa2xhsEZx9YiF0hC9YSMScaL7wb3tKsRB2uvOFZTdn2StLX/s320/capturando.png&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;A única real constante é a mudança, sendo que um dado ou ação diferente mudaria todo o contexto!&lt;/i&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
Dando sequência a nossos posts, hoje iremos ver como capturar entradas (valores) digitados pelo usuário no terminal, armazenando-os em variáveis e operando com eles.&lt;br /&gt;
&lt;br /&gt;
Vamos lá!&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;Scanner&lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;Sendo uma classe nativa do JAVA, o Scanner nos permite capturar valores do terminal.&lt;br /&gt;
&lt;br /&gt;
Sua sintaxe de criação e inicialização é:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
Scanner scanner = new Scanner(System.in);
&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
Para capturarmos valores String, int e double, utilizamos os métodos nextLine(), nextInt(), nextDouble(), respectivamente:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
String nome = scanner.nextLine();&lt;br /&gt;
int idade = scanner.nextInt();&lt;br /&gt;
double altura = scanner.nextDouble();&lt;/div&gt;
&lt;br /&gt;
Então, se quisermos capturar o nome, idade e altura de uma pessoa informada pelo usuário, podemos seguir o seguinte código:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;import java.util.Scanner;&lt;/b&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
public class Entradas {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; public static void main(String[] args){&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Scanner scanner = new Scanner(System.in);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; System.out.println(&quot;Digite o nome da pessoa:&quot;);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; String nome = scanner.nextLine();&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; System.out.println(&quot;Digite a idade da pessoa:&quot;);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; int idade = scanner.nextInt();&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; System.out.println(&quot;Digite a altura da pessoa:&quot;);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; double altura = scanner.nextDouble();&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; System.out.println(nome+&quot; tem &quot;+idade+&quot; anos e &quot;+altura+&quot; m de altura!&quot;); &lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; scanner.close();&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
Se eu colocasse como entradas nome=&#39;José&#39;, idade=23 e altura=1,75, a minha saída seria: &lt;span style=&quot;color: red;&quot;&gt;José tem 23 anos e 1.75 m de altura!&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
Percebam, no código, a primeira linha em vermelho: &quot;import java.util.Scanner;&quot;.&lt;br /&gt;
&lt;br /&gt;
As linguagens de programação são apoiadas em bibliotecas, que são pacotes contendo classes ou scripts pré escritos para realizar determinada tarefa. Isso quer dizer que a classe &lt;b&gt;Scanner&lt;/b&gt; está no pacote &lt;b&gt;java.util.*&lt;/b&gt;, e se não escrevermos esta linha (&lt;b&gt;import java.util.Scanner;&lt;/b&gt;) acima da declaração da classe, a IDE irá acusar erro.&lt;br /&gt;
&lt;br /&gt;
Na próxima veremos como trabalhar com mensagens de entrada e saída, desta vez com &lt;b&gt;interface gráfica&lt;/b&gt;.&lt;br /&gt;
&lt;br /&gt;
Até a próxima!</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/8381517846771630259/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-06-capturando.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/8381517846771630259'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/8381517846771630259'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-06-capturando.html' title='Programação - Java Básico 06 - Capturando entradas do usuário!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS43vhDKCaMKYpvwyK-99brxzWreEHiAGi8cw43hCw1Hw2Puwva0CfEDYd_Wxl07jg-IkWz6rr-b2VrmsVRKBBNnOa0PRmNKa2xhsEZx9YiF0hC9YSMScaL7wb3tKsRB2uvOFZTdn2StLX/s72-c/capturando.png" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-8244990072074160399</id><published>2013-07-12T03:50:00.000-07:00</published><updated>2013-07-12T03:50:34.818-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="america"/><category scheme="http://www.blogger.com/atom/ns#" term="apple"/><category scheme="http://www.blogger.com/atom/ns#" term="espionagem"/><category scheme="http://www.blogger.com/atom/ns#" term="estados"/><category scheme="http://www.blogger.com/atom/ns#" term="eua"/><category scheme="http://www.blogger.com/atom/ns#" term="globo"/><category scheme="http://www.blogger.com/atom/ns#" term="microsoft"/><category scheme="http://www.blogger.com/atom/ns#" term="noticias"/><category scheme="http://www.blogger.com/atom/ns#" term="obama"/><category scheme="http://www.blogger.com/atom/ns#" term="outlook"/><category scheme="http://www.blogger.com/atom/ns#" term="skydrive"/><category scheme="http://www.blogger.com/atom/ns#" term="skype"/><category scheme="http://www.blogger.com/atom/ns#" term="unidos"/><category scheme="http://www.blogger.com/atom/ns#" term="usa"/><title type='text'>Notícia - Microsoft facilitou espionagem dos EUA!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4t1_F_cOcdq2Fj8yEfBMSZQv_eMrtoJky8KCAWtdhV0vVHKYlqrOJI1yS2bgiiWOG6qye_PQNWSVJojjT3kHZ0Vr1v3RGc70fIZhtjlKurBdpi7LA3I0_sXiSIfuYoXEx1WyuttYlgSLV/s1600/2013-628342599-20130711110702962rts.jpg_20130711.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;240&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4t1_F_cOcdq2Fj8yEfBMSZQv_eMrtoJky8KCAWtdhV0vVHKYlqrOJI1yS2bgiiWOG6qye_PQNWSVJojjT3kHZ0Vr1v3RGc70fIZhtjlKurBdpi7LA3I0_sXiSIfuYoXEx1WyuttYlgSLV/s320/2013-628342599-20130711110702962rts.jpg_20130711.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Não se sabe o que o outro pensa, pois se for de confiar confie, mas verifique!&lt;/i&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Depois do estouro da notícia de que os Estados Unidos da América estão nos espionando pela Internet, dados recentes acusam a Microsoft de ter auxiliado o governo neste quesito.&lt;/div&gt;
&lt;br /&gt;
A notícia foi tirada de &lt;a href=&quot;http://g1.globo.com/tecnologia/noticia/2013/07/microsoft-facilitou-espionagem-do-governo-dos-eua-diz-jornal.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Globo.com&lt;/a&gt;:&lt;br /&gt;
&lt;br /&gt;
&lt;i&gt;&quot;&lt;/i&gt;&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;A &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/microsoft/&quot;&gt;Microsoft&lt;/a&gt;
 ajudou o governo dos Estados Unidos a interceptar os dados de usuários 
de seus serviços na internet, segundo informou reportagem publicada 
nesta quinta-feira (11) pelo jornal britânico “The Guardian”.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 O esforço da companhia compreendeu, inclusive, um auxílio para quebrar a
 criptografia (embaralhamento de código) de seus serviços na internet, 
de acordo com documentos vazados pelo ex-agente da CIA, &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/edward-snowden.html&quot;&gt;Edward Snowden&lt;/a&gt;, que trabalha para a Agência de Segurança Naciona (NSA, na sigla em inglês), responsável por programas de espionagem.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Em junho, o &quot;Guardian&quot; e o &quot;The Washington Post&quot; revelaram que a NSA 
mantém um programa de espionagem on-line chamado Prism, que monitora a 
troca de dados feitas pelos serviços na web de Apple , AOL, Facebook, 
Google, Microsoft, Yahoo!, Skype, YouTube e Paltalk.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 A ajuda da Microsoft ocorreu porque a Agencia de Segurança Nacional não
 havia conseguido interceptar os chats na web no novo portal 
Outlook.com, que substituiu o site Hotmail.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Os e-mails trocados pelos usuários não eram problema, porque a NSA 
tinha acesso a uma versão deles antes de serem criptografados. As 
preocupações da agência em conseguir acessar os dados no novo portal 
começaram ainda quando a Microsoft testava o novo portal, em julho de 
2012. O novo portal foi lançado em fevereiro de 2013.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Por conta da dificuldade, a companhia passou a trabalhar com a polícia federal dos EUA (&lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/fbi/&quot;&gt;FBI&lt;/a&gt;) para quebrar a criptografia dos chats.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 A Microsoft afirmou, por meio de comunicado, que “quando atualiza ou 
melhora seus produtos não se isenta de precisar cumprir com existentes 
ou futuras demandas legais”.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 A companhia alegou que cedeu dados de consumidores “apenas em resposta 
às demandas governamentais e sempre os cumpriu apenas com ordens ou 
pedidos sobre contas e identidades específicas”.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 A colaboração não se limitou ao Outlook. A Microsoft trabalhou com o 
FBI também para permitir à NSA acesso facilitado ao seu serviço de 
armazenamento SkyDrive, que possui 250 milhões de usuários.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Decisões secretas permitiram à NSA coletar dados de internautas sem 
mandados judiciais individuais, desde que seus alvos não fossem cidadãos
 norte-americanos e não estivessem dentro do território dos EUA.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 No entanto, os documentos revelados pelo &quot;Guardian&quot;, mostram que 
informações captadas pelo Prism eram compartilhados com o FBI e a CIA, 
serviço secreto dos EUA.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 As empresas de tecnologia pressionam o governo dos EUA para que revelem
 em que nível ocorreram suas colaborações a programas de espionagem. O 
objetivo é mostrar aos usuários de seus serviços que houve preocupação 
em cumprir as políticas de privacidade. A Microsoft e outras empresas 
envolvidas negaram dar acesso aos seus servidores.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Veja a nota da Microsoft na íntegra:&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;“Nós temos claros princípios que guiam a resposta de toda a 
companhia em relação às demandas governamentais por informação de 
consumidores tanto via pedidos judiciais quanto por motivos de segurança
 nacional.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&lt;i&gt;&lt;i&gt;Primeiro, nós levamos&amp;nbsp; &lt;/i&gt;muito a sério &lt;/i&gt;nossos 
compromissos com nossos clientes e a aderência com a aplicação de leis, 
por isso cedemos dados de consumidores apenas em resposta a processos 
legais. Segundo, nosso time examina todas as demandas de perto, e nós as
 rejeitamos se acreditamos que não sejam válidas. Terceiro, apenas 
atendemos pedidos sobre contas e identidades específicas, e não 
responderíamos ao tipo de requisição discutida na imprensa ao longo das 
últimas semanas. Para ser bem claro, a Microsoft não cede a nenhum 
governo cobertura ou acesso direto ao SkyDrive, Outlook.com, Skype ou 
qualquer de nossos produtos.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;Finalmente, quando atualizamos ou melhoramos produtos, obrigações 
legais, em certas circunstancias, requerem que nós mantenhamos a 
possibilidade de prover informação em resposta a pedidos legais ou 
mediante requisição em nome da segurança nacional. Existem aspectos 
nesse debate que gostaríamos de discutir mais abertamente. É por isso 
que solicitamos transparência adicional que pudesse ajudar todos a 
entender e debater esse importante assunto.&quot;&lt;/i&gt;&lt;/div&gt;
&lt;i&gt;&quot;&lt;/i&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;Fonte: &lt;a href=&quot;http://g1.globo.com/tecnologia/noticia/2013/07/microsoft-facilitou-espionagem-do-governo-dos-eua-diz-jornal.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Globo.com&lt;/a&gt;&lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/8244990072074160399/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/noticia-microsoft-facilitou-espionagem.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/8244990072074160399'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/8244990072074160399'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/noticia-microsoft-facilitou-espionagem.html' title='Notícia - Microsoft facilitou espionagem dos EUA!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4t1_F_cOcdq2Fj8yEfBMSZQv_eMrtoJky8KCAWtdhV0vVHKYlqrOJI1yS2bgiiWOG6qye_PQNWSVJojjT3kHZ0Vr1v3RGc70fIZhtjlKurBdpi7LA3I0_sXiSIfuYoXEx1WyuttYlgSLV/s72-c/2013-628342599-20130711110702962rts.jpg_20130711.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-2707024121165465865</id><published>2013-07-11T04:15:00.000-07:00</published><updated>2013-07-11T04:18:31.973-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="operacoes"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><category scheme="http://www.blogger.com/atom/ns#" term="variavel"/><title type='text'>Programação - Java Básico 05 - Manipulando dados - Parte 2!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhete12o6JQblwC1YG8HThUGLG-flOFfBY0dB4w1TEaRcHeguweXpa3Qktd43V4yRBSiY0xtgectLsv-I7VDLL9rUflQT04P0_O7ZnlnJvRhjGyh2YurZToQ4-EeHoCx1gNfFWrRkKGeYY1/s1600/sistema-bin%25C3%25A1rio.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;205&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhete12o6JQblwC1YG8HThUGLG-flOFfBY0dB4w1TEaRcHeguweXpa3Qktd43V4yRBSiY0xtgectLsv-I7VDLL9rUflQT04P0_O7ZnlnJvRhjGyh2YurZToQ4-EeHoCx1gNfFWrRkKGeYY1/s320/sistema-bin%25C3%25A1rio.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Nunca constrói-se algo grande sozinho, pois você precisa pelo menos de um aliado para segurar a escada.&lt;/i&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
No último post da série(&lt;a href=&quot;http://diariodainformatica.blogspot.com.br/2013/07/programacao-java-basico-04-manipulando.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;aqui&lt;/a&gt;) vimos o que são tipos de dados, como declaramos e iniciamos variáveis, e exibimos o seu conteúdo.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Hoje iremos ver como utilizar estes elementos a nosso favor, realizando operações matemáticas e armazenando os resultados em novas variáveis.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Bem, chega de papo!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Criem um novo projeto no &lt;b&gt;Eclipse&lt;/b&gt; e criem a classe &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;ManipulandoVariaveis&lt;/b&gt;&lt;/span&gt;:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public&lt;/b&gt; &lt;b&gt;class&lt;/b&gt; ManipulandoVariaveis {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args) {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Dentro desta classe, crie 6 variáveis do tipo &lt;b&gt;double&lt;/b&gt; (num1, num2, resultadoSoma, resultadoSubtracao, resultadoMultiplicacao, resultadoDivisao) e uma do tipo &lt;b&gt;String&lt;/b&gt; (mensagem):&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public&lt;/b&gt; &lt;b&gt;class&lt;/b&gt; ManipulandoVariaveis {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args) {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;double&lt;/b&gt; num1;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; num2;&lt;/span&gt;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: blue;&quot;&gt;&lt;b&gt;double&lt;/b&gt; resultadoSoma, resultadoSubtracao, resultadoMultiplicacao, resultadoDivisao;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;String mensagem;&lt;/span&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Perceba o destaque da linha em azul.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Colocamos todas as variáveis &quot;resultado&quot; em uma linha de código só &lt;b&gt;(uma linha de código só acaba quando há um &quot;&lt;span style=&quot;color: red;&quot;&gt;;&lt;/span&gt;&quot;)&lt;/b&gt;. É permitido declarar variáveis do mesmo tipo desta forma, com tanto que sejam separadas por vírgula umas das outras.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Agora vamos iniciar as variáveis num1 e num2 com os números 10 e 2, respectivamente:&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public&lt;/b&gt; &lt;b&gt;class&lt;/b&gt; ManipulandoVariaveis {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args) {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &lt;b&gt;double&lt;/b&gt; num1;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; num2;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; resultadoSoma, resultadoSubtracao, resultadoMultiplicacao, resultadoDivisao;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; String mensagem;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;num1 = 10;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; num2 = 2;&lt;/span&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Nesta sequência, vamos agora realizar as quatro operações matemáticas (soma, subtração, multiplicação e divisão) e armazenar em nossas variáveis &quot;resultado&quot;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;OBS.: Os símbolos de operação na programação são: Soma -&amp;gt; +; Subtração -&amp;gt; -; Multiplicação -&amp;gt; *; Divisão -&amp;gt; /;&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public&lt;/b&gt; &lt;b&gt;class&lt;/b&gt; ManipulandoVariaveis {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args) {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &lt;b&gt;double&lt;/b&gt; num1;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; num2;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; resultadoSoma, resultadoSubtracao, resultadoMultiplicacao, resultadoDivisao;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; String mensagem;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; num1 = 10;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; num2 = 2;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;resultadoSoma = num1&amp;nbsp;+ num2;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; resultadoSubtracao = num1 - num2;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; resultadoMultiplicacao = num1 * num2;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; resultadoDivisao = num1 / num2;&lt;/span&gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Agora que já temos os valores, precisamos exibi-los e, para isso, iremos concatenar (juntar) os resultados em uma variável texto (a mensagem) e exibir este texto.&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public&lt;/b&gt; &lt;b&gt;class&lt;/b&gt; ManipulandoVariaveis {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args) {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;nbsp;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &lt;b&gt;double&lt;/b&gt; num1;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; num2;&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;b&gt;double&lt;/b&gt; resultadoSoma, resultadoSubtracao, resultadoMultiplicacao, resultadoDivisao;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; String mensagem;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; num1 = 10;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; num2 = 2;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;resultadoSoma = num1&amp;nbsp;+ num2;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; resultadoSubtracao = num1 - num2;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; resultadoMultiplicacao = num1 * num2;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; resultadoDivisao = num1 / num2;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; mensagem = &quot;Soma: &quot;+resultadoSoma+&quot; - Subtração: &quot;&lt;/span&gt;&lt;span style=&quot;color: red;&quot;&gt; +resultadoSubtracao+&quot; - Multiplicação: &quot;&lt;/span&gt;&lt;span style=&quot;color: red;&quot;&gt;+resultadoMultiplicacao+&lt;/span&gt;&lt;span style=&quot;color: red;&quot;&gt;&quot; - Divisão: &quot;+resultadoDivisao;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;br /&gt;&lt;/span&gt;
&lt;span style=&quot;color: red;&quot;&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; System.out.println(mensagem);&lt;/span&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Seguindo o código, o texto impresso no console foi:&amp;nbsp; &lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Soma: 12.0 - Subtração: 8.0 - Multiplicação: 20.0 - Divisão: 5.0&lt;/b&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Em nossa próxima postagem veremos como capturar um valor digitado pelo usuário e armazená-lo em uma variável.&lt;/div&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/2707024121165465865/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-04-manipulando_11.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/2707024121165465865'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/2707024121165465865'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-04-manipulando_11.html' title='Programação - Java Básico 05 - Manipulando dados - Parte 2!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhete12o6JQblwC1YG8HThUGLG-flOFfBY0dB4w1TEaRcHeguweXpa3Qktd43V4yRBSiY0xtgectLsv-I7VDLL9rUflQT04P0_O7ZnlnJvRhjGyh2YurZToQ4-EeHoCx1gNfFWrRkKGeYY1/s72-c/sistema-bin%25C3%25A1rio.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-3046794410093291574</id><published>2013-07-10T04:04:00.000-07:00</published><updated>2013-07-10T04:04:48.519-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="code"/><category scheme="http://www.blogger.com/atom/ns#" term="coke"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="eclipse"/><category scheme="http://www.blogger.com/atom/ns#" term="games"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="invaders"/><category scheme="http://www.blogger.com/atom/ns#" term="j2se"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="jogos"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><category scheme="http://www.blogger.com/atom/ns#" term="space"/><title type='text'>Programação - Jogos em JAVA J2SE!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqaDivSp1rww_MfjAkUenmnA2xM2D4eC7GL_IqfNzbrPKkwFXFtzhAg6stJIRNNMG4arzvs3Tt6Mat8y2HDB16ob5XHlfguEPH22dhZoSfac1XZXtdWiitJM3_MaHtpzg8KT4oQ64f7Bh-/s1600/java_controller-300x300.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqaDivSp1rww_MfjAkUenmnA2xM2D4eC7GL_IqfNzbrPKkwFXFtzhAg6stJIRNNMG4arzvs3Tt6Mat8y2HDB16ob5XHlfguEPH22dhZoSfac1XZXtdWiitJM3_MaHtpzg8KT4oQ64f7Bh-/s1600/java_controller-300x300.png&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Um bom jogo é resultado de um bom trabalho e um excelente controle, mas nunca deixe-o tomar controle de sua vida.&lt;/i&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Hoje lembrei de um ótimo site para quem quer aprender a desenvolver jogos em JAVA para Desktop (J2SE): o &lt;a href=&quot;http://www.cokeandcode.com/&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Coke and Code&lt;/a&gt;!&lt;br /&gt;
&lt;br /&gt;
Abaixo segue o link para uma gama de tutoriais, ensinando a desenvolver um jogo chamado Space Invaders.&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;OBS.: Está em inglês, porém quando poder, irei traduzir ou fazer um tutorial aqui no blog.&lt;/i&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
Tutorial Desenvolvendo Space Invaders:&lt;br /&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://www.cokeandcode.com/index.html?page=tutorials/spaceinvaders101&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;1.01&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://www.cokeandcode.com/index.html?page=tutorials/spaceinvaders102&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;1.02&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://www.cokeandcode.com/index.html?page=tutorials/spaceinvaders103&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;1.03&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://www.cokeandcode.com/index.html?page=tutorials/spaceinvaders104&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;1.04&lt;/a&gt;&lt;/div&gt;
</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/3046794410093291574/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-jogos-em-java-j2se.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/3046794410093291574'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/3046794410093291574'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-jogos-em-java-j2se.html' title='Programação - Jogos em JAVA J2SE!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqaDivSp1rww_MfjAkUenmnA2xM2D4eC7GL_IqfNzbrPKkwFXFtzhAg6stJIRNNMG4arzvs3Tt6Mat8y2HDB16ob5XHlfguEPH22dhZoSfac1XZXtdWiitJM3_MaHtpzg8KT4oQ64f7Bh-/s72-c/java_controller-300x300.png" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-4369371659741606730</id><published>2013-07-09T03:44:00.000-07:00</published><updated>2013-07-09T03:44:14.215-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="apple"/><category scheme="http://www.blogger.com/atom/ns#" term="ativistas"/><category scheme="http://www.blogger.com/atom/ns#" term="chat"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="eua"/><category scheme="http://www.blogger.com/atom/ns#" term="globo"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="lista"/><category scheme="http://www.blogger.com/atom/ns#" term="noticias"/><category scheme="http://www.blogger.com/atom/ns#" term="protesto"/><category scheme="http://www.blogger.com/atom/ns#" term="usa"/><title type='text'>Notícia - Ativista cria lista de serviços para fugir do monitoramento dos EUA</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhByJyND1TR4p2C2a42MurENqR4QBTG1NuHfYr3uF2vbGzOTzIt082HcOc_-7dfOTvd5SdVES76O6AjOux1tq4nqXcv_fVfwc_h6TnEv237RtYShyAbk11WW_oprFZnOSmu_yHWUwC0Ck2C/s1600/facebook-chat-icon.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhByJyND1TR4p2C2a42MurENqR4QBTG1NuHfYr3uF2vbGzOTzIt082HcOc_-7dfOTvd5SdVES76O6AjOux1tq4nqXcv_fVfwc_h6TnEv237RtYShyAbk11WW_oprFZnOSmu_yHWUwC0Ck2C/s1600/facebook-chat-icon.jpg&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;/div&gt;
Esta postagem foi originalmente postada no site Globo.com:&lt;br /&gt;
&lt;i&gt;&lt;br /&gt;&lt;/i&gt;
&lt;i&gt;&quot;&lt;/i&gt;&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;Um grupo de ativistas criou uma lista de ferramentas alternativas aos de
 empresas de internet como Facebook e Google, para fugir da espionagem 
on-line do governo dos Estados Unidos. Neste domingo, reportagem de “O 
Globo” mostrou que o Brasil está na lista de países monitorados pelos 
programas da Agência Nacional de Segurança (NSA, na sigla em inglês) (&lt;a href=&quot;https://prism-break.org/#pt&quot; target=&quot;_blank&quot;&gt;Veja site aqui&lt;/a&gt;).&lt;/i&gt;&lt;/div&gt;
&lt;i&gt;&lt;br /&gt;&lt;/i&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 &quot;Eu realmente acredito que o mundo está passando por uma fase de 
monitoramento. É apenas natural para aqueles que detêm o poder querem 
tanto informação quanto possível sobre as pessoas que governam. E o 
atual estado da internet faz com que seja incrivelmente fácil que eles 
façam isso&quot;, disse o ativista Peng Zhong, criador da lista, ao &lt;b&gt;G1&lt;/b&gt;. Mas ele não fez tudo sozinho. &lt;b&gt;Veja ao lado algumas opções da lista&lt;/b&gt;.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 A listagem criada pelos ativistas pela privacidade na internet elencam 
alternativas aos serviços das companhias envolvidas com o Prism (&lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/apple/&quot;&gt;Apple&lt;/a&gt;, &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/facebook/&quot;&gt;Facebook&lt;/a&gt;, &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/google/&quot;&gt;Google&lt;/a&gt;, &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/microsoft/&quot;&gt;Microsoft&lt;/a&gt;, &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/youtube/&quot;&gt;YouTube&lt;/a&gt;, Skype, AOL, &lt;a class=&quot;premium-tip&quot; href=&quot;http://g1.globo.com/topico/yahoo.html&quot;&gt;Yahoo&lt;/a&gt;!
 e PalTalk), além de outros igualmente caracterizados por terem 
tecnologia proprietária, ou seja desenvolvida por uma companhia.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Entre as ferramentas estão bate-papos, navegadores, mapas na web, 
conferências por vídeo e voz, redes sociais e serviços de armazenamento 
de dados. “Privacidade pessoal é a liberdade conduzir a sua vida sem ser
 monitorado por uma autoridade central&quot;, diz Zhong.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Na lista, há ferramentas com tecnologia proprietária, como o DuckDuckGo
 ou o Startpage. No entanto, elas permitem navegação anônima.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Algumas dessas ferramentas são amplamente utilizadas não só por 
coletivos conhecidos como os Anonymous como também por &quot;hackitivistas&quot; 
(hackers ativistas) de todo o mundo. O navegador TOR, por exemplo, dá 
acesso à chamada Deep Web.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 O GitHub, aliás, plataforma escolhida para abrigar a lista é utilizada 
para o desenvolvimento de projetos de grupos que querem manter projetos 
na web a salvo de monitoramento.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 “Eu publiquei a versão inicial dessa lista em 10 de junho, com algumas 
opções aos softwares proprietários. Colaboradores me ajudaram a traduzir
 o site para várias línguas diferentes e a aumentar a seleção de 
programas”, explicou. Foi com essa contribuição de brasileiros que a 
versão em inglês foi vertida para o português.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 O criador da listagem adverte, no entanto, que esses programas não 
deixarão os dados na web totalmente a salvo. &quot;Usar esses programas 
livres não irá garantir 100% que você esteja completamente além do 
monitoramento da NSA, mas eles certamente fazem muito, muito mais do que
 se você não fizesse nada.&quot;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
 Conta para isso, informação contida na reportagem de &quot;O Globo&quot; sobre a 
existência de outros programas da NSA conseguem capturar dados 
trafegados fora do alcance dos serviços dessas empresas.&lt;/i&gt;&lt;/div&gt;
&lt;i&gt;
&lt;/i&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&quot;Para proteger sua informação do governo, você precisa criptografar 
suas comunicações e parar de usar e-mail e outros serviços na nuvem&quot;, 
sugere Zhong.&lt;/i&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;i&gt;&quot;&lt;/i&gt;&lt;br /&gt;
&lt;br /&gt;
Fonte: &lt;i&gt;&lt;a href=&quot;http://g1.globo.com/tecnologia/noticia/2013/07/ativista-da-web-cria-lista-de-servicos-para-fugir-do-monitoramento-dos-eua.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Globo.com&lt;/a&gt;&lt;/i&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/4369371659741606730/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/noticia-ativista-cria-lista-de-servicos.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4369371659741606730'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4369371659741606730'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/noticia-ativista-cria-lista-de-servicos.html' title='Notícia - Ativista cria lista de serviços para fugir do monitoramento dos EUA'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhByJyND1TR4p2C2a42MurENqR4QBTG1NuHfYr3uF2vbGzOTzIt082HcOc_-7dfOTvd5SdVES76O6AjOux1tq4nqXcv_fVfwc_h6TnEv237RtYShyAbk11WW_oprFZnOSmu_yHWUwC0Ck2C/s72-c/facebook-chat-icon.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-4781253438047088233</id><published>2013-07-08T04:18:00.003-07:00</published><updated>2013-07-08T09:49:11.704-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="dados"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="eclipse"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="manipulando"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><title type='text'>Programação - Java Básico 04 - Manipulando dados - Parte 1!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrKaR5_nVuP_wK1wHWT-R3TMdghVLILlEoERbb_U4UeOfrsgfr_3a_iLKFtdbs12u9shGAOvL6LS_6JU56pCmRYOki9dN5w55wmDuphC9pNbfKC9TykwN3UmcE2MM3oEcyKSx5bCEtWKaS/s1600/sistema-bin%C3%A1rio.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;205&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrKaR5_nVuP_wK1wHWT-R3TMdghVLILlEoERbb_U4UeOfrsgfr_3a_iLKFtdbs12u9shGAOvL6LS_6JU56pCmRYOki9dN5w55wmDuphC9pNbfKC9TykwN3UmcE2MM3oEcyKSx5bCEtWKaS/s320/sistema-bin%C3%A1rio.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Não é preciso somente aceitar o que cada elemento é, mas também se aproveitar ao máximo de suas qualidades!&lt;/i&gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
No último post, nós vimos como iniciar um novo projeto, fazendo uma mini aplicação que imprimia na tela &quot;Olá Mundo!&quot; (&lt;a href=&quot;http://diariodainformatica.blogspot.com.br/2013/07/programacao-java-basico-03-ola-mundo-o.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;veja aqui&lt;/a&gt;).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Hoje veremos um pouco sobre tipos de dados e como manipulá-los, sendo quem estes elementos são muito importantes para a programação, já que sem eles, não seria possível armazenar e fazer operações com valores.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Tipo de dados&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Também chamado de tipo de variável, define o grupo ou conjunto de valores que um elemento pode representar.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Como exemplo, podemos pegar a &quot;&lt;b&gt;idade&lt;/b&gt;&quot; do &quot;&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Senhor Carlos&lt;/b&gt;&lt;/span&gt;&quot; (finjamos nós). Carlos tem &lt;b&gt;42&lt;/b&gt; anos de &lt;b&gt;idade&lt;/b&gt;, logo nós percebemos que o &lt;b&gt;tipo de dados&lt;/b&gt; do elemento &lt;b&gt;idade&lt;/b&gt; é &lt;b&gt;número inteiro&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Primitivo e Composto&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Um tipo de dados primitivo é um tipo básico, independente de criações externas (sim, você pode criar um novo tipo de dados), e como grandes exemplos deste grupo, temos: &lt;b&gt;caracteres, números inteiros, números reais (com casas decimais) e booleano (pode assumir somente 2 valores, que são: verdadeiro ou falso);&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O tipo composto, em JAVA, normalmente é uma classe criada com valores e métodos agregados. Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;b&gt;&lt;/b&gt;&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public class&lt;/b&gt; Homem {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;private&lt;/b&gt; String nome;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;private int&lt;/b&gt; idade;&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;Variáveis&lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
São os elementos que recebem a identificação do tipo de dados e armazenam valores para as operações.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Alguns dos tipos de variáveis em JAVA mais comuns são:&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;b&gt;String&lt;/b&gt; - Texto&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;b&gt;int&lt;/b&gt; - Número inteiro&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;b&gt;double&lt;/b&gt; - Número decimal&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Existem outros porém, vamos caminhar com calma.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Declarando e Iniciando Variáveis&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Declarar uma variável é muito simples, basta escrever o tipo dela e depois o nome, encerrando com ponto e vírgula (&lt;span style=&quot;color: red;&quot;&gt;;&lt;/span&gt;) (todas as linhas em JAVA são encerradas com este símbolo).&lt;/div&gt;
&lt;br /&gt;
Exemplo:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;String&lt;/b&gt; nome;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Para iniciar esta variável, precisamos inserir um valor nela, e para isso, seguimos o seguinte modelo:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div class=&quot;codigoProg&quot; style=&quot;text-align: justify;&quot;&gt;
nome = &quot;David&quot;;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Novamente, quando terminamos uma linha de programação em JAVA, colocamos o &quot;&lt;span style=&quot;color: red;&quot;&gt;;&lt;/span&gt;&quot;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Vamos criar um pequeno programa, declarando e iniciando algumas variáveis, então abra o &lt;b&gt;Eclipse&lt;/b&gt; e crie um novo projeto.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Escreva a classe abaixo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public class&lt;/b&gt; Variaveis {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args){&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; String nome;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; nome = &quot;Carlos&quot;;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; double altura;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; altura=1.75;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; int idade=42;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;System.out.println(&quot;O Senhor &quot;+nome+&quot; tem &quot;+altura+&quot; de altura e &quot;+idade+&quot; anos!&quot;);&lt;/b&gt;&lt;/span&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Neste código temos 3 variáveis: nome, do tipo String; altura, do tipo double; idade, do tipo int.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Perceba que tanto é possível &lt;b&gt;declarar&lt;/b&gt; e depois &lt;b&gt;iniciar&lt;/b&gt; (como feito na variável &lt;b&gt;nome&lt;/b&gt; e &lt;b&gt;altura&lt;/b&gt;), quanto &lt;b&gt;declarar e iniciar ao mesmo tempo&lt;/b&gt; (como na variável &lt;b&gt;idade&lt;/b&gt;).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Na linha em vermelho, o conteúdo a ser impresso é: &lt;span style=&quot;color: red;&quot;&gt;O Senhor Carlos tem 1.75 de altura e 42 anos!&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Isso porque, através do operador &quot;+&quot;, nós estamos concatenando (juntando) os valores das variáveis para serem impressos.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Na próxima postagem veremos como fazer operações matemáticas e exibir os seus resultados na tela.&lt;/div&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/4781253438047088233/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-04-manipulando.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4781253438047088233'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4781253438047088233'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-04-manipulando.html' title='Programação - Java Básico 04 - Manipulando dados - Parte 1!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrKaR5_nVuP_wK1wHWT-R3TMdghVLILlEoERbb_U4UeOfrsgfr_3a_iLKFtdbs12u9shGAOvL6LS_6JU56pCmRYOki9dN5w55wmDuphC9pNbfKC9TykwN3UmcE2MM3oEcyKSx5bCEtWKaS/s72-c/sistema-bin%C3%A1rio.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-2897667095872700330</id><published>2013-07-05T10:02:00.004-07:00</published><updated>2013-07-05T10:06:11.756-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="banco"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="dados"/><category scheme="http://www.blogger.com/atom/ns#" term="ddl"/><category scheme="http://www.blogger.com/atom/ns#" term="de"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="dml"/><category scheme="http://www.blogger.com/atom/ns#" term="dql"/><category scheme="http://www.blogger.com/atom/ns#" term="engenharia"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="software"/><category scheme="http://www.blogger.com/atom/ns#" term="sql"/><title type='text'>Artigo - A Linguagem SQL</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCp2G4mhC2XUfW43JRP3hL2_u-NeTMSsuH8ruxOEe2GMxy6NyUuSOgKKfXobg5f9HIf3fOzXB1ZOi0tkwmhzlK5Lmv_neKZvgMu1-V2fft0q4pwD-i0qTYQaaS4_Z7wcH4T_tLe3XhTLTv/s1600/sql1.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCp2G4mhC2XUfW43JRP3hL2_u-NeTMSsuH8ruxOEe2GMxy6NyUuSOgKKfXobg5f9HIf3fOzXB1ZOi0tkwmhzlK5Lmv_neKZvgMu1-V2fft0q4pwD-i0qTYQaaS4_Z7wcH4T_tLe3XhTLTv/s200/sql1.jpg&quot; width=&quot;200&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;O pior erro, se falando em ignorância, é pregar ou acreditar em um determinado assunto sem verificar a sua origem e veracidade.&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Quem está inserido no meio da informática com certeza já ouviu falar em SQL (Structured Query Language), tendo pelo menos a ideia de que o termo está relacionado a bancos de dados.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O termo é muito conhecido como uma linguagem de comunicação entre SGDB (Sistema Gerenciador de Banco de Dados) e softwares de apoio, porém nem todos os profissionais atuantes da área sabem que a linguagem é dividida em alguns grupos, sendo eles:&lt;/div&gt;
&lt;ul style=&quot;text-align: justify;&quot;&gt;
&lt;li&gt;&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;DML&lt;/b&gt;&lt;/span&gt; - Linguagem de Manipulação de Dados;&lt;/li&gt;
&lt;li&gt;&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;DDL&lt;/b&gt;&lt;/span&gt; - Linguagem&amp;nbsp; de Definição de Dados;&lt;/li&gt;
&lt;li&gt;&lt;b&gt;DCL&lt;/b&gt; - Linguagem de Controle de Dados;&lt;/li&gt;
&lt;li&gt;&lt;b&gt;DTL&lt;/b&gt; - Linguagem de Transação de Dados;&lt;/li&gt;
&lt;li&gt;&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;DQL&lt;/b&gt;&lt;/span&gt; - Linguagem de Consulta de Dados;&lt;/li&gt;
&lt;/ul&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&amp;nbsp;Nesta postagem iremos abordar os grupos em vermelho: &lt;b&gt;DML, DDL e DQL&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;OBS.: Em outro momento, entraremos mais afundo na utilização da linguagem.&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;DDL - Linguagem de Definição de Dados&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Os comandos dispostos neste grupo são utilizados para criar o banco de dados e seus elementos &lt;span style=&quot;color: red;&quot;&gt;(tabelas, triggers, O banco de dados, views, etc...)&lt;/span&gt;, pois antes de operar algo, este algo necessita existir.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O comando mais comum utilizado aqui é o &lt;b&gt;CREATE&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;CREATE TABLE&lt;/b&gt; cliente (&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; codigo &lt;b&gt;integer&lt;/b&gt; &lt;b&gt;not null primary key&lt;/b&gt; auto_increment,&lt;br /&gt;
&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp;&amp;nbsp; nome &lt;b&gt;varchar&lt;/b&gt;(50) &lt;br /&gt;
);&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;DML - Linguagem de Manipulação de Dados&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Nesta sessão, classificam-se os comandos para a manipulação de dados dentro das tabelas já criadas (com a DDL), sendo aqui possível inserir, alterar e excluir dados dentro de uma tabela.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Os comandos mais comuns são: &lt;b&gt;INSERT, UPDATE E DELETE&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O &lt;b&gt;INSERT&lt;/b&gt; é utilizado para inserir dados em tabelas.&lt;/div&gt;
&lt;br /&gt;
Exemplo:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;INSERT INTO&lt;/b&gt; cliente (codigo, nome) &lt;b&gt;VALUES&lt;/b&gt; (&#39;1&#39;, &#39;David&#39;);&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O &lt;b&gt;UPDATE&lt;/b&gt; é usado para alterar determinado(s) registro(s) em uma tabela.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;UPDATE&lt;/b&gt; cliente &lt;b&gt;SET&lt;/b&gt; nome=&#39;Alfredo&#39; &lt;b&gt;WHERE&lt;/b&gt; codigo=&#39;1&#39;;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Já o comando DELETE, como ele sugere, é utilizado para excluir registros em uma tabela.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;DELETE FROM&lt;/b&gt; cliente &lt;b&gt;WHERE&lt;/b&gt; codigo=&#39;1&#39;;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;DQL - Linguagem de Consulta de Dados&lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Aqui utiliza-se comandos para a consulta/seleção de registros dentro de tabelas, não alterando o conteúdo das relações, servindo somente para a coleta de dados já inseridos.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt; &lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O comando mais comum é o &lt;b&gt;SELECT&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;SELECT&lt;/b&gt; nome &lt;b&gt;FROM&lt;/b&gt; cliente &lt;b&gt;WHERE&lt;/b&gt; codigo=&#39;1&#39;;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
É muito vasto o conjunto de possibilidades que existe no universo SQL, e eu espero ter clareado conceitos e dúvidas escrevendo este post.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Esta postagem foi destinada à definições, e não ao uso da linguagem em si, porém em um momento mais oportuno, este será nosso foco.&lt;/div&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/2897667095872700330/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/artigo-linguagem-sql.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/2897667095872700330'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/2897667095872700330'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/artigo-linguagem-sql.html' title='Artigo - A Linguagem SQL'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCp2G4mhC2XUfW43JRP3hL2_u-NeTMSsuH8ruxOEe2GMxy6NyUuSOgKKfXobg5f9HIf3fOzXB1ZOi0tkwmhzlK5Lmv_neKZvgMu1-V2fft0q4pwD-i0qTYQaaS4_Z7wcH4T_tLe3XhTLTv/s72-c/sql1.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-6394866156027595059</id><published>2013-07-05T04:06:00.000-07:00</published><updated>2013-07-05T04:06:48.740-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="banco"/><category scheme="http://www.blogger.com/atom/ns#" term="ciomputacao"/><category scheme="http://www.blogger.com/atom/ns#" term="cloud"/><category scheme="http://www.blogger.com/atom/ns#" term="computing"/><category scheme="http://www.blogger.com/atom/ns#" term="dados"/><category scheme="http://www.blogger.com/atom/ns#" term="de"/><category scheme="http://www.blogger.com/atom/ns#" term="noticias"/><category scheme="http://www.blogger.com/atom/ns#" term="nuvem"/><category scheme="http://www.blogger.com/atom/ns#" term="oracle"/><title type='text'>Notícia - Oracle anuncia primeiro banco de dados para a Nuvem!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbV2zkKSDZceXzXedJ7JC9LwBqeiwQ9r3JMDvkAcSzqTUsS3yh20HkSHE_M8ma_yLwauZSqsCN8kwk0yWmiMbJPAvwoc71HatEFGSj6hLxNR78ek7y7rFl9wve-ikR5uwLU0_3y0VB9V5U/s500/cloud-db1.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;313&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbV2zkKSDZceXzXedJ7JC9LwBqeiwQ9r3JMDvkAcSzqTUsS3yh20HkSHE_M8ma_yLwauZSqsCN8kwk0yWmiMbJPAvwoc71HatEFGSj6hLxNR78ek7y7rFl9wve-ikR5uwLU0_3y0VB9V5U/s320/cloud-db1.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Quando o trabalho é dividido entre vários, a conquista é alcançada de forma mais rápida e dispendiosa.&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&amp;nbsp;A Computação em Nuvem (Cloud Computing) se difundiu bastante (se formos olhar desde o final dos anos 90 até os dias atuais), trazendo diversos serviços e benefícios para empresas e indivíduos.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Muitas empresas criaram e amadureceram projetos baseados na Cloud Computing, que é uma tecnologia que funciona sobre a Internet (normalmente), buscando deixar o serviço acessível em qualquer lugar do mundo, com tanto que tenha uma conexão com a grande rede.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Muitos confundem bastante o conceito de Nuvem, mas para construirmos um raciocínio correto sobre o assunto, primeiro é preciso entender que esta tecnologia, além de disponibilizar o serviço em qualquer lugar que tenha Internet, independente da plataforma (Windows, Linux, Mobile, etc...), ainda tem-se a saber que ela trabalha de forma distribuída, quebrando o trabalho em partes e distribuindo para servidores específicos. Assim o carga é processada com menos perda e mais rapidez.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
A postagem abaixo foi tirada do site &lt;a href=&quot;http://www.tibahia.com/tecnologia_informacao/conteudo_unico.aspx?c=SERVICOS&amp;amp;fb=B_FULL&amp;amp;hb=B_CENTRA&amp;amp;bl=LAT1&amp;amp;r=SERVICOS&amp;amp;nid=23504&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;TiBahia&lt;/a&gt;:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&quot;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;Empresa anuncia que o primeiro banco de dados desenvolvido para a nuvem já está disponível para todo o mercado&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Salvador, 03 de julho de 2013&lt;/b&gt; -&amp;nbsp;Ao adotar a  nuvem, 
as empresas buscam tecnologias capazes de transformar os  negócios e 
melhorar a eficácia e a agilidade operacional. O &lt;a href=&quot;http://www.oracle.com/us/products/database/overview/index.html&quot; target=&quot;_blank&quot;&gt;Oracle  Database 12c&lt;/a&gt;
 é um banco de dados de última geração, desenvolvido  para atender a 
essas necessidades, fornecendo uma nova arquitetura  multitenant&amp;nbsp; em uma
 plataforma rápida, escalável, confiável e segura. Ao  ingressar na 
nuvem com o Oracle Database 12c, os clientes  conseguem melhorar a 
qualidade e o desempenho dos aplicativos, reduzir o  tempo com a gestão 
de armazenamento e obter máxima disponibilidade,  além de simplificar a 
consolidação de vários bancos de dados.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;A mais recente versão do banco de dados número um do mundo, o &lt;a href=&quot;http://www.oracle.com/database&quot; target=&quot;_blank&quot;&gt;Oracle Database 12c&lt;/a&gt;, está disponível para download no site da &lt;a href=&quot;http://www.oracle.com/goto/DatabaseDownload&quot; target=&quot;_blank&quot;&gt;Oracle Technology Network&lt;/a&gt; (OTN).&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O Oracle Database 12c  apresenta uma nova arquitetura multitenant, 
que simplifica o processo  de consolidação de bancos de dados na nuvem, 
permitindo que os clientes  gerenciem vários bancos de dados como um só,
 sem alterar seus  aplicativos.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;Por ser a base do Oracle Public Cloud Services, o Oracle Database 12c
 oferece  excelentes benefícios às empresas que estão implementando 
nuvens  privadas de bancos de dados e aos fornecedores de software como 
serviço  (SaaS, na sigla em inglês), que procuram o poder do Oracle 
Database em  modelo multitenant seguro.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O Oracle Database 12c,  otimizado no SPARC e nos processadores Intel®
 Xeon®, é uma versão  completa que traz 500 recursos inéditos e é o 
resultado de 2.500  pessoas-ano (ou seja, 5,2 milhões de horas) de 
desenvolvimento e 1,2  milhões de horas de testes, além de um extenso 
programa beta com  parceiros e clientes da Oracle.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;A nova versão do banco de dados número um para a nuvem, o Oracle 
Database 12c, foi também desenvolvido em conjunto com o servidor 
recordista mundial da Oracle: o SPARC T5.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O &lt;a href=&quot;http://event.on24.com/r.htm?e=617926&amp;amp;s=1&amp;amp;k=8D5918DABF87924314A8E84FA29A9178&amp;amp;partnerref=DB_db12claunch_PR_41013&quot; target=&quot;_blank&quot;&gt;webcast&lt;/a&gt;
 de lançamento do Oracle Database 12c  será apresentado por Andy 
Mendelsohn, vice-presidente sênior de  Tecnologia de Servidores de 
Bancos de Dados da Oracle, e Tom Kyte,  arquiteto da Oracle, e está 
programado para o dia 10 de julho de 2013,  às 13h (horário de 
Brasília).&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Nova arquitetura multitenant para consolidação de bancos de dados na nuvem&lt;/b&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O Oracle Database 12c  vence os principais desafios dos clientes que 
estão consolidando bancos  de dados em um modelo de nuvem privada, 
proporcionando eficiência  superior, custos de gestão expressivamente 
menores, ao mesmo tempo que  mantém a autonomia de cada banco de dados.&amp;nbsp;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O Oracle Multitenant é um novo recurso do Oracle Database 12c  e 
permite que cada banco de dados conectado dentro na nova arquitetura  
multitenant funcione como um Oracle Database padrão para os aplicativos 
 já instalados, que poderão rodar sem alterações.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;Comportando  a multitenant na camada de bancos de dados, ao invés de 
ser nos  aplicativos, o Oracle Multitenant faz com que todos os 
aplicativos de  ISV (provedores independentes de software, em português)
 executados no  Oracle Database fiquem prontos para SaaS.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O  Oracle Multitenant gerencia diversos bancos de dados como um só e 
 aumenta a utilização de recursos do servidor, assim como reduz o tempo e
  os esforços exigidos nas atualizações, backups e recuperação de bancos
  de dados, entre outras inúmeras facilidades.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;A  arquitetura multitenant oferece clonagem e provisionamento 
praticamente  instantâneos dos bancos de dados, sendo a plataforma ideal
 para  desenvolvimento e testes de bancos de dados nas nuvens.&amp;nbsp;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;O  Oracle Multitenant funciona com todos os recursos do Oracle 
Database,  como Real Application Clusters, Partitioning, Data Guard, 
Compression,  Automatic Storage Management, Real Application Testing, 
Transparent Data  Encryption, Database Vault, entre outros.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Otimização automática de dados&lt;/b&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Para  ajudar os clientes a gerenciar mais dados com maior 
eficiência, reduzir  os custos de armazenamento e melhorar o desempenho,
 o Oracle Database  12c traz novos recursos de otimização automática de 
dados.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Um  Heat Map monitora a atividade de leitura/gravação do 
banco de dados,  possibilitando que os administradores identifiquem 
facilmente os dados  hot (muito ativos), warm (somente leitura) e cold 
(raramente lidos)  armazenados nas tabelas e partições.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Por  meio de compactação inteligente e armazenamento em 
camadas, os  administradores de bancos de dados (DBAs) poderão definir 
facilmente as  políticas gerenciadas dos servidores para automatizar a 
compactação e a  colocação de dados de OLTP, Data Warehouse e 
arquivamento em camadas,  com base na atividade e no tempo de existência
 dos dados.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Segurança em camadas&lt;/b&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O Oracle Database 12c  inclui mais inovações de segurança 
que as versões anteriores, ajudando  os clientes a enfrentar as 
crescentes ameaças e cumprir as  regulamentações cada vez mais exigentes
 em termos de privacidade dos  dados.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Os  novos recursos de edição permitem que as empresas 
protejam dados  confidenciais, como números de cartões de crédito, sem 
ter de fazer  alterações nos aplicativos que os exibem, pois são 
editados de maneira  simultânea a execução, baseados em políticas 
pré-definidas e nas  informações da sessão da conta.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O Oracle Database 12c  também inclui o novo Run-Time 
Privilege Analysis, que permite  identificar as funções e os privilégios
 que realmente estão sendo  usados, ajudando a revogar privilégios 
desnecessários e aplicar o mínimo  deles com a segurança de que as 
operações da empresa não serão  prejudicadas.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Disponibilidade máxima para nuvens de bancos de dados &lt;/b&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O Oracle Database 12c  apresenta diversos recursos de alta 
disponibilidade, bem como  aprimoramentos às tecnologias existentes, que
 viabilizam o acesso  contínuo aos dados empresariais.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O  Global Data Services oferece balanceamento de carga e 
failover para  configurações de bancos de dados distribuídos em âmbito 
global.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O  Data Guard Far Sync estende a proteção de standby a 
qualquer distância  com zero perda de dados – sem limitações em 
decorrência de latência.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O  Application Continuity complementa o Oracle Real 
Application Clusters e  mascara as falhas dos aplicativos dos usuários 
finais, reproduzindo de  forma automática as transações que apresentaram
 falhas.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Eficiência na gestão de bancos de dados&lt;/b&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; A integração perfeita com o &lt;a href=&quot;http://www.oracle.com/technetwork/oem/db-mgmt/db-mgmt-093445.html&quot; target=&quot;_blank&quot;&gt;Oracle Enterprise Manager 12c Cloud Control&lt;/a&gt;
 auxilia os administradores a implementar e gerenciar, com total 
facilidade, a nova funcionalidade do Oracle Database 12c, que inclui 
novidades como a arquitetura multitenant e a edição de dados.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Os  abrangentes recursos de testes do Oracle Real 
Application Testing podem  ajudar os clientes a validar estratégias de 
atualização e consolidação  por meio de testes simultâneos e colocação 
do sistema em cargas de  produção reais.&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;&lt;b&gt;Simplificação das análises de Big Data&lt;/b&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; O Oracle Database 12c  aprimora os recursos MapReduce 
residentes no banco de dados para Big  Data por intermédio da 
correspondência de padrões de SQL, que viabiliza a  descoberta imediata e
 escalável de sequências de eventos empresariais,  como transações 
financeiras, logs de rede e de sequência de cliques  (clickstream).&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;
&lt;/i&gt;&lt;i&gt;·&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Os  analistas de dados podem analisar as informações 
empresariais e Big  Data com maior eficácia, devido aos novos algoritmos
 preditivos  residentes no banco de dados e à integração ainda maior da 
linguagem R  de código aberto com o Oracle Database 12c.&lt;/i&gt;&lt;/div&gt;
&lt;br /&gt;
&quot;&lt;br /&gt;
&lt;br /&gt;
Fonte: &lt;a href=&quot;http://www.tibahia.com/tecnologia_informacao/conteudo_unico.aspx?c=SERVICOS&amp;amp;fb=B_FULL&amp;amp;hb=B_CENTRA&amp;amp;bl=LAT1&amp;amp;r=SERVICOS&amp;amp;nid=23504&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;TiBahia&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/6394866156027595059/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/noticia-oracle-anuncia-primeiro-banco.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/6394866156027595059'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/6394866156027595059'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/noticia-oracle-anuncia-primeiro-banco.html' title='Notícia - Oracle anuncia primeiro banco de dados para a Nuvem!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbV2zkKSDZceXzXedJ7JC9LwBqeiwQ9r3JMDvkAcSzqTUsS3yh20HkSHE_M8ma_yLwauZSqsCN8kwk0yWmiMbJPAvwoc71HatEFGSj6hLxNR78ek7y7rFl9wve-ikR5uwLU0_3y0VB9V5U/s72-c/cloud-db1.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-1717347862858559065</id><published>2013-07-04T09:46:00.003-07:00</published><updated>2013-07-04T09:54:22.445-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="compilador"/><category scheme="http://www.blogger.com/atom/ns#" term="desenvolvimento"/><category scheme="http://www.blogger.com/atom/ns#" term="eclipse"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="mundo"/><category scheme="http://www.blogger.com/atom/ns#" term="ola"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><title type='text'>Programação - Java Básico 03 - Olá mundo! - O primeiro programa!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3QQM95fWV689cmdY69Yb1O_W-ElrlbjkWFy9xSRITB9j51dwQhe1ONeOvi-7hxOwBmjenYvhG3CZG1TdUBFrZkVd0JXCw6r_5JmAmRjPGSkv_5LjjLS6_rJhR7u3hJ8vuSZlHIj09FjQ/s512/512px-helloworld-svg.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;160&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3QQM95fWV689cmdY69Yb1O_W-ElrlbjkWFy9xSRITB9j51dwQhe1ONeOvi-7hxOwBmjenYvhG3CZG1TdUBFrZkVd0JXCw6r_5JmAmRjPGSkv_5LjjLS6_rJhR7u3hJ8vuSZlHIj09FjQ/s320/512px-helloworld-svg.png&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Para tudo há um começo, e por mais inútil que seja o início, nada existiria sem ele.&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Vimos no post passado como preparar o nosso ambiente de desenvolvimento JAVA (caso não tenha visto, &lt;a href=&quot;http://diariodainformatica.blogspot.com.br/2013/07/programacao-java-basico-02-instalando-o.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;clique aqui&lt;/a&gt;) e, graças a isso, é que agora conseguiremos começar a realmente escrever código. Vamos lá!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Neste primeiro contato com a linguagem, será explicada a estrutura básica de um programa em JAVA, não aprofundando muito (ainda) em determinados elementos.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Como foi falado em posts passados, a linguagem JAVA trabalha com classes, sendo que tudo é uma classe ou está dentro de uma.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Praticamente falando, uma classe é um arquivo.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Veja a imagem abaixo:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv4UyXhn-JVI03-jKeO0zpGnoWaRTffBrGwNyypoHA9pylKuoFCzZddaDO6HdDjhmQsf_pZ3YszVc7jGxfxCX9TRXwnUOchfrz8dbpE3V9os67nb8wtN0pJhqbKu6OK9r1Y6n6bqr3CypB/s493/class_in_explorer.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;196&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv4UyXhn-JVI03-jKeO0zpGnoWaRTffBrGwNyypoHA9pylKuoFCzZddaDO6HdDjhmQsf_pZ3YszVc7jGxfxCX9TRXwnUOchfrz8dbpE3V9os67nb8wtN0pJhqbKu6OK9r1Y6n6bqr3CypB/s320/class_in_explorer.png&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O arquivo &lt;b&gt;HelloWorld.java&lt;/b&gt; é o &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Código-Fonte&lt;/b&gt;&lt;/span&gt; escrito na linguam JAVA (o que nós iremos escrever logo logo), enquanto que o &lt;b&gt;HelloWorld.class&lt;/b&gt; é a nossa &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Classe JAVA&lt;/b&gt;&lt;/span&gt; gerada a partir da &lt;b&gt;compilação&lt;/b&gt; do arquivo &lt;b&gt;HelloWorld.java&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Um programa em JAVA somente pode ser iniciado através de uma classe que contenha o método &lt;b&gt;Main&lt;/b&gt;, que segue um padrão bem simples de escrita (&lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;veremos o que são métodos nas postagens seguintes&lt;/i&gt;&lt;/span&gt;).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Observe o código abaixo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public class&lt;/b&gt; NomeDaClasse {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main(String[] args){&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
}&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Este é o primeiro código que se escreve ao desenvolver um programa em JAVA, pois a partir dessas linhas é que cria-se a &lt;b&gt;Classe principal&lt;/b&gt; e o método &lt;b&gt;Main&lt;/b&gt;, aquele que faz com que o aplicativo seja inicializável.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O termo &quot;&lt;b&gt;public class NomeDaClasse&lt;/b&gt;&quot; é quem cria e define o nome da classe.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Perceba que códigos pertencentes a um mesmo bloco ficam dentro de &lt;b&gt;chaves&lt;/b&gt;(&lt;span style=&quot;color: red;&quot;&gt;{}&lt;/span&gt;), e a cada chave, parêntese ou cochete aberto, é necessário um outro para fechá-lo.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Bem, chega de papo e vamos escrever o nosso primeiro programa!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Olá Mundo!&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Primeiro de tudo, abra o &lt;b&gt;Eclipse&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Se é a primeira vez que você abre, ele pedirá para que informe a pasta onde será o espaço de trabalho (aonde os projetos e códigos-fonte ficarão).&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFtEg5Bt7YKcNc559ecNQH1rbu5O0WujweZhzTmTeHXhDnkel1MfVYdF7vpP4ZO3KS7P8an7AnvkMgbPjty55n-xHRLQxkp7HS7RbOBRA931gBMuR6yyLOuYQU_emQMJTrl-4e7o0K2fZ4/s606/workspace.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;178&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFtEg5Bt7YKcNc559ecNQH1rbu5O0WujweZhzTmTeHXhDnkel1MfVYdF7vpP4ZO3KS7P8an7AnvkMgbPjty55n-xHRLQxkp7HS7RbOBRA931gBMuR6yyLOuYQU_emQMJTrl-4e7o0K2fZ4/s400/workspace.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Se preferir, deixe como está.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Após o carregamento, feche a aba que aparece aberta e direcione-se até o menu &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;File &amp;gt; New &amp;gt; Java Project&lt;/b&gt;&lt;/span&gt;.&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0FCUso-4qz3bL1TtRm2lC_u7aCFZBzq10ejbV7Iug9FOS2ox7STQF4dx2oTuNJbmSqXGwEAPI82nBvHCe1lbEOZucvxj-U-5J6nwsMwQkVBM02YFNDySn1In6GDm1S57eR1RvHrSB7beA/s435/06.MakeNewJavaProject.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;187&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0FCUso-4qz3bL1TtRm2lC_u7aCFZBzq10ejbV7Iug9FOS2ox7STQF4dx2oTuNJbmSqXGwEAPI82nBvHCe1lbEOZucvxj-U-5J6nwsMwQkVBM02YFNDySn1In6GDm1S57eR1RvHrSB7beA/s320/06.MakeNewJavaProject.png&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Na janela que se mostra agora, digite &lt;b&gt;OlaMundo&lt;/b&gt; no campo Project name.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;&lt;b&gt;OBS.: Digite exatamente do jeito que está, sem acentos ou separações.&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhScZjemvNEs0u0EFydYRGaYBLpG0uspuj4eQ-UgTFB5Y9GkZx97m4ERKTh5sO-vrQbA90HQIjVd864vUokUaxuz4uUsQhbdsUm2vOdEWQdMiGU3AQOooWyVrOUktwszVElt6wMa-i-S28W/s742/projectname.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;640&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhScZjemvNEs0u0EFydYRGaYBLpG0uspuj4eQ-UgTFB5Y9GkZx97m4ERKTh5sO-vrQbA90HQIjVd864vUokUaxuz4uUsQhbdsUm2vOdEWQdMiGU3AQOooWyVrOUktwszVElt6wMa-i-S28W/s640/projectname.png&quot; width=&quot;497&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Pressione o botão &lt;b&gt;Finish&lt;/b&gt;, e então o nosso projeto está criado, porém sem classes nem finalidade, logo, não pode ser compilado (&lt;b&gt;transformado em programa&lt;/b&gt;).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Precisamos criar a nossa classe principal (aquela que contém o método &lt;b&gt;Main&lt;/b&gt;), para isso, na barra lateral esquerda (&lt;b&gt;Package Explorer&lt;/b&gt;), clique do lado do projeto OlaMundo para expandir as pastas, e em seguida, &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;clique com o botão direito do mouse&lt;/b&gt;&lt;/span&gt; na pasta &lt;b&gt;src&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
No menu que abriu, vá até &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;New &amp;gt; Class&lt;/b&gt;&lt;/span&gt;.&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr5xfCMEbY7Ef0IEZIzYQsaeGeoTw2eDCAU8uXfH7PaQsuoP1N66Nr5KrxoorW1oQV2HjRA4thInP8xHGPW4JMvihVPFzZtWXAppzSa8e58lLYWw5kxi5b3Kg8AnIi5GSvUX2sfe1RwoWe/s677/newclass.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr5xfCMEbY7Ef0IEZIzYQsaeGeoTw2eDCAU8uXfH7PaQsuoP1N66Nr5KrxoorW1oQV2HjRA4thInP8xHGPW4JMvihVPFzZtWXAppzSa8e58lLYWw5kxi5b3Kg8AnIi5GSvUX2sfe1RwoWe/s400/newclass.png&quot; width=&quot;371&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Digite &lt;b&gt;OlaMundo&lt;/b&gt; no campo &lt;b&gt;Name&lt;/b&gt; e clique em &lt;b&gt;Finish&lt;/b&gt;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Logo, percebemos que a Classe foi criada já com código escrito, pois é isso que as ferramentas de desenvolvimento buscam, agilizar o processo de codificação, gerando código automático.&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcX8SRgyZa4fjRfe8PUyDQu1hzvnF9ZpSr26sdufwuHFB0cstGHHq77jtPvT40mS4gS-lbLNfMXVIwRwcpH4_M8X-YEmQIcgQFSOBTg7bNddxm224p1Z6dY0rmPyAs-Z-CnqoRJTb10CKt/s537/eclipseolamundo.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;221&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcX8SRgyZa4fjRfe8PUyDQu1hzvnF9ZpSr26sdufwuHFB0cstGHHq77jtPvT40mS4gS-lbLNfMXVIwRwcpH4_M8X-YEmQIcgQFSOBTg7bNddxm224p1Z6dY0rmPyAs-Z-CnqoRJTb10CKt/s320/eclipseolamundo.png&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Para estudo, aconselho que apague todo este código e escreva todo do zero, pois ajudará no processo de aprendizado.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Na parte do centro da IDE, digitaremos o seguinte código, que fará parte da classe &lt;b&gt;OlaMundo&lt;/b&gt;:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public class&lt;/b&gt; OlaMundo {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main (String[] args){&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
} &lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;&lt;span style=&quot;color: #274e13;&quot;&gt;O JAVA é uma linguagem Case Sensitive (aquela que diferencia letras maiúsculas de letras minúsculas), logo digite tudo do jeito que está aí em cima, respeitando maiúsculas e minúsculas.&lt;/span&gt;&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Pronto! Criamos o alicerce da nossa classe!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;OBS.: O Eclipse consegue gerar todo esse código automaticamente (inclusive o método &lt;b&gt;Main&lt;/b&gt;), mas por questão de aprendizado (falo novamente ^^), é preferível digitar todo o conteúdo.&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;span style=&quot;color: black;&quot;&gt;Agora, clique com o botão direito em cima da classe &lt;b&gt;OlaMundo&lt;/b&gt;&lt;/span&gt;&lt;i&gt; &lt;/i&gt;(no Package Explorer ou no Editor)&lt;i&gt; &lt;/i&gt;&lt;span style=&quot;color: black;&quot;&gt;e direcione-se até &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Run As &amp;gt; Java Application&lt;/b&gt;&lt;/span&gt;&lt;/span&gt;.&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;br /&gt;&lt;/span&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;span style=&quot;color: black;&quot;&gt;Perceba que nada acontece, porém o programa foi gerado.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Nada acontece porque o aplicativo não foi programado para fazer nada.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Vamos dar uma finalidade para ele! Digite, em seu código, a linha em vermelho abaixo:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;codigoProg&quot;&gt;
&lt;b&gt;public class&lt;/b&gt; OlaMundo {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;b&gt;public static void&lt;/b&gt; main (String[] args){&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;System.out.println(&quot;Olá Mundo!&quot;);&lt;/b&gt;&lt;/span&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; }&lt;br /&gt;
} &lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Agora execute do mesmo jeito que fizemos anteriormente.&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI5pHzAOv5MOh5ls5aT-yJJ_seXrHh2hQ12soqqeKsKfb4eFY1vidIvVXjRDK61jeAKDFg7s3-Eh7JE5N3nPpLK4K-11TT8OX868bPHctVz-d-rCT8xpetlO7LeuwXwwoT7OxhJBNqFKaX/s519/olamundo.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;320&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI5pHzAOv5MOh5ls5aT-yJJ_seXrHh2hQ12soqqeKsKfb4eFY1vidIvVXjRDK61jeAKDFg7s3-Eh7JE5N3nPpLK4K-11TT8OX868bPHctVz-d-rCT8xpetlO7LeuwXwwoT7OxhJBNqFKaX/s320/olamundo.png&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Perceba que o programa escreveu no console &quot;&lt;span style=&quot;color: red;&quot;&gt;Olá Mundo!&lt;/span&gt;&quot;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Isto aconteceu porque na linha &lt;b&gt;System.out.println(&quot;Olá Mundo!&quot;);&lt;/b&gt; programamos a aplicação para imprimir na tela a &lt;b&gt;string&lt;/b&gt; (texto) que está entre parênteses.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
String é um tipo de dados, e dados são valores armazenados que os programas utilizam para guardar resultados ou realizar operações.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Bem, isso é tudo, e no próximo post veremos mais sobre tipos de dados, variáveis e operações com valores. &lt;/div&gt;
&lt;br /&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/1717347862858559065/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-03-ola-mundo-o.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/1717347862858559065'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/1717347862858559065'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-03-ola-mundo-o.html' title='Programação - Java Básico 03 - Olá mundo! - O primeiro programa!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3QQM95fWV689cmdY69Yb1O_W-ElrlbjkWFy9xSRITB9j51dwQhe1ONeOvi-7hxOwBmjenYvhG3CZG1TdUBFrZkVd0JXCw6r_5JmAmRjPGSkv_5LjjLS6_rJhR7u3hJ8vuSZlHIj09FjQ/s72-c/512px-helloworld-svg.png" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-7376983021445013143</id><published>2013-07-03T20:22:00.000-07:00</published><updated>2013-07-03T20:22:22.517-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="eclipse"/><category scheme="http://www.blogger.com/atom/ns#" term="editor"/><category scheme="http://www.blogger.com/atom/ns#" term="ide"/><category scheme="http://www.blogger.com/atom/ns#" term="informatiica"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="jdk"/><category scheme="http://www.blogger.com/atom/ns#" term="jre"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><category scheme="http://www.blogger.com/atom/ns#" term="rad"/><title type='text'>Programação - Java Básico 02 - Instalando o Ambiente de Desenvolvimento</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8KVyKmIylIKkvYmt8_TS1D-lQFhJ11IjT8EExQSvPSViHk1YKD_oSNXMxoU4hhpBRYExIGOkN-oF4JsXAD3f3B1DfHfN1GK244Iv6qFU1cPqSVI0HvpuiEWj09kmg04BLSRNuBZLI8w84/s300/Curso-de-Desenvolvimento-Dinamico-Java-Web-em-Porto-Alegre-263x300.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8KVyKmIylIKkvYmt8_TS1D-lQFhJ11IjT8EExQSvPSViHk1YKD_oSNXMxoU4hhpBRYExIGOkN-oF4JsXAD3f3B1DfHfN1GK244Iv6qFU1cPqSVI0HvpuiEWj09kmg04BLSRNuBZLI8w84/s300/Curso-de-Desenvolvimento-Dinamico-Java-Web-em-Porto-Alegre-263x300.jpg&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Mesmo uma linguagem de programação compilada-interpretada precisa de um ambiente de desenvolvimento!&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Seguindo a nossa série de posts sobre a linguagem JAVA, esta é a segunda parte desta onda, sendo que será abordado a preparação do seu ambiente de desenvolvimento JAVA. Chega de papo! Mãos &quot;na obra&quot;!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;JRE e JDK&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Como vimos no post passado, programas precisam de um &lt;b&gt;Compilador&lt;/b&gt;, para serem gerados, e de um &lt;b&gt;Launcher&lt;/b&gt;, para serem executados (&lt;a href=&quot;http://diariodainformatica.blogspot.com.br/2013/07/programacao-java-basico-01-o-que-e.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;veja o post anterior&lt;/a&gt;). O &lt;b&gt;Compilador&lt;/b&gt; da linguagem JAVA é o &lt;b&gt;JDK&lt;/b&gt; (Java Development Kit), e o &lt;b&gt;Launcher&lt;/b&gt; (Máquina Virtual) é o &lt;b&gt;JRE&lt;/b&gt; (Java Runtime Environment). Ambos são baixáveis no site do Java. Acessem e baixem nos links abaixo:&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://www.java.com/pt_BR/download/manual.jsp&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Download JRE&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Download JDK&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Faça os downloads e instale as versões corretas para o seu Sistema Operacional (Windows, Linux, etc...).&lt;/div&gt;
&lt;br /&gt;
&lt;b&gt;IDE (&lt;/b&gt;&lt;b&gt;&lt;span class=&quot;st&quot;&gt;Integrated Development Environment&lt;/span&gt;)&lt;/b&gt;&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg29A1REkyFILFhXmIhVWwvwUNAZqt2jiLFdT0YE0Cnc_R-XDroHuyATOZy7KlymVjgPVZ01PIkdshqDfQ37iGfTvyR7HbRoW3UrQCW57Dg_gfCKEOc5xnCYMmIH6mmXcnNZPqA0TiZii7B/s473/eclipse_1.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;218&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg29A1REkyFILFhXmIhVWwvwUNAZqt2jiLFdT0YE0Cnc_R-XDroHuyATOZy7KlymVjgPVZ01PIkdshqDfQ37iGfTvyR7HbRoW3UrQCW57Dg_gfCKEOc5xnCYMmIH6mmXcnNZPqA0TiZii7B/s320/eclipse_1.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Agora precisamos de um &lt;b&gt;Editor&lt;/b&gt; para começarmos a criar os nossos programinhas, e dentre muitos, o meu preferido é o Eclipse.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;Sinta-se a vontade para explorar novas IDEs.&lt;/i&gt; &lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O Eclipse não é só uma ferramenta para JAVA, mas também para outras linguagens, logo baixe a versão correta. Eu indico a &lt;b&gt;Eclipse IDE for Java Developers&lt;/b&gt;.&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://www.eclipse.org/downloads/&quot; style=&quot;text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Download Eclipse&lt;/a&gt;&amp;nbsp;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Baixe e descompacte, de preferência, em uma pasta dentro do diretório do usuário. Exemplo &lt;span style=&quot;color: red;&quot;&gt;&lt;i&gt;(No Windows - &lt;b&gt;C:\Users\David\eclipse&lt;/b&gt;; No Linux - &lt;b&gt;/home/david/eclipse&lt;/b&gt;).&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;span style=&quot;color: black;&quot;&gt;Pronto! Agora nosso ambiente de desenvolvimento JAVA&amp;nbsp; já está pronto! Para testar se está tudo OK, execute o programa &lt;b&gt;eclipse&lt;/b&gt;&lt;i&gt;, &lt;/i&gt;dentro da pasta extraída.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;span style=&quot;color: black;&quot;&gt;No próximo passo, iremos gerar o nosso primeiro programa em JAVA! &lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;span style=&quot;color: black;&quot;&gt;Qualquer dúvida ou problemas encontrados, deixem nos comentários!&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;color: red;&quot;&gt;&lt;span style=&quot;color: black;&quot;&gt;&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt;
</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/7376983021445013143/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-02-instalando-o.html#comment-form' title='1 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/7376983021445013143'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/7376983021445013143'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-02-instalando-o.html' title='Programação - Java Básico 02 - Instalando o Ambiente de Desenvolvimento'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8KVyKmIylIKkvYmt8_TS1D-lQFhJ11IjT8EExQSvPSViHk1YKD_oSNXMxoU4hhpBRYExIGOkN-oF4JsXAD3f3B1DfHfN1GK244Iv6qFU1cPqSVI0HvpuiEWj09kmg04BLSRNuBZLI8w84/s72-c/Curso-de-Desenvolvimento-Dinamico-Java-Web-em-Porto-Alegre-263x300.jpg" height="72" width="72"/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-8067860255182136407</id><published>2013-07-03T06:58:00.000-07:00</published><updated>2013-07-03T09:06:09.322-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="basico"/><category scheme="http://www.blogger.com/atom/ns#" term="da"/><category scheme="http://www.blogger.com/atom/ns#" term="diario"/><category scheme="http://www.blogger.com/atom/ns#" term="informatica"/><category scheme="http://www.blogger.com/atom/ns#" term="java"/><category scheme="http://www.blogger.com/atom/ns#" term="programacao"/><title type='text'>Programação - Java Básico 01 - O que é a Linguagem JAVA</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim8VAyov7r198JPzQFZkw349p6KenMqOmFSNqWyQC2uxJy6fopp6URX43yIjdSts2Xrrw0dIlL-zNq_i8ty2jCtaVNDcj7expfjsYZw5szV8s7lyZ-EbS3NgnSpL4_6V2diECltdBapYO5/s460/java-2.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;242&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim8VAyov7r198JPzQFZkw349p6KenMqOmFSNqWyQC2uxJy6fopp6URX43yIjdSts2Xrrw0dIlL-zNq_i8ty2jCtaVNDcj7expfjsYZw5szV8s7lyZ-EbS3NgnSpL4_6V2diECltdBapYO5/s320/java-2.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;A linguagem JAVA é uma das mais usadas hoje em dia, nos garantindo inúmeras possibilidades.&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Este é o primeiro de muitos outros posts voltado à área de programação, e como primeira linguagem, foi escolhido o JAVA, que é uma das mais difundidas entre os programadores da atualidade.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Neste primeiro momento estaremos conhecendo um pouco sobre a linguagem de programação a ser estudada, abordando sobre &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Launcher&lt;/b&gt;&lt;/span&gt;, &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Compilador&lt;/b&gt;&lt;/span&gt; e&amp;nbsp; &lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Editor&lt;/b&gt;&lt;/span&gt; perante a linguagem JAVA.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;
Mas o que são launchers, compiladores e editores?&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Launcher&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Bem, um &lt;b&gt;launcher&lt;/b&gt; é aquele programa, ou conjunto de programas que executam os programas. Isso mesmo, para que um programa seja executado, ele precisa ser chamado por outro.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
No JAVA, se quisermos abrir um programa &quot;na mão&quot;, precisamos abrir um terminal &lt;i&gt;&lt;span style=&quot;color: red;&quot;&gt;(No Microsoft&amp;nbsp; Windows, &lt;b&gt;Menu Iniciar &amp;gt; Executar&lt;/b&gt;, digita &lt;b&gt;CMD&lt;/b&gt; e tecle &lt;b&gt;Enter&lt;/b&gt;)&lt;/span&gt;&lt;/i&gt; , digitar &quot;java NomedaClasse.class&quot; ou &quot;java -jar NomeDoPrograma.jar&quot;.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Esta linguagem trabalha com Orientação a Objetos, sendo que tudo gerado nela se transforma em classe ou está dentro de uma.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Uma Linguagem Orientada a Objetos tenta tratar o código de uma forma mais humana, possibilitando abstrair um objeto da vida real para dentro do código-fonte.&amp;nbsp;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Exemplo:&lt;/div&gt;
&lt;br /&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;b&gt;Banco&lt;/b&gt; &lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg19o-QOOL3MAkJ3fN_75TCszy75Mi-L3s1kpnBvt2wzTcGK69EsFH0Tu7_yjJkyyYM4Oai2NtJZ7Vxwj6fLfnGTboYpepCCFkklShZXu5naF9-jBAFvzjNtf_mQLT6ZWFL_QlYqtDXTX2n/s300/banco.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg19o-QOOL3MAkJ3fN_75TCszy75Mi-L3s1kpnBvt2wzTcGK69EsFH0Tu7_yjJkyyYM4Oai2NtJZ7Vxwj6fLfnGTboYpepCCFkklShZXu5naF9-jBAFvzjNtf_mQLT6ZWFL_QlYqtDXTX2n/s200/banco.jpg&quot; width=&quot;200&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Se fôssemos criar uma classe para este objeto, precisaríamos capturar atributos (Nada de programação ainda), então:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;Classe Banco {&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Atributo cor=marrom;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Atributo material=madeira;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; Atributo tipo=tamburete;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;}&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Veremos mais a frente o que é classe, objeto e como tratá-los.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Compilador&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
É o programa, ou o conjunto de programas, que transforma o código-fonte escrito na linguagem de programação para a linguagem de máquina (o programa em si).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
A linguagem JAVA não é como as tradicionais, que gera um programa binário que é executado pelo launcher padrão do sistema operacional (linguagem compilada), nem mesmo funciona como scripts de linguagens interpretadas.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Na verdade, esta linguagem é uma híbrida, pois primeiro o programa é compilado, porém são gerados bytecodes, que são interpretados pelo Launcher padrão do JAVA, que nós chamamos de Máquina Virtual JAVA (JVM).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Editor&lt;/b&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Também chamados de IDE, é o ambiente onde criamos o código-fonte.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Existem IDEs chamadas ferramentas RAD (Rapid Application Development), que nos ajudam a programar de uma forma muito mais rápida, e inclusive iremos utilizar uma dessas ferramentas para trabalhar.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Em nosso próximo post estaremos instalando o nosso ambiente de desenvolvimento.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;br /&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/8067860255182136407/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-01-o-que-e.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/8067860255182136407'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/8067860255182136407'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/programacao-java-basico-01-o-que-e.html' title='Programação - Java Básico 01 - O que é a Linguagem JAVA'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim8VAyov7r198JPzQFZkw349p6KenMqOmFSNqWyQC2uxJy6fopp6URX43yIjdSts2Xrrw0dIlL-zNq_i8ty2jCtaVNDcj7expfjsYZw5szV8s7lyZ-EbS3NgnSpL4_6V2diECltdBapYO5/s72-c/java-2.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-3509060916305624259</id><published>2013-07-03T03:45:00.003-07:00</published><updated>2013-07-03T03:45:28.219-07:00</updated><title type='text'>Artigo - De volta a ativa!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjQVHeEzAZX87i-EtmOo37uhcMX2JgRAx_VOPw7oom8E872gNqsouyr6uKAmBfuUR4qIaTlzJXpBAfKhwVuitGWDI0jkBz4azllk1ajWT-UbqUcwh-nLJgc3S2r8WNdpzJa8QGBCrPwtgz/s150/logo_retomada_big.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjQVHeEzAZX87i-EtmOo37uhcMX2JgRAx_VOPw7oom8E872gNqsouyr6uKAmBfuUR4qIaTlzJXpBAfKhwVuitGWDI0jkBz4azllk1ajWT-UbqUcwh-nLJgc3S2r8WNdpzJa8QGBCrPwtgz/s150/logo_retomada_big.png&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&amp;nbsp;&amp;nbsp; &lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;Olá a todos que visitam este humilde diário de informações!&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Venho hoje até vocês para informar a retomada das atividades do blog, pois uma poderosa fonte de informações como esta não pode parar, não é verdade?&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Estaremos criando uma nova categoria de Posts, que é ela a &quot;Programação&quot;.&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxS3xl5AD1Bs8aopJF_n5oTzXtW7Z0Ue9mN55ORtq_kJcY-KPcSODphpbZ6d0ai0HfJgeZN3PlDFlsxIV4y17FpXAWzzGs12RtO4lkS8OQ2g7H5MpguHtuQeThgK75NPnbjtkcB4YA92q2/s1043/programador.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;320&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxS3xl5AD1Bs8aopJF_n5oTzXtW7Z0Ue9mN55ORtq_kJcY-KPcSODphpbZ6d0ai0HfJgeZN3PlDFlsxIV4y17FpXAWzzGs12RtO4lkS8OQ2g7H5MpguHtuQeThgK75NPnbjtkcB4YA92q2/s320/programador.jpg&quot; width=&quot;226&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Dentro deste novo universo estaremos postando dicas básicas e avançadas sobre desenvolvimento de softwares e banco de dados.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Então, posso garantir aos senhores e senhoras que o nosso Diário da Informática ficará muito mais interessante daqui para frente.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Até a próxima!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;span style=&quot;font-size: x-small;&quot;&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr&lt;/b&gt;&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/3509060916305624259/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/artigo-de-volta-ativa.html#comment-form' title='1 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/3509060916305624259'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/3509060916305624259'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2013/07/artigo-de-volta-ativa.html' title='Artigo - De volta a ativa!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjQVHeEzAZX87i-EtmOo37uhcMX2JgRAx_VOPw7oom8E872gNqsouyr6uKAmBfuUR4qIaTlzJXpBAfKhwVuitGWDI0jkBz4azllk1ajWT-UbqUcwh-nLJgc3S2r8WNdpzJa8QGBCrPwtgz/s72-c/logo_retomada_big.png" height="72" width="72"/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-417417555024773355</id><published>2012-09-02T16:38:00.001-07:00</published><updated>2012-09-02T16:38:36.320-07:00</updated><title type='text'>Artigo - Ideias, o caminho do sucesso!</title><content type='html'>&lt;div&gt;&lt;p&gt;Hoje em dia(e acho que sempre) o ser humano estuda intensamente em m&amp;#233;dia 1/3 da sua vida para que possa conseguir um bom trabalho em uma empresa de respeito. Mas ser&amp;#225; que o objetivo final realmente vale a pena?&lt;/p&gt;
&lt;p&gt;Tanto profissionais bem formados quanto aqueles com nenhuma forma&amp;#231;&amp;#227;o, normalmente trabalham 8(oito) horas por dia e 5-6 dias por semana, e &amp;#224;s vezes at&amp;#233; mais. Levando em conta o sal&amp;#225;rio, muitos cargos valem e muito a pena, por&amp;#233;m j&amp;#225; se falando do proveito da vida do indiv&amp;#237;duo n&amp;#243;s n&amp;#227;o podemos dizer o mesmo.&lt;/p&gt;
&lt;p&gt;Sigam o racioc&amp;#237;nio: um profissional bem formado sai de casa &amp;#224;s 8h e vai ao trabalho. Sai para o hor&amp;#225;rio de almo&amp;#231;o &amp;#224;s 12h. Retorna &amp;#224;s 14h. Volta outra casa &amp;#224;s 18h morrendo de cansa&amp;#231;o, n&amp;#227;o tendo nem energia para dar aten&amp;#231;&amp;#227;o a esposa ou aos filhos. Como um indiv&amp;#237;duo pode aproveitar a vida deste jeito?&lt;/p&gt;
&lt;p&gt;Uma boa op&amp;#231;&amp;#227;o, como sugere o t&amp;#237;tulo da postagem, &amp;#233; a confec&amp;#231;&amp;#227;o de uma ideia lucrativa, como a produ&amp;#231;&amp;#227;o de um site de alguma coisa.&lt;/p&gt;
&lt;p&gt;Fica a dica para quem deseja ter mais tempo para a sua pr&amp;#243;pria vida e mais dinheiro no bolso.&lt;/p&gt;
&lt;p&gt;&lt;i&gt;&lt;b&gt;David de Almeida Bezerra Jr.&lt;/b&gt;&lt;/i&gt;&lt;/p&gt;
&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/417417555024773355/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/09/artigo-ideias-o-caminho-do-sucesso.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/417417555024773355'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/417417555024773355'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/09/artigo-ideias-o-caminho-do-sucesso.html' title='Artigo - Ideias, o caminho do sucesso!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-1775299869521577316</id><published>2012-09-01T10:00:00.001-07:00</published><updated>2012-09-01T10:00:49.934-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="de"/><category scheme="http://www.blogger.com/atom/ns#" term="diagrama"/><category scheme="http://www.blogger.com/atom/ns#" term="engenharia"/><category scheme="http://www.blogger.com/atom/ns#" term="implantação"/><category scheme="http://www.blogger.com/atom/ns#" term="software"/><category scheme="http://www.blogger.com/atom/ns#" term="uml"/><title type='text'>Artigo - Diagrama de Implantação!</title><content type='html'>&lt;div&gt;&lt;p&gt;Em engenharia de software, o diagrama de implanta&amp;#231;&amp;#227;o nada mais &amp;#233; que uma demonstra&amp;#231;&amp;#227;o de como o ambiente tecnol&amp;#243;gico estar&amp;#225; disposto para suportar o software desenvolvido.&lt;/p&gt;
&lt;p&gt;Este diagrama da uml 2.0 &amp;#233; composto por um cubo, chamado de &lt;b&gt;n&amp;#243;&lt;/b&gt;, e &lt;b&gt;associa&amp;#231;&amp;#245;es&lt;/b&gt;, contendo as cardinalidades.&lt;/p&gt;
&lt;p&gt;Na imagem segue um exemplo de como &amp;#233; feito um diagrama de implanta&amp;#231;&amp;#227;o.&lt;/p&gt;
&lt;p&gt;&lt;i&gt;&lt;b&gt;David de Almeida Bezerra Jr.&lt;/b&gt;&lt;/i&gt;&lt;/p&gt;
&lt;br/&gt;&lt;img src=&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvsHSTwF7fPKIDnOQu6UL-iwA4TfQ85CjfyZzLmOS67ngu2vcgVk5b-ndn0L3mxQ4xiZ_LAN0nbCyGIKcwyTB9U3fN2LWaEMcgBIskFqubv1xWrBlor9tzExN_7YVSAZXzdLSAgU0YIhnk/&#39; /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/1775299869521577316/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/09/artigo-diagrama-de-implantacao.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/1775299869521577316'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/1775299869521577316'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/09/artigo-diagrama-de-implantacao.html' title='Artigo - Diagrama de Implantação!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvsHSTwF7fPKIDnOQu6UL-iwA4TfQ85CjfyZzLmOS67ngu2vcgVk5b-ndn0L3mxQ4xiZ_LAN0nbCyGIKcwyTB9U3fN2LWaEMcgBIskFqubv1xWrBlor9tzExN_7YVSAZXzdLSAgU0YIhnk/s72-c" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-509173620744050050</id><published>2012-08-26T12:00:00.001-07:00</published><updated>2012-08-26T12:01:20.697-07:00</updated><title type='text'>De volta a ativa!</title><content type='html'>&lt;div&gt;&lt;p&gt;Ol&amp;#225; a todos! Pe&amp;#231;o desculpas pois por motivos pessoais tive que estar deixando o blog abandonado, mas j&amp;#225; aviso que a partir de agora estamos voltando a ativa, trazendo mais dicas e novidades da nossa &amp;#225;rea, a Inform&amp;#225;tica.&lt;/p&gt;
&lt;p&gt;A todos uma &amp;#243;tima semana e obrigado pela compreens&amp;#227;o!&lt;/p&gt;
&lt;p&gt;&lt;i&gt;&lt;b&gt;Ass.: David de Almeida Bezerra Jr.&lt;/b&gt;&lt;/i&gt;&lt;/p&gt;
&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/509173620744050050/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/08/de-volta-ativa.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/509173620744050050'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/509173620744050050'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/08/de-volta-ativa.html' title='De volta a ativa!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-4288236372396764688</id><published>2012-04-27T10:36:00.000-07:00</published><updated>2012-04-27T10:41:20.069-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="android"/><category scheme="http://www.blogger.com/atom/ns#" term="google"/><category scheme="http://www.blogger.com/atom/ns#" term="linux"/><category scheme="http://www.blogger.com/atom/ns#" term="maquina"/><category scheme="http://www.blogger.com/atom/ns#" term="operacionais"/><category scheme="http://www.blogger.com/atom/ns#" term="sistemas"/><category scheme="http://www.blogger.com/atom/ns#" term="so"/><category scheme="http://www.blogger.com/atom/ns#" term="tutoriais"/><category scheme="http://www.blogger.com/atom/ns#" term="virtual"/><category scheme="http://www.blogger.com/atom/ns#" term="virtualbox"/><title type='text'>Tutorial - Executando o Android no PC!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1VIpltiYZN03wfa8c0Euk54VHT_GpwXCrlGv-kvAsOl3Ex9LdxQ80MmPmGL4QivH_iJPqAfMZdKpHNB3_m9pHEKbNEpTZ2KowOEzL4Cchyyf6M8kQBegPSTzN-oxdpNFwqNjO7hGu9VvP/s1600/capa.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;237&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1VIpltiYZN03wfa8c0Euk54VHT_GpwXCrlGv-kvAsOl3Ex9LdxQ80MmPmGL4QivH_iJPqAfMZdKpHNB3_m9pHEKbNEpTZ2KowOEzL4Cchyyf6M8kQBegPSTzN-oxdpNFwqNjO7hGu9VvP/s320/capa.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&lt;span style=&quot;font-size: x-small;&quot;&gt;Ele é o sistema operacional para dispositivos móveis, de certa forma, mais cobiçado ao redor do globo nestes últimos tempos, e você ainda consegue rodá-lo no seu PC!&lt;/span&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Neste tutorial que se segue meus amigos, irei lhes demonstrar como ter uma cópia do Android em seu PC sem ter que desinstalar o seu sistema operacional padrão, seja ele Windows, Linux ou MacOS X. Lembrando que não sendo um sistema apropriado para PCs, não torna-se útil para o uso cotidiano como sistema principal.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Antes de tudo, baixe e instale a Oracle VM VirtualBox, que é um software, que simula um computador real em seu ambiente de trabalho. Abaixo segue o link no site do projeto. Baixe o correspondente à sua plataforma(Windows, Linux, etc...):&lt;/div&gt;
&lt;div&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;https://www.virtualbox.org/wiki/Downloads&quot; target=&quot;_blank&quot;&gt;Download VirtualBox&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Agora você precisa da imagem do CD do Live Android, baixável a partir do link abaixo:&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://code.google.com/p/live-android/downloads/detail?name=liveandroidv0.3.iso.001&quot; target=&quot;_blank&quot;&gt;Download Live Android Parte 1&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://code.google.com/p/live-android/downloads/detail?name=liveandroidv0.3.iso.002&quot; target=&quot;_blank&quot;&gt;Download Live Android Parte 2&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Junte as duas partes baixadas com o HJSplit:&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;a href=&quot;http://www.baixaki.com.br/site/dwnld40894.htm&quot; target=&quot;_blank&quot;&gt;Download HJSplit&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: center;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Após instalado e juntado as partes do Live Android com HJSplit, abramos o VirtualBox e metamos as mãos na massa:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbouTEIuezPDYIP6nmk6R-th4Jn3wGvaBgvFnOFoGZnqNHBafneJx61p5UOAYVDimp1Jt670Vzj_ZRuUYWsRYIr6zHXOTp4n_L0i4oRmuQHXetDrdLyIQMalAfwQ_hrXBymH1GxvksgVsE/s1600/Captura_de_tela-Oracle+VM+VirtualBox+Gerenciador.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;295&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbouTEIuezPDYIP6nmk6R-th4Jn3wGvaBgvFnOFoGZnqNHBafneJx61p5UOAYVDimp1Jt670Vzj_ZRuUYWsRYIr6zHXOTp4n_L0i4oRmuQHXetDrdLyIQMalAfwQ_hrXBymH1GxvksgVsE/s400/Captura_de_tela-Oracle+VM+VirtualBox+Gerenciador.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Clique no botão &lt;b&gt;Novo&lt;/b&gt;, abaixo do menu &lt;b&gt;Arquivo&lt;/b&gt;&amp;nbsp;para criarmos a máquina virtual que rodará o Android.&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Após isso, siga as imagens abaixo:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHO7dvsnjt_1iuU5Eq2pdDtnItN0LtDkiGlc5XwHXQo0gdg1HUIaqRK7xFOP6UaZ9EGQsLtzL0uV3X13m_T2dd8rbGos7XZ6EQ7UxlVQJwN6s1av1mE-FZBiX0WqriGBvQfAqJht4LoIRg/s1600/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;266&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHO7dvsnjt_1iuU5Eq2pdDtnItN0LtDkiGlc5XwHXQo0gdg1HUIaqRK7xFOP6UaZ9EGQsLtzL0uV3X13m_T2dd8rbGos7XZ6EQ7UxlVQJwN6s1av1mE-FZBiX0WqriGBvQfAqJht4LoIRg/s400/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDHttj8eK3J2yyRK0gUuELhQdPJPqnzmfaRcGtTcPGoxwr9EvbCaEiT_-dgOa_od86zDuTpJ_5FYodepSv6TAQTVxPhIyvAtYqFFPiV40Q5FrZDeWAeuQda8hJNZ8LGxzmXVN1_MgVMQvO/s1600/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual-1.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;266&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDHttj8eK3J2yyRK0gUuELhQdPJPqnzmfaRcGtTcPGoxwr9EvbCaEiT_-dgOa_od86zDuTpJ_5FYodepSv6TAQTVxPhIyvAtYqFFPiV40Q5FrZDeWAeuQda8hJNZ8LGxzmXVN1_MgVMQvO/s400/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual-1.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtsgkEvXJJkk-LvXhLwWBXcoEvLQLKWsG8-eGphXfElUfRztHu4QN7ORyisxMAm9RppPdLgv6t7p-pR9_9v21bGTevoGjgXdVWY-dFXYvc8eCnVwa2WFxrJmrsaQDM642go6ye94bz9Hxg/s1600/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual-2.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;267&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtsgkEvXJJkk-LvXhLwWBXcoEvLQLKWsG8-eGphXfElUfRztHu4QN7ORyisxMAm9RppPdLgv6t7p-pR9_9v21bGTevoGjgXdVWY-dFXYvc8eCnVwa2WFxrJmrsaQDM642go6ye94bz9Hxg/s400/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual-2.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZmhT1imMaJSgGUj3D-KjlrnbiadC1afO_DCb3j-TX5MKlNKkiwxHwpREYMl2J3eZS5yEooPxPESW48zj_7ak5Aqxj6ItK4DTWxyfCKcl0v5jpnPl8ANk4fAbrVBCx8LERP9tuD-5H9G5x/s1600/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual-3.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;267&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZmhT1imMaJSgGUj3D-KjlrnbiadC1afO_DCb3j-TX5MKlNKkiwxHwpREYMl2J3eZS5yEooPxPESW48zj_7ak5Aqxj6ItK4DTWxyfCKcl0v5jpnPl8ANk4fAbrVBCx8LERP9tuD-5H9G5x/s400/Captura_de_tela-Criar+Nova+M%C3%A1quina+Virtual-3.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSHRLh5buCvF-KSK5-yxrb6XSyTfRe6Jc6NiTTaCQSvtHTRZlpOTyNmHY-8HCpSztM290Mfk4_nfuc5m7RlII0mAj09_0sVNm73muxvyalBS5L6_epzeBX3uA38SImk6SoncvktjSpSzdl/s1600/Captura_de_tela-Criar+Novo+Disco+Virtual.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;257&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSHRLh5buCvF-KSK5-yxrb6XSyTfRe6Jc6NiTTaCQSvtHTRZlpOTyNmHY-8HCpSztM290Mfk4_nfuc5m7RlII0mAj09_0sVNm73muxvyalBS5L6_epzeBX3uA38SImk6SoncvktjSpSzdl/s400/Captura_de_tela-Criar+Novo+Disco+Virtual.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwq-KmzNrvQ2kxoSJUARHACnG8Rff1vKuWHI2cYWceh1pGt8lfpINBYtCn5YPbS-JrjOHuzJL8MQc4RrodKajpwoSTUTB8mKZ1SBkLku4nqpiJ3X0oliZjxITlXc6PT9D1IkMKQZdSAvm4/s1600/Captura_de_tela-Criar+Novo+Disco+Virtual-1.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;257&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwq-KmzNrvQ2kxoSJUARHACnG8Rff1vKuWHI2cYWceh1pGt8lfpINBYtCn5YPbS-JrjOHuzJL8MQc4RrodKajpwoSTUTB8mKZ1SBkLku4nqpiJ3X0oliZjxITlXc6PT9D1IkMKQZdSAvm4/s400/Captura_de_tela-Criar+Novo+Disco+Virtual-1.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7oW-0l4qqxiPo6Sm_5Q_jXsZv1gUuwGhZr4yhkfhGMdtf8L-JJjgKpOm_RtzYyEzdwqlJ3KLb1fbwlGiBuq7kdXU40qpDa8ZuUHz-KwQQ14F7ohXmRQ0ToOIxiA_sck2ozHdNKolwqDPx/s1600/Captura_de_tela-Criar+Novo+Disco+Virtual-2.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;257&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7oW-0l4qqxiPo6Sm_5Q_jXsZv1gUuwGhZr4yhkfhGMdtf8L-JJjgKpOm_RtzYyEzdwqlJ3KLb1fbwlGiBuq7kdXU40qpDa8ZuUHz-KwQQ14F7ohXmRQ0ToOIxiA_sck2ozHdNKolwqDPx/s400/Captura_de_tela-Criar+Novo+Disco+Virtual-2.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0h_KO3CiLMZQU1u6VBce7Vo0St6UKQ9GDOz7Od0cQTjlbq55S2i5c-Zt9GNEDMfWgEAtiNuN7xZNPMIbxOreVYHdYzU0qTN7fguBiSS2ZMingLMpqzW0a2loTIOiJoW2Thzq4UF7e_8lZ/s1600/Captura_de_tela-Criar+Novo+Disco+Virtual-3.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;257&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0h_KO3CiLMZQU1u6VBce7Vo0St6UKQ9GDOz7Od0cQTjlbq55S2i5c-Zt9GNEDMfWgEAtiNuN7xZNPMIbxOreVYHdYzU0qTN7fguBiSS2ZMingLMpqzW0a2loTIOiJoW2Thzq4UF7e_8lZ/s400/Captura_de_tela-Criar+Novo+Disco+Virtual-3.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Finalize e agora selecione a máquina virtual criada e clique em Iniciar:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWt1PBypCJKyuHIUylh_e7qWriwo0e8uVqqQDE3Y-NFs66GWDPpncH6KXmstVn3fB9ofcBC73CBE8O6mhs-b6LbN8e8byAkK7VGPyO5wkUMOa6qfG8vAnUG4vv3e2P8eCIMtA85KWkUXOS/s1600/Captura_de_tela-Oracle+VM+VirtualBox+Gerenciador-1.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;296&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWt1PBypCJKyuHIUylh_e7qWriwo0e8uVqqQDE3Y-NFs66GWDPpncH6KXmstVn3fB9ofcBC73CBE8O6mhs-b6LbN8e8byAkK7VGPyO5wkUMOa6qfG8vAnUG4vv3e2P8eCIMtA85KWkUXOS/s400/Captura_de_tela-Oracle+VM+VirtualBox+Gerenciador-1.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpEicYWxSgUZp4lZPE4mlCr_ZokZdcucCAbIQhp0zkKLwlVyvH3X2V2noXTo25qY3sEmtgZ65w_fI_NW6aH0AvGWr-Xqhmb3VcQYtIkE_ZfrJBx5VlE0n_2pFqaUWQCr9Ma-iCqtSz-SJQ/s1600/Captura_de_tela-Assistente+de+Primeira+Execu%C3%A7%C3%A3o.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;248&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpEicYWxSgUZp4lZPE4mlCr_ZokZdcucCAbIQhp0zkKLwlVyvH3X2V2noXTo25qY3sEmtgZ65w_fI_NW6aH0AvGWr-Xqhmb3VcQYtIkE_ZfrJBx5VlE0n_2pFqaUWQCr9Ma-iCqtSz-SJQ/s400/Captura_de_tela-Assistente+de+Primeira+Execu%C3%A7%C3%A3o.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Agora selecione a imagem ISO do Live Android, seja lá onde você colocou:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLP5hrzQZn4L0v9i6KCMK3UKkgL7FuBLMEvL6e7XDknkQK-NlB86e4qBLBqdTtN6qzvYj-yhsxTMGQFI9_Tb3DDdpS9UNB8emjCc6yrsG79R0ty7ZoPqSscLEsmf_TYmg_4eu7yMtyXwNd/s1600/Captura_de_tela-Assistente+de+Primeira+Execu%C3%A7%C3%A3o-1.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;248&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLP5hrzQZn4L0v9i6KCMK3UKkgL7FuBLMEvL6e7XDknkQK-NlB86e4qBLBqdTtN6qzvYj-yhsxTMGQFI9_Tb3DDdpS9UNB8emjCc6yrsG79R0ty7ZoPqSscLEsmf_TYmg_4eu7yMtyXwNd/s400/Captura_de_tela-Assistente+de+Primeira+Execu%C3%A7%C3%A3o-1.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIGcWtqd6sFw0zJ83HRl92REpzuDz6x9zIOatzRlkFKO6SaNY-73l8HogxmxOJSSKtIWO4iaLNV1qiSj5Ad2635NZp7XxDaKhMg4E3ijRy6R-E2MVtTlnYHpFAdyRy5SRVWubz3P7tncdM/s1600/Captura_de_tela-Selecione+um+arquivo+de+CD-DVD+virtual.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;267&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIGcWtqd6sFw0zJ83HRl92REpzuDz6x9zIOatzRlkFKO6SaNY-73l8HogxmxOJSSKtIWO4iaLNV1qiSj5Ad2635NZp7XxDaKhMg4E3ijRy6R-E2MVtTlnYHpFAdyRy5SRVWubz3P7tncdM/s400/Captura_de_tela-Selecione+um+arquivo+de+CD-DVD+virtual.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Executando, selecione a primeira opção na tela de boot:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitD42ONwfzYThZiL6IK2kRHbKgpMJD6rBm7pUAscwc8u1_wDUKtgfwfeyb_SoHYmCy6LVexAylb2_z_Dn7C0gNHFcVLZFJiba3udUXPcHaRYG7eykN0qzKK9YEVXxJz2DVUOOwDV3NaFEY/s1600/Captura_de_tela-Android+%5BExecutando%5D+-+Oracle+VM+VirtualBox.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;341&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitD42ONwfzYThZiL6IK2kRHbKgpMJD6rBm7pUAscwc8u1_wDUKtgfwfeyb_SoHYmCy6LVexAylb2_z_Dn7C0gNHFcVLZFJiba3udUXPcHaRYG7eykN0qzKK9YEVXxJz2DVUOOwDV3NaFEY/s400/Captura_de_tela-Android+%5BExecutando%5D+-+Oracle+VM+VirtualBox.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcap5YwcSMN6RAIL8TNJPvLOeJxSZM1vyxVt1lFwRBaQLXn-YGz2o5LdPilSLcp9LGWxO4mHa253C2Nj1AVNWtDrdMLHGdN0Y2yeuG5Ve0jKoEpH2BcPSWHTnL0r2II5nvGq14Ly6XFUIY/s1600/Captura_de_tela-Android+%5BExecutando%5D+-+Oracle+VM+VirtualBox-1.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;332&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcap5YwcSMN6RAIL8TNJPvLOeJxSZM1vyxVt1lFwRBaQLXn-YGz2o5LdPilSLcp9LGWxO4mHa253C2Nj1AVNWtDrdMLHGdN0Y2yeuG5Ve0jKoEpH2BcPSWHTnL0r2II5nvGq14Ly6XFUIY/s400/Captura_de_tela-Android+%5BExecutando%5D+-+Oracle+VM+VirtualBox-1.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Pronto! =D&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3DjCqxzSPv5Abrtkan7SI_Fkyybzjlc0NYBAOp6A9DTLb7JkiN66J0ExiybqyLenSdXTbPXkVJX2qJ63MqLdsMFlCswuHr9mUkCjWLMTuGgv-frwrCzAC18VM3LHr6-rfcDIUwRX8_R6e/s1600/Captura_de_tela-Android+%5BExecutando%5D+-+Oracle+VM+VirtualBox-2.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;332&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3DjCqxzSPv5Abrtkan7SI_Fkyybzjlc0NYBAOp6A9DTLb7JkiN66J0ExiybqyLenSdXTbPXkVJX2qJ63MqLdsMFlCswuHr9mUkCjWLMTuGgv-frwrCzAC18VM3LHr6-rfcDIUwRX8_R6e/s400/Captura_de_tela-Android+%5BExecutando%5D+-+Oracle+VM+VirtualBox-2.png&quot; width=&quot;400&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
Valeu pessoal! Até a próxima!&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;b&gt;&lt;i&gt;&lt;span style=&quot;font-size: x-small;&quot;&gt;Ass.: David de Almeida Bezerra Jr&lt;/span&gt;&lt;/i&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/4288236372396764688/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/04/tutorial-executando-o-android-no-pc.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4288236372396764688'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4288236372396764688'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/04/tutorial-executando-o-android-no-pc.html' title='Tutorial - Executando o Android no PC!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1VIpltiYZN03wfa8c0Euk54VHT_GpwXCrlGv-kvAsOl3Ex9LdxQ80MmPmGL4QivH_iJPqAfMZdKpHNB3_m9pHEKbNEpTZ2KowOEzL4Cchyyf6M8kQBegPSTzN-oxdpNFwqNjO7hGu9VvP/s72-c/capa.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-4887180046789835162</id><published>2012-04-23T17:41:00.000-07:00</published><updated>2012-04-23T17:41:07.234-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="android"/><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="blackberry"/><category scheme="http://www.blogger.com/atom/ns#" term="c3"/><category scheme="http://www.blogger.com/atom/ns#" term="c5"/><category scheme="http://www.blogger.com/atom/ns#" term="ios"/><category scheme="http://www.blogger.com/atom/ns#" term="iphone"/><category scheme="http://www.blogger.com/atom/ns#" term="ling"/><category scheme="http://www.blogger.com/atom/ns#" term="meego"/><category scheme="http://www.blogger.com/atom/ns#" term="nokia"/><category scheme="http://www.blogger.com/atom/ns#" term="operacional"/><category scheme="http://www.blogger.com/atom/ns#" term="phone"/><category scheme="http://www.blogger.com/atom/ns#" term="sistema"/><category scheme="http://www.blogger.com/atom/ns#" term="smartphone"/><category scheme="http://www.blogger.com/atom/ns#" term="symbian"/><category scheme="http://www.blogger.com/atom/ns#" term="windows"/><category scheme="http://www.blogger.com/atom/ns#" term="xing"/><title type='text'>Smartphone - Uma poderosa ferramenta em nosso dia-a-dia!</title><content type='html'>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCeqBBEk-3IuFFm4ZZMBH5lW2PMCnbIgfgxjyiFKfdu_q0MOaHAs-Amxeyx5SHG6_DAoq8JxMF_YGjF75ZZN_-pDTKLX_482rOPaOFhnQ41beFiwFk8ltmUjtvucGNvnv5Xiu-qcHd2eGH/s1600/nokia-lumia-900.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;262&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCeqBBEk-3IuFFm4ZZMBH5lW2PMCnbIgfgxjyiFKfdu_q0MOaHAs-Amxeyx5SHG6_DAoq8JxMF_YGjF75ZZN_-pDTKLX_482rOPaOFhnQ41beFiwFk8ltmUjtvucGNvnv5Xiu-qcHd2eGH/s320/nokia-lumia-900.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;i&gt;&lt;span style=&quot;font-size: x-small;&quot;&gt;Este aparelho que está sempre ao nosso lado pode fazer mais do que nós podemos pensar!&lt;/span&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Quanto a tecnologia móvel evoluiu de um tempo para cá hein? Nesta sequência eu irei contar como a minha rotina matinal foi apoiada hoje(e quase todos os dias) pelo meu smartphone, mostrando que os nossos dispositivos servem para muito mais do que só fazer ligações. Mas deixando de &quot;blá blá blá&quot;, vamos lá:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Hoje confesso que caí no mal da preguiça, acordei as 09:00 da manhã com o toque do meu smartphone(que pra quem acaba de acordar, é um toque nem um pouco agradável). Quem estava do outro lado da linha era um cliente de outra cidade.&amp;nbsp;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Eu sou programador, e na minha cidade e em alguns lugares da região tenho clientes que utilizam os meus softwares. Mas voltando:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
No estabelecimento deste cliente de outra cidade não possui Internet(talvez por política de trabalho deles, ou outros fatores, não importa), e como o serviço que eu presto para eles é de aluguel de software e não uma venda de um software, toda vez que vence o mês eu tenho que validar o sistema novamente, para que então ele volte a atividade(se ele tivesse Internet seria muito melhor). Sim, mas voltando novamente ao nosso tema:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
A moça do outro lado da linha muito educada me informa que a licença mensal do sistema deles venceu. Para que nós possamos realizar a validação mensal, ela precisa me passar o ID do computador(que é um código que aparece na tela do sistema quando está vencida a licença), e posteriormente eu insiro este código num programa que eu desenvolvi para trabalhar, e este programa me retorna a contra-senha do mês para este cliente. Logo então eu passo esta senha para a moça inserir no software, finalizando o processo.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
O problema é: &quot;Eu acabei de acordar, mas já passara-se a hora de levantar! :D&quot;. Ai que entrou o meu companheiro de bons e maus bocados. Eu não só desenvolvi uma aplicação desktop para validar os meus sistemas, mas também um programa mobile, onde eu poderia realizar um procedimento deste em qualquer lugar que eu estivesse.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Então eu segui a &quot;agoritmizando&quot; esta sequência: pedi um momento para o cliente e coloquei-o no viva-voz para que eu pudesse olhar para a tela do dispositivo; abri o menu de aplicações(já que o aparelho é multitarefa) e procurei o meu validador; inseri a senha(claro que uma aplicação dessas tem que ter senha pra entrar ;D); pedi para a moça para que ela me informasse o ID; inseri o ID passado por ela no programa mobile, gerei a contra-senha e passei a ela de volta; ela colocou no sistema e validou, encerrando a operação com sucesso!&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Pow! Que mão na roda! Mais não parou por aí não! Antes de seguir quero que vocês conheçam o meu smartphone:&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk-nlJwwroS0Rc7pSoEvn0LQayitS-f0NtPkV_dDL3y2uQEOrbeQ3wt_oo-VdjzPIWwo60TepeUC88SRyT5o1vpPwimYI_z5bX9tRfpHFjR2ZdqEpzKCOTl5JC8I7Ec-KXn8rhl4K_z2Ct/s1600/23952091_4.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;320&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk-nlJwwroS0Rc7pSoEvn0LQayitS-f0NtPkV_dDL3y2uQEOrbeQ3wt_oo-VdjzPIWwo60TepeUC88SRyT5o1vpPwimYI_z5bX9tRfpHFjR2ZdqEpzKCOTl5JC8I7Ec-KXn8rhl4K_z2Ct/s320/23952091_4.jpg&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Este é o Nokia C5-03, um dos últimos smartphones da filandesa equipados com o Sistema Operacional Symbian Série 60 5th Edição. Está é a versão Cinemark, um modelo especializado que vem com uma caixa de som de brinde e uma indicação pra baixar o software da Cinemark, que serve para comprar ingressos nos cinemas brasileiros(não sei se serve pra outros países, não instalei o aplicativo).&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Apesar de ser o smartphone mais simples da Nokia(sim, o C3 não é um smartphone, vide o &lt;a href=&quot;http://www.nokia.com/br-pt/produtos/todos-os-aparelhos/?action=catalogsearch&amp;amp;ps=smartphone&amp;amp;page=2&quot; target=&quot;_blank&quot;&gt;link da Nokia&lt;/a&gt;), este aparelho de baixo custo pode lhe surpreender, pois todas as automações diárias que os smartphones de linha fazem ele também faz, claro que não com &lt;strike&gt;o&lt;/strike&gt;a mesm&lt;strike&gt;o&lt;/strike&gt;a&amp;nbsp;&lt;strike&gt;frufru&lt;/strike&gt; elegância, mas não deixa nada a desejar.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Bem, mas vamos lá:&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Logo após eu ter desligado o celular, mal levantei do colchão e o meu cel toca novamente. Desta vez era a minha namorada, que entre as trocas de bom dias e carinhos :P não conseguiu me falar o que queria, pois no sistema de espera de chamada do aparelho tinha outro cliente me ligando, querendo fazer validação também. Daí pedi licença a ela e atendi o meu cliente. Fiz o mesmo processo descrito mais cedo acima.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Quando acabei com o cliente, retomei minha conversa com ela. O que me foi passado é que ela estava esperando que um e-mail chegasse no meu endereço eletrônico(poderia ter sido no dela, mas tudo bem), e me pediu para que se tivesse chegado que eu encaminhasse para ela. Voltando a história de que eu tinha acabado de acordar... Peguei o meu dispositivo, me conectei ao ponto Wifi existente no local em que eu resido e baixei as minhas novas correspondências eletrônicas. Lá estava o bendito e-mail. Redirecionei para ela de uma forma simples e rápida, informei para que visse a caixa postal e desliguei.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Depois deste episódio ainda precisei do aparelho para algumas tarefas que davam para ser feitas pelo computador, mas eu já estava com o dispositivo na mão.&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Fica aí a dica então: Explore o seu smartphone, seja ele SymbianOS, Android, iOS, Windows Phone, Blackberry, Xing-ling(se é que pode-se chamar de smartphone), Meego, ou o Diabo a quatro... Fuce, procure, escave.. Você vai achar muitas funcionalidades que tornarão o seu dia-a-dia mais dinâmico, conectado e automatizado. Valeu!&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;b&gt;&lt;i&gt;&lt;span style=&quot;font-size: x-small;&quot;&gt;Ass.: David de Almeida Bezerra Jr&lt;/span&gt;&lt;/i&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/4887180046789835162/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/04/smartphone-uma-poderosa-ferramenta-em.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4887180046789835162'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4887180046789835162'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/04/smartphone-uma-poderosa-ferramenta-em.html' title='Smartphone - Uma poderosa ferramenta em nosso dia-a-dia!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCeqBBEk-3IuFFm4ZZMBH5lW2PMCnbIgfgxjyiFKfdu_q0MOaHAs-Amxeyx5SHG6_DAoq8JxMF_YGjF75ZZN_-pDTKLX_482rOPaOFhnQ41beFiwFk8ltmUjtvucGNvnv5Xiu-qcHd2eGH/s72-c/nokia-lumia-900.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-4917277753522680488</id><published>2012-03-19T21:04:00.000-07:00</published><updated>2012-03-19T21:04:36.782-07:00</updated><title type='text'>HTML5, será?</title><content type='html'>&lt;br /&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;b&gt;Olá pessoal!&lt;/b&gt;&lt;br /&gt;
&lt;b&gt;&lt;br /&gt;&lt;/b&gt;&lt;br /&gt;
Vim falar da novidade mais comentada na net: a nova versão do HTML (&lt;span style=&quot;background-color: white; color: #222222; font-family: arial, sans-serif; font-size: x-small; line-height: 16px;&quot;&gt;HyperText Markup Language&lt;/span&gt;), o HTML5 que vem causando bastante discussão pela sua real viabilidade e os rumos da internet.&lt;br /&gt;
&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/strong&gt;&lt;br /&gt;
&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;O HTML5&lt;/span&gt;&lt;/strong&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;O HTML5 foi criado pelo WHATWG (Web Hypertext Application Tecnhology Working Group), grupo formado por desenvolvedores de diversas empresas, como Opera, Mozilla e Apple, que estavam descontentes com o rumo que a W3C estava dando ao XHTML. A proposta do HTML5 é ser uma linguagem melhor preparada para construção de aplicações WEB, bem como ser independente de plugins, além de ter novos elementos que dão mais semântica ao conteúdo. Atualmente o WHATWG e o W3C trabalham em conjunto no desenvolvimento do HTML5.&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Embora a versão final do HTML5 esteja previsto para 2012, muitos browsers já estão suportando algumas das principais novidades do HTML5, e a cada dia aparecem exemplos de bom uso dos novos recursos da linguagem na WEB. O Youtube, por exemplo, já possui uma&amp;nbsp;&lt;/span&gt;&lt;a href=&quot;http://www.youtube.com/html5&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; vertical-align: baseline;&quot; target=&quot;_blank&quot; wrc_done=&quot;true&quot;&gt;versão experimental do portal em HTML5&lt;/a&gt;&amp;nbsp;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;. http://www.youtube.com/html5&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;De acordo com a avaliação do&amp;nbsp;&lt;/span&gt;&lt;a href=&quot;http://html5test.com/&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; vertical-align: baseline;&quot; target=&quot;_blank&quot; wrc_done=&quot;true&quot;&gt;HTML5Test&lt;/a&gt;&amp;nbsp;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;, que classifica de 1 a 160 pontos o suporte dos browsers ao HTML5, temos:&lt;span id=&quot;more-1659&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;1-&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Google Chrome 4.1 – 118 pontos&lt;br /&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;2-&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Opera 10.51 – 102 pontos&lt;br /&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;3-&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Firefox 3.6.3 – 101 pontos&lt;br /&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;4-&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Internet Explorer 7/8 – 19 pontos&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Como podemos perceber a Microsoft – em suas atuais versões de browsers – não tem um bom suporte ao HTML5, porém já&amp;nbsp;&lt;a href=&quot;http://translate.googleusercontent.com/translate_c?hl=pt-BR&amp;amp;ie=UTF-8&amp;amp;sl=en&amp;amp;tl=pt&amp;amp;u=http://blogs.msdn.com/ie/archive/2010/03/16/html5-hardware-accelerated-first-ie9-platform-preview-available-for-developers.aspx&amp;amp;prev=_t&amp;amp;rurl=translate.google.com.br&amp;amp;twu=1&amp;amp;usg=ALkJrhj5TNLJKUARaUQJ26LJYuvh1poIyg&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; vertical-align: baseline;&quot; target=&quot;_blank&quot;&gt;anunciou que suportará integralmente o HTML5 em seu novo browser&lt;/a&gt;, o IE 9&amp;nbsp;– com expectativa de lançamento no segundo semestre de 2010.&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Um DOCTYPE de fácil memorização&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;O DOCTYPE possui uma nobre função: orientar o browser como ele deve renderizar o seu conteúdo, porém a memorização da sintaxe dos DOCTYPEs não é tarefa das mais fáceis, principalmente quando lembramos que são três as versões para o HTML 4.01/xHTML (transational, frameset e strict). Geralmente recorremos ao “copy+paste” para inseri-los na página. No HTML5, a declaração é feita em uma linha com 15 caracteres:&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;!DOCTYPE Html&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Gráfico nativo com canvas&lt;/span&gt;&lt;/strong&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Uma das principais novidades do HTML5 é o elemento canvas, que através do javascript permite a criação de animações e jogos bem interessantes e, junto com o SVG, promete substituir tecnologias que exigem instalação de plugins, como o Flash, Silverlight e JavaFx.&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Vamos utilizar como exemplo a criação de um gráfico simples. Veja a sintaxe do canvas:&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;canvas id=”elementoCanvas” width=”900px” height=”200px”&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Seu browser não suporta elemento canvas&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;/canvas&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;script type=”text/javascript”&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;var canvas=document.getElementById(‘elementoCanvas’);&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;var ctx=canvas.getContext(’2d’);&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;// desenha um retângulo 100px X 100px, com cor vermelha, 50% de transparência&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillStyle=’rgba(255,0,0,0.5)’;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillRect (20, 20, 100, 100);&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;// desenha um retângulo 100px X 100px, com cor verde, 50% de transparência&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillStyle=’rgba(0,255,0,0.5)’;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillRect (40, 40, 100, 100);&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;// desenha um retângulo 100px X 100px, com cor blue, 50% de transparência&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillStyle=’rgba(0,0,255,0.5)’;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillRect (60, 60, 100, 100);&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;// Escreve no gráfico&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillStyle = ‘#000′;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;ctx.fillText (‘Gráfico em Canvas, sensacional!’, 15, 15);&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;/script&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Resultado:&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1661&quot; height=&quot;167&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/canvas-html5.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;165&quot; /&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Obs.&lt;/span&gt;&lt;/strong&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;: Além do atributo “id” (utilizado para identificação via DOM), o elemento canvas só permite dois atributos (largura e altura), quando não especificados, temos por padrão: 300x150px.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Edição de textos em tempo real com o contentEditable&lt;/span&gt;&lt;/strong&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;O atributo “contentEditable” foi criado pela Microsoft e incorporado no HTML5. Ele permite deixar “qualquer tag” do documento editável, os valores possíveis são “true” ou “false”.&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;p contenteditable=”true” class=”contentEditable”&amp;gt;Você pode editar este texto, para isto, dê duplo clique sob o texto&amp;lt;/p&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;“Database” client-side&lt;/span&gt;&lt;/strong&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Um dos objetivos do HTML5 é melhorar a experiência do uso de Aplicações Web quando o usuário estiver off-line. Para isto, foi disponibilizada uma API para setar/capturar dados exclusivamente no browser. Uma espécie de “sessão” off-line em que o valor não pode ser capturado pelo servidor.&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;localStorage.setItem(‘chave’,&#39;valor’); // Setar o valor no ‘banco de dados local’&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;localStorage.getItem(‘chave’) // capturar o valor;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;localStorage.clear() // limpar o valor do banco de dados local;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Formulários – Novos campos de formulário&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Muitas necessidades que os desenvolvedores possuíam e só preenchiam através do javascript foram implementadas no HTML5. Em apenas algumas linhas é possível disponibilizar componentes como: slider, autocomplete, campo data, além de validações de diversos campos. Veja algumas destas opções para formulários:&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Telefone&amp;nbsp;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;–&amp;nbsp;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=tel type=tel&amp;gt;&lt;/span&gt;&lt;/em&gt;&amp;nbsp;-&amp;nbsp;Utilizado para entrada de dados de telefones&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1662&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-tel.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;URL&amp;nbsp;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;–&amp;nbsp;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=url type=url&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– Utilizado para entrada de variadas URLs. Por padrão o browser irá inserir o http:// como protocolo padrão&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1664&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-url1.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;E-mail&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;–&amp;nbsp;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=email type=email&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– Caso opte por validação, automaticamente o browser valida se o valor for um e-mail válido&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1665&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-email.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Data e hora&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;–&amp;nbsp;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=horario type=datetime&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– Utilizado para agendamento de eventos, reuniões, etc.&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1666&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-datetime.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Número&lt;/strong&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;–&amp;nbsp;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=numero type=number&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– Com os atributos “min” e “Max” é possível entrar com um intervalo de valores possíveis e com o “step” é possível definir o valor para cada incremento&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1667&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-number.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Tempo&lt;/strong&gt;&lt;/span&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;–&lt;/span&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=tempo type=time&amp;gt;&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1668&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-time.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Semana&lt;/strong&gt;&lt;/span&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;–&amp;nbsp;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=semana type=week&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1669&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-week.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Slider&amp;nbsp;&lt;/strong&gt;&lt;/span&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;–&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input name=slider type=range min=2 max=30 step=2 &amp;gt;&lt;br /&gt;&lt;img alt=&quot;&quot; class=&quot;alignnone size-medium wp-image-1670&quot; height=&quot;42&quot; src=&quot;http://blog.uolhost.com.br/wp-content/uploads/2010/05/input-slider.png&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(204, 204, 204); border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-width: 1px; border-style: initial; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; height: auto; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-width: 650px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; vertical-align: baseline;&quot; width=&quot;225&quot; /&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Atributo autofocus&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Uma boa recomendação para melhorar a acessibilidade e usabilidade de uma página é já deixar o campo principal do cursor selecionado (focus no campo). Normalmente utilizamos a linha de javascript&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;(document.getElementById(‘nome_capo’).focus())&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;para deixar o campo focado.&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input maxlength=”256″ name=”q” value=”&quot; autofocus&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Validações de Formulários&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Não sera mais necessário a utilização de javascript para validação de formulários, no HTML5 existe o atributo “required”, que dentro de um elemento input torna o campo obrigatório e transfere para o browser a tarefa da validação do campo.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;p&amp;gt;&amp;lt;label&amp;gt;Nome: &amp;lt;input name=name required&amp;gt;&amp;lt;/label&amp;gt;&amp;lt;/p&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;p&amp;gt;&amp;lt;label&amp;gt;Tel: &amp;lt;input name=tel type=tel required&amp;gt;&amp;lt;/label&amp;gt;&amp;lt;/p&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;p&amp;gt;&amp;lt;label&amp;gt;E-mail: &amp;lt;input name=email type=email required&amp;gt;&amp;lt;/label&amp;gt;&amp;lt;/p&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;p&amp;gt;&amp;lt;label&amp;gt;URL: &amp;lt;input name=url type=url required&amp;gt;&amp;lt;/label&amp;gt;&amp;lt;/p&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;button&amp;gt;Enviar&amp;lt;/button&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Validação por expressão regular&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Além de deixar o campo apenas como obrigatório, é possível colocar um padrão de entrada para aquele determinado campo, que será validado pelo browser.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Por exemplo, em um campo em que só possa entrar valores numéricos com 3 dígitos:&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input pattern=”[0-9]{3}”&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;name=”digito”&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;required&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;title=”Validação apenas para 3 dígitos”/&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Observe que o atributo pattern aceita expressões regulares.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Validação por range de valores&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;No tipo de campo “numérico”, é possível fazer uma validação dos valores possíveis de entrada utilizando os atributos min e max.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;input type=number min=2 max=10 /&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Autocomplete&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Com HTML5 é simples exibir um input com “autocompletar”, este recurso é bem interessante, pois melhora significativamente a experiência do usuário no preenchimento do formulário – quando bem utilizado.&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;label&amp;gt;Homepage: &amp;lt;input name=hp type=url list=hpurls&amp;gt;&amp;lt;/label&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;datalist id=hpurls&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;option value=”http://www.uol.com.br/” label=”UOL”&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;option value=”http://www.uolhost.com.br/” label=”UOL HOST – Sensacional”&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;option value=”http://www.metadeideal.com.br/” label=”Metade Ideal”&amp;gt;&amp;nbsp;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;/em&gt;&lt;/span&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/em&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;em style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;lt;/datalist&amp;gt;&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span lang=&quot;EN-US&quot; style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Novos elementos&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;O HTML5 inclui novos elementos para melhorar a semântica dos documentos e minimizar o excesso de utilização de DIVS e SPANS (tags sem semântica). Alguns dos novos elementos são:&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Header&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– define o cabeçalho de uma seção&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Article&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– define que o conteúdo é um artigo&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Nav&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– define um menu de navegação&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Footer&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– define um rodapé para a seção&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; font-size: 14px; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Details&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– detalhes sobre alguma informação, caso tenha o atributo “open”, exibe o conteúdo, caso contrário esconde.&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;MsoNormal&quot; style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-family: Shanti, Palatino, Georgia, Times, serif; line-height: 22px; margin-bottom: 22px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;strong style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Figure&lt;/span&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&amp;nbsp;– conjunto de imagens e legendas&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-size: large; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;b&gt;Concluindo...&lt;/b&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; font-size: large; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;b&gt;&lt;br /&gt;&lt;/b&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;
Apesar de todas essas novidades a nova versão do HTML ainda está em desenvolvimento e passa por fases de testes e só deve ser finalizada e recomendada por volta de 2013 ou 2014. Porém ela já vem sendo largamente usada pelos webdesigners e grande parte de seu código reconhecido pelas mais novas versões dos browsers mais usados. Mesmo assim antes de qualquer coisa quem for desenvolver seu site deve ter em mente duas premissas: &lt;b&gt;quem verá o site e o qual o seu conteúdo. &lt;/b&gt;Essas duas premissas são de vital importância pois deve-se levar em consideração na hora da implementação do site qual o público alvo do mesmo, pois a maior dificuldade, agora, será se seus usuários utilizarem browsers mais antigos e conexões mais lentas de internet. Se seu grupo de usuários for dos browsers mais novos e conexões melhores ainda sim deve-se conhecer quais versões dos browsers suportam quais funcionalidades da nova linguagem.&lt;br /&gt;
&lt;br /&gt;
Ainda assim o&amp;nbsp;&lt;span style=&quot;background-color: white; font-size: 14px;&quot;&gt;WHATWG e o W3C incetiva a utilização do HTML5 visando seu desenvolvimento.&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;background-color: white; font-size: 14px;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;background-color: white; font-size: 14px;&quot;&gt;Se você deseja saber quais funções e quais navegadores suportam o HTML5 e CSS3 acesse:&amp;nbsp;&lt;/span&gt;&lt;a href=&quot;http://www.deepbluesky.com/blog/-/browser-support-for-css3-and-html5_72/&quot;&gt;http://www.deepbluesky.com/blog/-/browser-support-for-css3-and-html5_72/&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;background-color: white; font-size: 14px;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;background-color: white; font-size: 14px;&quot;&gt;Bem é isso ai pessoal, espero que tenham gostado e viva a informação livre para todos!&lt;/span&gt;&lt;br /&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;Post original divuldado por Carlos Zamora, em&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;a href=&quot;http://www.uolhost.com.br/blog/1659/novidades-do-html5&quot;&gt;http://www.uolhost.com.br/blog/1659/novidades-do-html5&lt;/a&gt;.&lt;/div&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;font-size: 14px;&quot;&gt;
&lt;span style=&quot;background-color: white;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;span style=&quot;background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: baseline;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/4917277753522680488/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/html5-sera.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4917277753522680488'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4917277753522680488'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/html5-sera.html' title='HTML5, será?'/><author><name>Caio Lucas Santos Silva</name><uri>http://www.blogger.com/profile/16484429577652817154</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='32' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTg6wGIInPNfIFRvFf31IwQcQqi3gu5vZero1La3jgpEb7VutmVlyJO1ZNMupJFaXgL4nELE2ocw9CdaezdZA13O6ZHFEMOBq5G1tdvRyBTad-wYjYSwAPZUvdLbZ8FIs/s220/perfil.png'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-6165191449332393168</id><published>2012-03-16T19:52:00.004-07:00</published><updated>2012-03-16T20:50:52.746-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="atividade"/><category scheme="http://www.blogger.com/atom/ns#" term="diagramas"/><category scheme="http://www.blogger.com/atom/ns#" term="engenharia"/><category scheme="http://www.blogger.com/atom/ns#" term="uml"/><title type='text'>Artigo - Engenharia de Software - Diagrama de Atividades!</title><content type='html'>&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSIjsDKnHpWZMFDs7PmgNXCVgGRGcgdHI6I1jus6XpbGTZFQtGHSN0efPRGtcS68f17albCPAfWT99B7ZYWff_WpsiD5ZT-jb3DAiS-TtFqIYs7323f5HfTgUW3i2phhjcvPvLItx9XWw8/s1600/Diagrama1.png&quot; style=&quot;font-weight: normal; font-size: 100%; font-style: normal; &quot;&gt;&lt;img style=&quot;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 342px;&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSIjsDKnHpWZMFDs7PmgNXCVgGRGcgdHI6I1jus6XpbGTZFQtGHSN0efPRGtcS68f17albCPAfWT99B7ZYWff_WpsiD5ZT-jb3DAiS-TtFqIYs7323f5HfTgUW3i2phhjcvPvLItx9XWw8/s400/Diagrama1.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5720706405120378450&quot; /&gt;&lt;/a&gt;&lt;i style=&quot;font-weight: normal; &quot;&gt;&lt;span &gt;Tendo como objetivo mostrar o fluxo de atividades em um único processo, o diagrama dá ênfase ao nível de algorítimo da UML.&lt;/span&gt;&lt;/i&gt;&lt;div style=&quot;font-weight: normal; font-size: 100%; font-style: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;font-weight: normal; text-align: justify; font-size: 100%; font-style: normal; &quot;&gt;O Diagrama de Atividades preocupa-se em descrever passos a serem percorridos para a conclusão de um algorítimo, fazendo com que seja mais fácil de encontrar erros no projeto antes mesmo da implementação.&lt;/div&gt;&lt;div style=&quot;font-weight: normal; text-align: justify; font-size: 100%; font-style: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;font-weight: normal; text-align: justify; font-size: 100%; font-style: normal; &quot;&gt;Para mais informações, visitem o site DSC: &lt;a href=&quot;http://www.dsc.ufcg.edu.br/~jacques/cursos/map/html/uml/diagramas/atividades/diag_atividades.htm&quot; target=&quot;_blank&quot;&gt;clique aqui!&lt;/a&gt;&lt;/div&gt;&lt;div style=&quot;font-weight: normal; text-align: justify; font-size: 100%; font-style: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify; &quot;&gt;&lt;b&gt;&lt;i&gt;&lt;span &gt;Ass.: David de Almeida Bezerra Jr&lt;/span&gt;&lt;/i&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/6165191449332393168/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-engenharia-de-software-diagrama.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/6165191449332393168'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/6165191449332393168'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-engenharia-de-software-diagrama.html' title='Artigo - Engenharia de Software - Diagrama de Atividades!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSIjsDKnHpWZMFDs7PmgNXCVgGRGcgdHI6I1jus6XpbGTZFQtGHSN0efPRGtcS68f17albCPAfWT99B7ZYWff_WpsiD5ZT-jb3DAiS-TtFqIYs7323f5HfTgUW3i2phhjcvPvLItx9XWw8/s72-c/Diagrama1.png" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-82907083049927461</id><published>2012-03-15T19:01:00.009-07:00</published><updated>2012-03-15T20:18:27.902-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="banco"/><category scheme="http://www.blogger.com/atom/ns#" term="dados"/><category scheme="http://www.blogger.com/atom/ns#" term="db"/><category scheme="http://www.blogger.com/atom/ns#" term="de"/><category scheme="http://www.blogger.com/atom/ns#" term="engenharia"/><category scheme="http://www.blogger.com/atom/ns#" term="entidade"/><category scheme="http://www.blogger.com/atom/ns#" term="er"/><category scheme="http://www.blogger.com/atom/ns#" term="relacional"/><category scheme="http://www.blogger.com/atom/ns#" term="relacionamento"/><category scheme="http://www.blogger.com/atom/ns#" term="relação"/><category scheme="http://www.blogger.com/atom/ns#" term="software"/><title type='text'>Artigo - Banco de Dados: Do Modelo ER ao Modelo Relacional!</title><content type='html'>&lt;div style=&quot;text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8wk7Ests1jv2o4BuPSoZ-pI-JDJyFj5OdMlEDq7pGydTWeLQG_oS-TU10W4Q0UdulNyMFvOWAnoUGDItdB3jEbg1_gb7BFkMNBIMo41OwfXgDBwHswrw5ICScsiGF4BErjxoCagnVpP3l/s1600/ER2.png&quot; style=&quot;text-align: left; &quot;&gt;&lt;img style=&quot;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 277px; height: 320px;&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8wk7Ests1jv2o4BuPSoZ-pI-JDJyFj5OdMlEDq7pGydTWeLQG_oS-TU10W4Q0UdulNyMFvOWAnoUGDItdB3jEbg1_gb7BFkMNBIMo41OwfXgDBwHswrw5ICScsiGF4BErjxoCagnVpP3l/s320/ER2.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5720310517535328146&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;i&gt;&lt;span &gt;Descrevendo modelos de dados de um sistema com alto nível de abstração, o Modelo ER pode ser mapeado em Modelo Relacional.&lt;/span&gt;&lt;/i&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Sendo a visão estática do sistema, o &lt;b&gt;Modelo ER&lt;/b&gt;(Entidade-Relacionamento) tem a sua maior aplicação na visualização do relacionamento entre tabelas de um determinado banco de dados, representando graficamente através de um diagrama.&lt;/div&gt;&lt;div&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWXqQB_j9KKwRiGLzB6k8_XIIYiUsc7kdv_cROY6VAlJDECb1qhRaEuCfwHCV4luzftemnKFNdmf9KIqhohpJeHwWboDiW3MJ2LJNl4fDFObK0eBq3lNdY_UUoGFHmZftu4394WDOAW9L4/s1600/MODELO_ER_EXTENDIDO.jpg&quot;&gt;&lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWXqQB_j9KKwRiGLzB6k8_XIIYiUsc7kdv_cROY6VAlJDECb1qhRaEuCfwHCV4luzftemnKFNdmf9KIqhohpJeHwWboDiW3MJ2LJNl4fDFObK0eBq3lNdY_UUoGFHmZftu4394WDOAW9L4/s400/MODELO_ER_EXTENDIDO.jpg&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5720313206914580930&quot; style=&quot;display: block; margin-top: 0px; margin-right: auto; margin-bottom: 10px; margin-left: auto; text-align: center; cursor: pointer; width: 400px; height: 245px; &quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div style=&quot;text-align: center;&quot;&gt;&lt;span &gt;Modelo ER - Clique na figura para ver com nitidez.&lt;/span&gt;&lt;/div&gt;&lt;div style=&quot;text-align: center;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Já o &lt;b&gt;Modelo Relacional&lt;/b&gt; baseia-se no princípio em que todos os dados estão guardados em relações(tabelas). Foi construído formado por Tuplas(linhas ou registros), Atributos(Colunas) e Relações(Tabelas).&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Vamos considerar o seguinte Diagrama Entidade-Relacionamento para podermos &lt;b&gt;mapear&lt;/b&gt; para o Modelo Lógico(Relacional):&lt;/div&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi34ck9f1f2SzjqE0AaRpVer-9B62yFBYB3RgfO1Gl42KVlbszVuFVQYV6SydsvXrL9mCHW8EH4tFTqEmO1P8MKS0OlJcgl-BY5pvBUUc4t0GSGeItISO4TRpLDceqr7QkdcgOVevmmhOEw/s1600/Diagrama1.png&quot;&gt;&lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi34ck9f1f2SzjqE0AaRpVer-9B62yFBYB3RgfO1Gl42KVlbszVuFVQYV6SydsvXrL9mCHW8EH4tFTqEmO1P8MKS0OlJcgl-BY5pvBUUc4t0GSGeItISO4TRpLDceqr7QkdcgOVevmmhOEw/s400/Diagrama1.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5720321589288152194&quot; style=&quot;display: block; margin-top: 0px; margin-right: auto; margin-bottom: 10px; margin-left: auto; text-align: center; cursor: pointer; width: 400px; height: 346px; &quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Nós temos as entidades: &lt;b&gt;Fornecedor&lt;/b&gt;, com os atributos &lt;i&gt;&lt;b&gt;&lt;span &gt;cod_fornecedor&lt;/span&gt;&lt;/b&gt;&lt;/i&gt; e nome_fantasia; &lt;b&gt;Produto&lt;/b&gt;, com os atributos &lt;b&gt;&lt;i&gt;&lt;span &gt;cod_produto&lt;/span&gt;&lt;/i&gt;&lt;/b&gt; e descricao; &lt;b&gt;Pedido&lt;/b&gt;, com o atributo &lt;i&gt;&lt;b&gt;&lt;span &gt;cod_pedido&lt;/span&gt;&lt;/b&gt;&lt;/i&gt;; Uma entidade associativa chamada &lt;b&gt;Item_pedido&lt;/b&gt;;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;i&gt;&lt;span &gt;Nota: Os itens em vermelho representam chaves primárias, campos únicos que servem para identificar o registro.&lt;/span&gt;&lt;/i&gt;&lt;/div&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Percebemos um relacionamento de cardinalidade 1 para n entre Fornecedor e Produto, e Fornecedor e Pedido, enquanto há um outro entre Pedido e Produto de cardinalidade n para n.&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Trazendo ao Modelo Relacional, podemos traduzir o exemplo acima neste diagrama:&lt;/div&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9Rg8vVAVR8wrcqsL7wRFnbdnw2VaruyWDsAhUHUKMgI0WUbweAJ2gej7B9PvrH1r6EePzJf5P6LzWhM5pw9gWxNXY0CW0lE1wRmXbzsuCgMLw2jucNz7XKPVYdacIXNtQLyO_muge4zmW/s1600/Diagrama2.png&quot;&gt;&lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9Rg8vVAVR8wrcqsL7wRFnbdnw2VaruyWDsAhUHUKMgI0WUbweAJ2gej7B9PvrH1r6EePzJf5P6LzWhM5pw9gWxNXY0CW0lE1wRmXbzsuCgMLw2jucNz7XKPVYdacIXNtQLyO_muge4zmW/s400/Diagrama2.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5720324600901901138&quot; style=&quot;display: block; margin-top: 0px; margin-right: auto; margin-bottom: 10px; margin-left: auto; text-align: center; cursor: pointer; width: 400px; height: 270px; &quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Percebemos que não muda-se muita coisa, praticamente a entidade associativa(Item_Pedido) deu lugar a uma tabela, concentrando dois relacionamentos de 1 para n.&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;É mais perceptível as mudanças de um para o outro quando fala-se em Normalização, mas isso já torna-se um assunto para um novo post!&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;É isso ai galera! Valeu!&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;span &gt;Ass.: David de Almeida Bezerra Jr&lt;/span&gt;&lt;/i&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/82907083049927461/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-banco-de-dados-do-modelo-er-ao.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/82907083049927461'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/82907083049927461'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-banco-de-dados-do-modelo-er-ao.html' title='Artigo - Banco de Dados: Do Modelo ER ao Modelo Relacional!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8wk7Ests1jv2o4BuPSoZ-pI-JDJyFj5OdMlEDq7pGydTWeLQG_oS-TU10W4Q0UdulNyMFvOWAnoUGDItdB3jEbg1_gb7BFkMNBIMo41OwfXgDBwHswrw5ICScsiGF4BErjxoCagnVpP3l/s72-c/ER2.png" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-7252945122713276580</id><published>2012-03-14T12:57:00.003-07:00</published><updated>2012-03-14T13:10:08.720-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="android"/><category scheme="http://www.blogger.com/atom/ns#" term="cream"/><category scheme="http://www.blogger.com/atom/ns#" term="galaxy"/><category scheme="http://www.blogger.com/atom/ns#" term="ice"/><category scheme="http://www.blogger.com/atom/ns#" term="noticias"/><category scheme="http://www.blogger.com/atom/ns#" term="samsung"/><category scheme="http://www.blogger.com/atom/ns#" term="smartphone"/><title type='text'>Notícia - Galaxy S II recebe atualização para Android 4.0!</title><content type='html'>&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhb0GjNCzk3rQ9XsMhkVrxXDmEzZm9pn5eI9Na3QPAMQOLilnnMLokS9M6mvyRLsAxBpYyx3VmJGxJ4ImRZxvmRhVLDaZPL8STj3MSDFbjyHBqi93vEZh9F4Df7Fd2L2Rda_LQkuRQIg3b/s1600/Samsung-Galaxy-S-II110213175637.jpg&quot; style=&quot;font-size: 100%; font-style: normal; font-weight: normal; &quot;&gt;&lt;img style=&quot;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 308px; height: 320px;&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhb0GjNCzk3rQ9XsMhkVrxXDmEzZm9pn5eI9Na3QPAMQOLilnnMLokS9M6mvyRLsAxBpYyx3VmJGxJ4ImRZxvmRhVLDaZPL8STj3MSDFbjyHBqi93vEZh9F4Df7Fd2L2Rda_LQkuRQIg3b/s320/Samsung-Galaxy-S-II110213175637.jpg&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5719845676574522274&quot; /&gt;&lt;/a&gt;&lt;i&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;i&gt;&lt;span &gt;O update chegou ontem à sul-coreanos e europeus, e em breve chegará ao brasileiro.&lt;/span&gt;&lt;/i&gt;&lt;/div&gt;&lt;/i&gt;&lt;div style=&quot;text-align: justify;font-size: 100%; font-style: normal; font-weight: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-size: 100%; font-style: normal; font-weight: normal; &quot;&gt;Como divulgado no site &lt;a href=&quot;http://pcworld.uol.com.br/noticias/2012/03/13/galaxy-sii-comeca-a-receber-atualizacao-para-o-android-4-0-ice-cream-sandwich/&quot; target=&quot;_blank&quot;&gt;PC World&lt;/a&gt;, os usuários do smartphone da Samsung já podem começar a comemorar, pois apesar de não houver prazo estipulado para a atualização em outros países, já sabe-se que está mais perto do que longe para o S.O. chegar aos aparelhos do Brasil.&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-size: 100%; font-style: normal; font-weight: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-size: 100%; font-style: normal; font-weight: normal; &quot;&gt;Leia o post completo em &lt;a href=&quot;http://pcworld.uol.com.br/noticias/2012/03/13/galaxy-sii-comeca-a-receber-atualizacao-para-o-android-4-0-ice-cream-sandwich/&quot; target=&quot;_blank&quot;&gt;PC World UOL&lt;/a&gt;.&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-size: 100%; font-style: normal; font-weight: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;span &gt;Ass.: David de Almeida Bezerra Jr&lt;/span&gt;&lt;/i&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/7252945122713276580/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/noticia-galaxy-s-ii-recebe-atualizacao.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/7252945122713276580'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/7252945122713276580'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/noticia-galaxy-s-ii-recebe-atualizacao.html' title='Notícia - Galaxy S II recebe atualização para Android 4.0!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhb0GjNCzk3rQ9XsMhkVrxXDmEzZm9pn5eI9Na3QPAMQOLilnnMLokS9M6mvyRLsAxBpYyx3VmJGxJ4ImRZxvmRhVLDaZPL8STj3MSDFbjyHBqi93vEZh9F4Df7Fd2L2Rda_LQkuRQIg3b/s72-c/Samsung-Galaxy-S-II110213175637.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-9110049613605414838</id><published>2012-03-14T10:45:00.001-07:00</published><updated>2012-03-14T10:45:57.187-07:00</updated><title type='text'>Artigo - Abduzeedo, um guia de inspiração para designers!</title><content type='html'>&lt;br /&gt;
&lt;table align=&quot;center&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; class=&quot;tr-caption-container&quot; style=&quot;margin-left: auto; margin-right: auto; text-align: center;&quot;&gt;&lt;tbody&gt;
&lt;tr&gt;&lt;td style=&quot;text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimnBRLevEXhlNQIYICy9_z4RxraQaIiOUZxIbjLNCaIiIWoqL4xLhjxInUbZ4gRx8EDj9pcKnkF7iONJsMCruEIcFIvgcRamGUVhnBc950SMop7lAFOmP8WxLkrtJDEbYboRQtLC9r9sXP/s1600/abduzeedo.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: auto; margin-right: auto;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimnBRLevEXhlNQIYICy9_z4RxraQaIiOUZxIbjLNCaIiIWoqL4xLhjxInUbZ4gRx8EDj9pcKnkF7iONJsMCruEIcFIvgcRamGUVhnBc950SMop7lAFOmP8WxLkrtJDEbYboRQtLC9r9sXP/s200/abduzeedo.png&quot; width=&quot;193&quot; /&gt;&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;tr-caption&quot; style=&quot;text-align: center;&quot;&gt;Logo Abduzeedo.com&lt;/td&gt;&lt;td class=&quot;tr-caption&quot; style=&quot;text-align: center;&quot;&gt;&lt;br /&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/tbody&gt;&lt;/table&gt;
Olá galera, venho inaugurar meu primeiro post aqui no diário falando de um outro site/blog :) o&amp;nbsp; &lt;a href=&quot;http://www.abduzeedo.com/&quot;&gt;www.abduzeedo.com.&lt;/a&gt; Ele é um blog voltado para a área de Design, abordnado suas mais variadas formas, seja impresso, para web, ou publicitário, além de conter incríveis tutoriais para ajudar na inspiração dos profissionais desta área.&lt;br /&gt;
&lt;br /&gt;
O site é estruturado da seguinte forma:&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;- Tutoriais:&lt;/b&gt; aqui você encontra diversos tutoriais de técnicas em programas como illustrator e photoshop além de dicas rápidas e estudos de caso.&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;- Inspiração:&lt;/b&gt; aqui ficam as matérias de inspiração subdivididas nas categorias: arquitetura, ilustração, logos, fotografia, tipografia; e também as sérias inspiração diária e sites da semana.&lt;br /&gt;
&lt;b&gt;&lt;br /&gt;&lt;/b&gt;&lt;br /&gt;
&lt;b&gt;- Wallpapers:&lt;/b&gt; com os mais diversos papéis de parede para você personalizar o seu computador.&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;- Entrevistas:&lt;/b&gt; aqui vários profissionais, e mestres no Design trazem todas as dicas e os truques em design.&lt;br /&gt;
&lt;br /&gt;
Fundado em dezembro de 2006 pelo brasileiro Fabio Sasso, o Abduzeedo 
começou como um lugar onde ele compartilhava seus experimentos e 
inspirações encontradas para seus trabalhos, suas abduções diárias, que 
acabou se tornando o tema do blog.&lt;br /&gt;
&lt;br /&gt;

O que começou como uma maneira de fazer backup após o roubo do 
escritório da Zee, acabou se tornando um dos mais visitados blogs para 
quem busca inspiração e tutoriais. O Abduzeedo recebe centenas de 
milhares de visitantes diariamente, entre designers e entusiastas, 
chegando a mais de dois milhões a cada mês. Hoje o Abduzeedo conta com 
contribuidores do Brasil, EUA, Europa e leitores por todos os cantos do 
globo.&lt;br /&gt;
&lt;br /&gt;
&lt;table align=&quot;center&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; class=&quot;tr-caption-container&quot; style=&quot;margin-left: auto; margin-right: auto; text-align: center;&quot;&gt;&lt;tbody&gt;
&lt;tr&gt;&lt;td style=&quot;text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1ov6bRspThv2suCY3xOO-IjTDZpJeMxnjR5ORyKkQ7svBaaqJ9r2nepxm0R2fDhxX68jd8U5dBD_8za839GU8ZMO5RIpB6vKIcVzcT00d1jIzs9kMcjSNBs2FCl3XoNUl1qx5JotL8LcI/s1600/abduzeedo2.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: auto; margin-right: auto;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;119&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1ov6bRspThv2suCY3xOO-IjTDZpJeMxnjR5ORyKkQ7svBaaqJ9r2nepxm0R2fDhxX68jd8U5dBD_8za839GU8ZMO5RIpB6vKIcVzcT00d1jIzs9kMcjSNBs2FCl3XoNUl1qx5JotL8LcI/s200/abduzeedo2.png&quot; width=&quot;200&quot; /&gt;&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;tr-caption&quot; style=&quot;text-align: center;&quot;&gt;Antiga Logo do site&lt;/td&gt;&lt;td class=&quot;tr-caption&quot; style=&quot;text-align: center;&quot;&gt;&lt;br /&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/tbody&gt;&lt;/table&gt;
&lt;i&gt;&amp;nbsp;&quot;O nome do blog vem de uma brincadeira com palavras. Zee é o nome da 
minha empresa de design, então começamos a criar nomes com palavras que 
tinha o som ZEE em alguma sílaba, assim surgiu Abduzeedo (Abduzido).&quot;&lt;/i&gt; Afirma Fábio Sasso.&lt;br /&gt;
&lt;br /&gt;
Colaboradores do blog:&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;Fábio Sasso, Fabiano Maneghetti, Paulo Antunes, Alexix Papageorgiu, PaulOV2, Gisele Muller, Amanda Macedo, Marcelo Seferim.&lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
Ideal para quem busca inspiração e mesmo para quem não é da área mas precisa de uma mãosinha para seus trabalhos. Vale a pena conferir!&amp;nbsp;&lt;b&gt; &lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/9110049613605414838/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-abduzeedo-um-guia-de-inspiracao.html#comment-form' title='1 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/9110049613605414838'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/9110049613605414838'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-abduzeedo-um-guia-de-inspiracao.html' title='Artigo - Abduzeedo, um guia de inspiração para designers!'/><author><name>Caio Lucas Santos Silva</name><uri>http://www.blogger.com/profile/16484429577652817154</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='32' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTg6wGIInPNfIFRvFf31IwQcQqi3gu5vZero1La3jgpEb7VutmVlyJO1ZNMupJFaXgL4nELE2ocw9CdaezdZA13O6ZHFEMOBq5G1tdvRyBTad-wYjYSwAPZUvdLbZ8FIs/s220/perfil.png'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimnBRLevEXhlNQIYICy9_z4RxraQaIiOUZxIbjLNCaIiIWoqL4xLhjxInUbZ4gRx8EDj9pcKnkF7iONJsMCruEIcFIvgcRamGUVhnBc950SMop7lAFOmP8WxLkrtJDEbYboRQtLC9r9sXP/s72-c/abduzeedo.png" height="72" width="72"/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-2905378672694021147</id><published>2012-03-13T13:19:00.007-07:00</published><updated>2012-03-13T13:56:37.589-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="casos"/><category scheme="http://www.blogger.com/atom/ns#" term="de"/><category scheme="http://www.blogger.com/atom/ns#" term="documentacao"/><category scheme="http://www.blogger.com/atom/ns#" term="engenharia"/><category scheme="http://www.blogger.com/atom/ns#" term="requisitos"/><category scheme="http://www.blogger.com/atom/ns#" term="softwares"/><category scheme="http://www.blogger.com/atom/ns#" term="uml"/><category scheme="http://www.blogger.com/atom/ns#" term="uso"/><title type='text'>Artigo - Documentando Casos de Uso!</title><content type='html'>&lt;div style=&quot;text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV1JQ2RMtNxgY1IdVYzCWnYvvJxJuTgEwdK_2E4VU84IGka5uoQoG2pbNcWnDxI2WR36IYcH_tLxdbfpTUynRnrMKz7qUqeDNsyCtcvy0M9JAwRJrzOOw0NY2ql7Dxpo3E52gieAEptSwz/s1600/caso_de_uso.png&quot; style=&quot;text-align: left; font-family: Georgia, serif; font-size: 100%; &quot;&gt;&lt;img style=&quot;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 316px; height: 148px;&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV1JQ2RMtNxgY1IdVYzCWnYvvJxJuTgEwdK_2E4VU84IGka5uoQoG2pbNcWnDxI2WR36IYcH_tLxdbfpTUynRnrMKz7qUqeDNsyCtcvy0M9JAwRJrzOOw0NY2ql7Dxpo3E52gieAEptSwz/s320/caso_de_uso.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5719480339314400242&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;span&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;i&gt;&lt;span&gt;Trabalhosos, mas bem útieis, casos de uso podem ser a solução ou prevenção de alguns problemas.&lt;/span&gt;&lt;/i&gt;&lt;/div&gt;&lt;/span&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; font-weight: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; font-weight: normal; &quot;&gt;Para aqueles que estão ou irão estudar este senhorzinho na faculdade, eu vos apresento a maneira mais normal de se documentar um caso de uso. O modelo utilizado será o da imagem acima.&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; font-weight: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;b&gt;1 - Dar-se &quot;nomes aos bois&quot;:&lt;/b&gt; &lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;Para um caso de uso precisa-se definir uma identidade, normalmente denomina-se UCn, onde &quot;n&quot; é o número do caso de uso. Exemplo: &lt;b&gt;UC 1 - Imprimir Relatório;&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;b&gt;&lt;br /&gt;&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;O nome é acompanhado da identificação (UC 1) + o nome que encontra-se na &quot;bolota&quot; do diagrama(Imprimir Relatório).&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;b&gt;2 - Algumas informações essenciais para o desenvolvimento:&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;table border=&quot;1&quot; width=&quot;100%&quot; style=&quot;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Objetivo&lt;/b&gt;&lt;/td&gt;&lt;td&gt;Imprimir o relatorio mensal filtrado por data.&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Requisitos&lt;/b&gt;&lt;/td&gt;&lt;td&gt;-(Aqui vai uma referência de um Requisito Funcional, caso tivesse, RF1, caso não, um ifem(-))&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Atores&lt;/b&gt;&lt;/td&gt;&lt;td&gt;Usuário&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Prioridade&lt;/b&gt;&lt;/td&gt;&lt;td&gt;(Alta, Baixa ou Média)&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Pré-condições&lt;/b&gt;&lt;/td&gt;&lt;td&gt;Haver vendas e compras lançadas.&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Frequência de uso&lt;/b&gt;&lt;/td&gt;&lt;td&gt;(Alta, Baixa ou Média)&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;b&gt;Pós-condições&lt;/b&gt;&lt;/td&gt;&lt;td&gt;Imprimir ou salvar em arquivo.&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;br /&gt;&lt;div style=&quot;font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal; &quot;&gt;&lt;br /&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b style=&quot;font-size: 100%; &quot;&gt;3 - Campos:&lt;/b&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;ul&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;Data Inicial;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;Data Final;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;Gerar Relatório;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;Botão Sair;&lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;&lt;span&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;4 - Fluxo Principal:&lt;/b&gt;&lt;/div&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;ol&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;O Sistema apresenta a tela de impressão com todos os campos e botões habilitados;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;O Ator preenche o formulário apresentado;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;O Ator seleciona o botão Gerar Relatório;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;O Sistema valida as datas;&lt;/span&gt;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;O Sistema emite o relatório com o filtro oferecido(Data Inicial &amp;lt;-&amp;gt; Data Final);&lt;/span&gt;&lt;/li&gt;&lt;/ol&gt;&lt;span&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;5 - Regras de Negócio:&lt;/b&gt;&lt;/div&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;ul&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span&gt;RN1 - O relatório só será gerado se houver dados no período selecionado;&lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;&lt;span&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;6 - Validação:&lt;/b&gt;&lt;/div&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;ul&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;span style=&quot;font-family: Georgia, serif; &quot;&gt;Os campos Data Inicial e Data Final deverão ser preenchidos no formato &quot;dd/mm/YYYY&quot;, onde &quot;dd&quot; é o dia de uma data com dois dígitos, o &quot;mm&quot; é o mês de uma data com dois dígitos, e &quot;YYYY&quot; é o ano de uma data com quatro dígitos;&lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;&lt;span&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;7 - Protótipo das Telas:&lt;/b&gt;&lt;/div&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhHFRn0gCmU0Kh253jTZh0umfNUCtwmjmVPzadaryKIrTRditW9t7UNBUpcyUGJ1SdEh8mC09pzhuawYnyotrZz1VsyF7N7igqJhDq9i0tcvNo28_-v_CTiXObC5BHBaWvvhNqCZeC2Syd/s1600/imprimir_rel.png&quot;&gt;&lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhHFRn0gCmU0Kh253jTZh0umfNUCtwmjmVPzadaryKIrTRditW9t7UNBUpcyUGJ1SdEh8mC09pzhuawYnyotrZz1VsyF7N7igqJhDq9i0tcvNo28_-v_CTiXObC5BHBaWvvhNqCZeC2Syd/s320/imprimir_rel.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5719487560241819522&quot; style=&quot;display: block; margin-top: 0px; margin-right: auto; margin-bottom: 10px; margin-left: auto; text-align: center; cursor: pointer; width: 290px; height: 153px; &quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;É isso ai pessoal! Quem tiver dúvidas, visitem o blog do Porfº Marcos Morais de Sousa: &lt;a href=&quot;http://www.marcosmoraisdesousa.blogspot.com&quot; target=&quot;_blank&quot;&gt;www.marcosmoraisdesousa.blogspot.com&lt;/a&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;b&gt;&lt;i&gt;&lt;span&gt;Ass.: David de Almeida Bezerra Jr&lt;/span&gt;&lt;/i&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/2905378672694021147/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-documentando-casos-de-uso.html#comment-form' title='1 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/2905378672694021147'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/2905378672694021147'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-documentando-casos-de-uso.html' title='Artigo - Documentando Casos de Uso!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV1JQ2RMtNxgY1IdVYzCWnYvvJxJuTgEwdK_2E4VU84IGka5uoQoG2pbNcWnDxI2WR36IYcH_tLxdbfpTUynRnrMKz7qUqeDNsyCtcvy0M9JAwRJrzOOw0NY2ql7Dxpo3E52gieAEptSwz/s72-c/caso_de_uso.png" height="72" width="72"/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-3328448332534498582.post-4557715451028803475</id><published>2012-03-12T09:59:00.010-07:00</published><updated>2012-03-12T11:59:21.721-07:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="artigos"/><category scheme="http://www.blogger.com/atom/ns#" term="debian"/><category scheme="http://www.blogger.com/atom/ns#" term="estavel"/><category scheme="http://www.blogger.com/atom/ns#" term="gnome"/><category scheme="http://www.blogger.com/atom/ns#" term="linux"/><category scheme="http://www.blogger.com/atom/ns#" term="so"/><category scheme="http://www.blogger.com/atom/ns#" term="testing"/><title type='text'>Artigo - Testei o GNOME 3! Confira!</title><content type='html'>&lt;div style=&quot;text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTtiKMKyALFFYbXGBHhHVndPEAPGReP7lbAyRwYE69CJvjtwuLaabsCh_KO2ndjHy9jPUiTya_4Gj8LjHxUKa__hT_zKTL45dQERC0CPG6At8y9bRLkQ5GhjCyV-GLDplDu2JRiQiNZJRA/s1600/Gnome_3_Logo.jpg&quot; style=&quot;text-align: left; &quot;&gt;&lt;img style=&quot;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 300px; height: 169px;&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTtiKMKyALFFYbXGBHhHVndPEAPGReP7lbAyRwYE69CJvjtwuLaabsCh_KO2ndjHy9jPUiTya_4Gj8LjHxUKa__hT_zKTL45dQERC0CPG6At8y9bRLkQ5GhjCyV-GLDplDu2JRiQiNZJRA/s320/Gnome_3_Logo.jpg&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5719058343139627746&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;i&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;i&gt;&lt;span &gt;Muito usado e aderido por várias distribuições Linux como interface principal, o GNOME 3 exibe-se em sua versão 3.&lt;/span&gt;&lt;/i&gt;&lt;/div&gt;&lt;/i&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Nesta sexta-feira(dia 9) resolvi instalar o Debian testing, codinome &quot;Wheezy&quot;, em minha máquina, e para minha surpresa, a equipe de desenvolvimento atualizou o GNOME para a versão 3, o que já era esperado, mas para mim a interface iria passar um bom tempo na distro unstable.&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&quot;Nota: A equipe do Debian GNU/Linux mantem 3 tipos de distribuições: &lt;/div&gt;&lt;div&gt;&lt;ul&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;Stable: A que está estável e segura, aprovado pelo controle de qualidade da equipe Debian;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;Testing: A candidata a nova versão, onde ficam os pacotes que possivelmente não dispõem de erros;&lt;/li&gt;&lt;li style=&quot;text-align: justify;&quot;&gt;Unstable: Distro instável e insegura, onde os desenvolvedores colocam os pacotes de software para serem testados e, possivelmente, ir parar na &quot;testing&quot;;&quot;&lt;/li&gt;&lt;/ul&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;A equipe do S.O. está de parabéns, pois a testing está parecendo uma versão estável de tão confiável que pode-se sentir.&lt;/div&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;De cara, nos deparamos com o GNOME 3 que, no site do desenvolvedor, promete muita coisa, como integração com conversas, melhor gerência de tempo no calendário do Evolution, etc...&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Confesso que me impressionei com a nova cara e funcionalidades da interface, mas foi perdendo o brilho com o passar do dia, pois o que se promete nem sempre é cumprido. Segue abaixo alguns pontos que achei importantes:&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;1.Área de trabalho&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Um ponto muito bem trabalhado nesta versão, pois com um novo desktop muito agradável conseguimos sentir uma sensação de leveza e limpeza. Apostando em cores escuras, o software mostra-se em um novo visual totalmente diferente, quebrando muitos paradigmas. O que tornou-se chato é que obrigatoriamente a interface usa a aceleração da placa gráfica, o que fica insuportável para quem gosta de simplismo e economia dos recursos do computador.&lt;/div&gt;&lt;div&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-yihCZRgB5sYOG9d7Ha9Y9N0K60cQV6a6zWXmMzASH4gZP10bvuK8C_TKwC1H6GY33MD_drx8A946ha4F6NS8nDkn6E9U-l_Ng6JCokg21odS7badl03DoEGTV-lZThRu_dDpzfLMohvk/s1600/wheezy_gnome3.png&quot;&gt;&lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-yihCZRgB5sYOG9d7Ha9Y9N0K60cQV6a6zWXmMzASH4gZP10bvuK8C_TKwC1H6GY33MD_drx8A946ha4F6NS8nDkn6E9U-l_Ng6JCokg21odS7badl03DoEGTV-lZThRu_dDpzfLMohvk/s320/wheezy_gnome3.png&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5719080004321888658&quot; style=&quot;text-align: justify;display: block; margin-top: 0px; margin-right: auto; margin-bottom: 10px; margin-left: auto; cursor: pointer; width: 320px; height: 180px; &quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;2.Menu Atividades&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Essa foi uma das grandes novidades em funcionalidades. Esta ferramenta prometia maior agilidade ao consultar um programa ou arquivo. Realmente nisso ela cumpriu com o que prometeu, porém pecou em organização, pois acaba sendo um pouco custoso selecionar um item num menu em grade com ícones grandes. Parece mais com menu de dispositivo móvel, mas creio eu que os S.O.s irão evoluir para este lado, tornando padrão um sistema que serve para PC e móvel ao mesmo tempo, como é o caso do Windows 8.&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;3.Desligar o sistema&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Uma coisa que me deixou &quot;P&quot; da vida foi que, quando procuramos a opção de desligar o computador, simplesmente não achamos, e temos que recorrer à internet(hoje em dia &quot;pai dos burros&quot;) para aprender como é que desliga esse &quot;trem&quot;. Observe que trabalhão: &quot;...clique no nome do usuário, no canto superior direito; Pressione a tecla Alt, o comando Suspender será substituído pelo comando Desligar&quot; - &lt;a href=&quot;http://www.techtudo.com.br/dicas-e-tutoriais/noticia/2011/11/mostrar-botao-de-desligar-no-gnome-3.html&quot; target=&quot;_blank&quot;&gt;via TechMundo, por Claudia Bozza&lt;/a&gt;.&lt;/div&gt;&lt;div&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU47faQrfgx01iFUu8FhqLy6ZMwHAvjV4az0fOYEeoXX4_VcTS_CYZMcK8Z8XcbWi5B1sLbjDESlGpmDpkYljbopgwunywHi6GI8nAZ7ZwE7MhbXlViyzY-oFpOgBwxOFA40TbMPSr9tvC/s1600/gnome3.jpg&quot;&gt;&lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU47faQrfgx01iFUu8FhqLy6ZMwHAvjV4az0fOYEeoXX4_VcTS_CYZMcK8Z8XcbWi5B1sLbjDESlGpmDpkYljbopgwunywHi6GI8nAZ7ZwE7MhbXlViyzY-oFpOgBwxOFA40TbMPSr9tvC/s320/gnome3.jpg&quot; border=&quot;0&quot; alt=&quot;&quot; id=&quot;BLOGGER_PHOTO_ID_5719077427675201394&quot; style=&quot;text-align: justify;display: block; margin-top: 0px; margin-right: auto; margin-bottom: 10px; margin-left: auto; cursor: pointer; width: 320px; height: 136px; &quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;4.Mensagens integradas ao sistema.&lt;/b&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Esta funcionalidade é muito legal, porém o Empathy, programa que cuida das contas de chat(MSN, Yahoo, GTalk, Facebook Chat) e é usado para integrar as mensagens, simplesmente não funciona direito, e parece que nunca vai funcionar. Na minha conta do MSN, as pessoas conseguiam conversar comigo, porém a lista de contatos ficava em branco, como se não tivesse ninguém online.&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div style=&quot;text-align: justify;&quot;&gt;Depois desta experiência resolvi voltar para o Debian stable, codinome &quot;Squeeze&quot;, só que dessa vez não voltei ao GNOME 2.30, resolvi instalar o XFCE 4.6, pois já que o GNOME toma rumos desagradáveis ao meu ver, eu prefiro me preparar para o futuro, e nada melhor do que uma interface que está crescendo cada vez mais como a do Xratinho(&lt;a href=&quot;http://www.xfce.org/&quot; target=&quot;_blank&quot;&gt;www.xfce.org&lt;/a&gt;).&lt;/div&gt;&lt;br /&gt;&lt;div&gt;&lt;br /&gt;&lt;b&gt;&lt;span &gt;&lt;i&gt;Ass.: David de Almeida Bezerra Jr&lt;/i&gt;&lt;/span&gt;&lt;/b&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://diariodainformatica.blogspot.com/feeds/4557715451028803475/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-testei-o-gnome-3-confira.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4557715451028803475'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/3328448332534498582/posts/default/4557715451028803475'/><link rel='alternate' type='text/html' href='http://diariodainformatica.blogspot.com/2012/03/artigo-testei-o-gnome-3-confira.html' title='Artigo - Testei o GNOME 3! Confira!'/><author><name>Anonymous</name><uri>http://www.blogger.com/profile/02003552773037486894</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='https://img1.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTtiKMKyALFFYbXGBHhHVndPEAPGReP7lbAyRwYE69CJvjtwuLaabsCh_KO2ndjHy9jPUiTya_4Gj8LjHxUKa__hT_zKTL45dQERC0CPG6At8y9bRLkQ5GhjCyV-GLDplDu2JRiQiNZJRA/s72-c/Gnome_3_Logo.jpg" height="72" width="72"/><thr:total>0</thr:total></entry></feed>