daw_aula_5

IFG

Enviado por Breno Leles em 22/09/2013

Esta é uma pré-visualização de arquivo. Entre para ver o arquivo original

Wendell Bento Geraldes
Desenvolvimento 
para 
Aplicações WEB
 
Roteiro
 Links
 Imagens
 Tabelas
 Layouts
 Formulários
 Iframes
 Cores
 
Links
 Sintaxe
<a href=”url”>Texto do Link</a>
 Exemplo
<a href="http://www.ifgoias.edu.br">IFG</a>
 
 
Imagens
 Sintaxe
<img src=”url” alt=”texto”/>
 Exemplo
<img src="imagem.png" alt="Figurinha" /> 
 
 
Tabelas
 Exemplo 1
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table> 
 
Tabelas
 Exemplo 2
<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table> 
 
Layouts – usando div
<!DOCTYPE html>
<html>
<body>
<div id="container" style="width:500px">
<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">Titulo da Página Web</h1></div>
<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>Menu</b><br />
HTML<br />
CSS<br />
JavaScript</div>
<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
Content goes here</div>
<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
Copyright © W3Schools.com</div>
</div>
</body>
</html> 
 
Formulários
 Sintaxe
<form>
elementos input
</form>
 Exemplo – campo texto
<form>
Primeiro nome: <input type="text" 
name="pnome" /><br />
Segundo nome: <input type="text" 
name="snome" />
</form>
 
Formulários
 Exemplo – campo senha
<form>
Senha: <input type="password" name="pwd" 
/>
</form>
 Exemplo – Radio Buttons
<form>
<input type="radio" name="sexo" 
value="masculino" /> Masculino<br />
<input type="radio" name="sexo" 
value="feminino" /> Feminino
</form>
 
Formulários
 Exemplo – checkbox
<form>
<input type="checkbox" name="veiculo" 
value="Bicicleta" /> Eu tenho uma bike<br />
<input type="checkbox" name="veiculo" 
value="Carro" /> Eu tenho um carro
</form>
 Exemplo – Botão Submissão
<form name="input" 
action="html_form_action.asp" method="get">
Username: <input type="text" name="user" />
<input type="submit" value="Submit" />
</form> 
 
iFrame
 Síntaxe
<iframe src="URL"></iframe> 
 Exemplo – com bordas
<iframe src="demo_iframe.htm" 
width="200" height="200"></iframe>
 Exemplo – sem bordas
<iframe src="demo_iframe.htm" 
frameborder="0"></iframe>
 
Cores
 Preto #000000 rgb(0,0,0)
 Vermelho #FF0000 rgb(255,0,0)
 Verde #00FF00 rgb(0,255,0)
 Azul #0000FF rgb(0,0,255)
 Amarelo #FFFF00 rgb(255,255,0)
	Slide 1
	Slide 2
	Slide 3
	Slide 4
	Slide 5
	Slide 6
	Slide 7
	Slide 8
	Slide 9
	Slide 10
	Slide 11
	Slide 12