Desenvolvimento Front-End

HTML - Principais elementos

Listas

Para criarmos listas não ordenadas utilizamos a etiqueta <ul></ul>, já para listas ordenadas utilizamos a etiqueta <ol></ol>.

  1. Item 1
  2. Item 2
  3. Item 3

Tabelas

Tabelas de dados são criadas com a etiqueta <table></table>, e podemos dividir o cabeçalho do corpo em si, usando as etiquetas <thead><thead> e <tbody><tbody>. Porém a partir daí precisamos ter a visão de linhas e colunas, pois primeiro precisamos criar uma linha, utilizando a etiqueta <tr><tr>, para só então criar as células de coluna, utilizando a etiqueta <td><td> (ou a etiqueta <th><th> para o cabeçalho).

Mês Resultado
Janeiro Concluído
Fevereiro Concluído
Março Pendente

Mídias

Podemos criar elementos de áudio e vídeo, com reprodutor nativo do navegador, usando a etiqueta <audio><audio>, <video><video> e a sub etiqueta <source><source>.


Gráficos

Para aplicações ou animações em Flash, é necessário adicionar a etiqueta <embed><embed>.

Formulários

Existe uma vasta gama de elementos envolvendo a entrada de dados, contudo é necessário se atentar à compatibilidade entre navegadores. Aqui temos as etiquetas <form></form>, <fieldset></fieldset> (com <legend></legend>), <label></label>, <input /> (dos tipos text, number, date, password e submit), <select></select> (com <option></option> e <optgroup></optgroup>) e <textarea></textarea>. Ufa!

Formulário de teste





CSS

JS