summaryrefslogtreecommitdiffhomepage
path: root/pt-br/html-pt.html.markdown
diff options
context:
space:
mode:
authorLucas Pugliesi <ferreiraplucas@gmail.com>2018-10-11 15:46:00 -0300
committerLucas Pugliesi <ferreiraplucas@gmail.com>2018-10-11 15:46:00 -0300
commitfb58e953434956811b37ebde53be2f148aaa3a5f (patch)
tree1fe0d7eee74d743bc4a3ac91ab57bbf94a5726ba /pt-br/html-pt.html.markdown
parent7f782df3376f9d9add847e9f1398606dfce8a0c0 (diff)
[html/pt-br] Add Portuguese language for html
Diffstat (limited to 'pt-br/html-pt.html.markdown')
-rw-r--r--pt-br/html-pt.html.markdown125
1 files changed, 125 insertions, 0 deletions
diff --git a/pt-br/html-pt.html.markdown b/pt-br/html-pt.html.markdown
new file mode 100644
index 00000000..5a4bc3bc
--- /dev/null
+++ b/pt-br/html-pt.html.markdown
@@ -0,0 +1,125 @@
+---
+language: html
+filename: learnhtml.txt
+contributors:
+ - ["Christophe THOMAS", "https://github.com/WinChris"]
+translators:
+ - ["Robert Steed", "https://github.com/robochat"]
+lang: pt-br
+---
+
+HTML é um acrônimo de HyperText Markup Language(Linguagem de Marcação de HiperTexto).
+É uma linguagem que nos permite escrever páginas para a "world wide web".
+É uma linguagem de marcação, nos permite escrever páginas na web usando código
+para indicar como o texto e os dados serão ser exibidos.
+De fato, arquivos HTML são simples arquivos de texto.
+O que seria marcação? É um método de organização dos dados da página envolvidos
+por abertura e fechamento de tags.
+Essa marcação serve para dar significado ao texto que envolve.
+Assim como outras linguagens, o HTML tem diversas versões. Aqui falaremos sobre o HTML5.
+
+**NOTA :** Você pode testar diferentes tags e elementos conforme progride os
+tutoriais em sites como [codepen](http://codepen.io/pen/) podendo ver seus efeitos,
+entendendo como funcionam e se familiarizando com a linguagem.
+Esse artigo tem seu foco principal na sintaxe do HTML e algumas dicas úteis.
+
+
+```html
+<!-- Comentários são envolvidos conforme essa linha! -->
+
+<!-- #################### As Tags #################### -->
+
+<!-- Aqui está um exemplo de arquivo HTML que iremos analisar. -->
+
+<!doctype html>
+ <html>
+ <head>
+ <title>Meu Site</title>
+ </head>
+ <body>
+ <h1>Olá, mundo!</h1>
+ <a href = "http://codepen.io/anon/pen/xwjLbZ">Venha ver como isso aparece</a>
+ <p>Esse é um parágrafo.</p>
+ <p>Esse é um outro parágrafo.</p>
+ <ul>
+ <li>Esse é um item de uma lista não enumerada (bullet list)</li>
+ <li>Esse é um outro item</li>
+ <li>E esse é o último item da lista</li>
+ </ul>
+ </body>
+ </html>
+
+<!-- Um arquivo HTML sempre inicia indicando ao navegador que é uma página HTML. -->
+<!doctype html>
+
+<!-- Após isso, inicia abrindo a tag <html>. -->
+<html>
+
+<!-- Essa tag deverá ser fechada ao final do arquivo com </html>. -->
+</html>
+
+<!-- Não deverá haver nada após o fechamento desta tag. -->
+
+<!-- Entre a abertura e o fechamento das tags <html></html>, nós encontramos: -->
+
+<!-- Um cabeçalho definido por <head> (deverá ser fechado com </head>). -->
+<!-- O cabeçalho contém uma descrição e algumas informações adicionais que não serão exibidas; chamam-se metadados. -->
+
+<head>
+ <title>Meu Site</title><!-- Essa tag <title> indica ao navegador o título a ser exibido na barra de títulos e no nome da aba. -->
+</head>
+
+<!-- Após a seção <head>, nós encontramos a tag - <body> -->
+<!-- Até esse ponto, nada descrito irá aparecer na janela do browser. -->
+<!-- Nós deveremos preencher o body(corpo) com o conteúdo a ser exibido. -->
+
+<body>
+ <h1>Olá, mundo!</h1> <!-- A tag h1 cria um título. -->
+ <!-- Há também subtítulos do <h1>, o mais importante, aos mais precisos (h6). -->
+ <a href = "http://codepen.io/anon/pen/xwjLbZ">Venha ver o que isso exibe</a> <!-- Um hiperlink ao endereço preenchido no atributo href="" -->
+ <p>Esse é um parágrafo.</p> <!-- A tag <p> permite incluir um texto na página. -->
+ <p>Esse é um outro parágrafo.</p>
+ <ul> <!-- A tag <ul> cria uma lista de marcação. -->
+ <!-- Para criar uma lista ordenada, devemos usar <ol>, exibindo 1. para o primeiro elemento, 2. para o segundo, etc. -->
+ <li>Esse é um item de uma lista não-enumerada.</li>
+ <li>Esse é um outro item</li>
+ <li>E esse é o último item da lista</li>
+ </ul>
+</body>
+
+<!-- E é isso, criar um arquivo HTML pode ser bem simples. -->
+
+<!-- Também é possível adicionar alguns outros tipos de tags HTML. -->
+
+<!-- Para inserir uma imagem. -->
+<img src="http://i.imgur.com/XWG0O.gif"/> <!-- O caminho da imagem deve ser indicado usando o atributo src="" -->
+<!-- O caminho da imagem pode ser uma URL ou até mesmo o caminho do arquivo no seu computador. -->
+
+<!-- Também é possível criar uma tabela. -->
+
+<table> <!-- Iniciamos a tabela com a tag <table>. -->
+ <tr> <!-- <tr> nos permite criar uma linha. -->
+ <th>Primeiro cabeçalho</th> <!-- <th> nos permite criar o título de uma coluna. -->
+ <th>Segundo cabeçalho</th>
+ </tr>
+ <tr>
+ <td>Primeira linha, primeira coluna</td> <!-- <td> nos permite criar uma célula da tabela. -->
+ <td>Primeira linha, segunda coluna</td>
+ </tr>
+ <tr>
+ <td>Segunda linha, primeira coluna</td>
+ <td>Segunda linha, segunda coluna</td>
+ </tr>
+</table>
+
+```
+
+## Uso
+
+HTML é escrito em arquivos com a extensão `.html` ou `.htm`. Seu mime type é `text/html`.
+
+## Para aprender mais
+
+* [wikipedia](https://en.wikipedia.org/wiki/HTML)
+* [HTML tutorial](https://developer.mozilla.org/en-US/docs/Web/HTML)
+* [W3School](http://www.w3schools.com/html/html_intro.asp)