<BODY>
<P ALINGN="CENTER">
<FONT SIZE=6 COLOR="RED">
<center> comprar roupas</center>
</font>
</p>
<BR> <BR> <HR>
<table border=1 bgcolor="White" width=80% height=20%>
<tr>
<th bgcolor="red"> <font color="black"> codigo </font> </th>
<th bgcolor="red"> <font color="black"> produto </font> </th>
<th bgcolor="red"> <font color="black"> preço </font> </th>
<th bgcolor="red"> <font color="black"> tamanho/comprar </font> </th>
</tr>
<tr>
<td> 1001 </td>
<td> <center> camiseta </center> <center> <img src="C:\Users\Cliente\Documents\levipágina\tabela botao\COL-4659-006_zoom1.jpg"</img> </center>
<td> R$ 500,00 </td>
<td> <input type="text" name="camiseta" id="camiseta"> <button onclick="javascript:precoCamiseta()";> pagar </button></td>
<tr>
<td> 1002 </td>
<td> <center> meia </center> <center> <img src="C:\Users\Cliente\Documents\levipágina\tabela botao\meias.jpg" </img> </center> </td>
<td> R$ 12,50 </td>
<td> <input type="text" name="meia" id="meia"> <button onclick="javascript:precoMeia()";> pagar </button></td>
</tr>
<tr>
<td> 1003 </td>
<td> <center> tenis </center> <center><img src="C:\Users\Cliente\Documents\levipágina\tabela botao\preto-vermelho.jpg" </img> </center> </td>
<TD> R$ 250,50</td>
<td> <input type="text" name="tenis" id="tenis"> <button onclick="javascript:precoTenis()";> pagar </button></td>
</tr>
<tr>
<td> 1004 </td>
<td> <center> moletom </center> <center><img src="C:\Users\Cliente\Documents\levipágina\tabela botao\moletom.jpg"</img> </center> </td>
<td> R$ 450,00</td>
<td> <input type="text" name="moletom" id="moletom"> <button onclick="javascript:precoMoletom()";> pagar </button></td>
</tr>
</table>
</BODY>
<script>
function precoCamiseta(){
var camiseta = document.getElementById("camiseta").Value;
if(camiseta == "p" || camiseta=="P"){
alert("A camiseta tamanho p custa R$500")
}
else{
alert("você comprou a camiseta p de R$500")
}
if(camiseta == "m" || camiseta=="M"){
alert("A camiseta tamanho m custa R$500")
}
else{
alert("você comprou a camiseta m de R$500")
}
if(camiseta == "g" || camiseta=="G"){
alert("A camiseta tamanho g custa R$500")
}
else{
alert("você comprou a camiseta G de R$500")
}
}
function precoMeia(){
var meia = document.getElementById("meia").Value;
if(meia == "p" || camiseta=="P"){
alert("A meia tamanho p custa R$12.50")
}
else{
alert("você comprou a meia p de R$12.50")
}
if(meia == "m" || camiseta=="M"){
alert("A meia tamanho g custa R$12.50")
}
else{
alert("você comprou a meia G de R$12.50")
}
if(meia == "g" || camiseta=="G"){
alert("A meia tamanho g custa R$12.50")
}
else{
alert("você comprou a meia G de R$12.50")
}
}
function precoTenis(){
var tenis = document.getElementById("tenis").Value;
if(tenis == "39" || tenis=="39"){
alert("O tenis de tamanho 39 custa R$250.50")
}
if(tenis == "40" || tenis=="40"){
alert("O tenis de tamanho 40 custa R$250.50")
}
if(tenis == "42" || tenis=="42"){
alert("O tenis de tamanho 42 custa R$250.50")
}
else{
alert("você comprou o tenis de R$250.50")
}
}
function precoMoletom(){
var moletom = document.getElementById("tenis").Value;
if(moletom == "p" || moletom=="P"){
alert("O moletom de tamanho P custa R$450.50")
}
if(moletom == "m" || moletom=="M"){
alert("O moletom de tamanho m custa R$450.50")
}
if(moletom == "g" || moletom=="G"){
alert("O moletom de tamanho g custa R$450.50")
}
else{
alert("você comprou o moletom R$450.00")
}
}
</script>
</HTML>
Página com tabelas