Abaixo está uma proposta de solução para os exercícios do teste de avaliação de frequência às aulas práticas. Se tem dúvidas sobre esta resolução, fale com o seu Professor. GRUPO I HTML 1. CrieumHTMLcom3tiposdiferentesdelistasnãonumeradas. Resolução: <html><body> <p>3exemplosdelistasnãonumeradas</p> <ul><li>item1</li> <li>item2</li> <li>item3</li> </ul> <ultype="circle"><li>item1</li> <li>item2</li> <li>item3</li> </ul> <ultype="square"><li>item1</li> <li>item2</li> <li>item3</li> </ul> </body></html> 2. CrieumHTMLcomaseguintetabela. Defina2propriedadesásescolha(Larguradaborda,coresdecélulas,tamanhodeletra,etc). Resolução: <html><body> <tableborder="1"><tr><th>pintos</th> <th>nacionalidade</th>
<th>estilo</th> <trstyle="background color:green">> <td>picasso</td><td>espanha</td><td>cubismo</td> <tr> <td>renoir</td><td>frança</td><td>impressionismo</td> <trstyle="background color:green">> <td>warhol</td><td>u.s.a.</td><td>pop</td> </table> </body></html> 3. Crieumformulárioaescolhacontendoobrigatoriamente2camposdeediçãodetexto,um radiogroupcom3opções,4checkboxes,umselectorcom5opçõese1áreadetexto.inclua aindaumbotãodelimpareoutrodeenviar,sendoqueesteultimaenviaosdados preenchidosparaumendereçodee mail. Resolução: <html> <head> <title></title> </head> <body> <h1>formulário</h1> <hr> <form action="mailto:númeroaluno@ubi.pt" method="post" enctype="text/plain"> Nome: <input type="text" name="nome"><br> Morada: <input type="text" name="morada"><br> Nacionalidade: <select name="sector"> <option value="p">portugal <option value="e">espanha <option value="f">frança <option value="i">itália <option value="s">suiça </select><p> Desportos preferidos:<br> <input type="radio" checked name="contrato" value="fut">futebol<br> <input type="radio" checked name="contrato" value="ten">tenis<br> <input type="radio" checked name="contrato" value="gol">golf<p>
Ocupação tempo livre:<br> <br> <input type="checkbox" name="op1">ouvir música<br> <input type="checkbox" name="op2">ver filme<br> <input type="checkbox" name="op3">jogar computador<br> <input type="checkbox" name="op4">ler livro<br> <input type="checkbox" name="op5">outra<br> <textarea rows="5" cols="40">informação Adicional</textarea></p> <input type="reset" value="limpar"> <input type="submit" value="enviar"> </form> </body> </html> GRUPO II CSS 4. Crieumafolhadeestilo(CSS)edefinaasregrasnecessáriasaque: a) Todooconteúdoanegritoapresentetambémacorazuleoestiloitálico. b { color:blue; font-style:italic; b) Todososheadingsestejamcentrados,comfonteArial. h1, h2, h3, h4, h5, h6{ text-align: center; font-family: Arial; c) Osparágrafosdaclasse Portugal tenhamumavançode20pixelsàesquerda,otexto amarelosobreumfundoverdecomumrebordotracejadovermelho. p.portugal { padding-left: 20px; background-color: green; color: yellow; border: dashed red; d) Ocursordorato,aoestarcolocadosobreumahiperligaçãoclassificadacom ajuda, assumaaformadocursordeajuda. a.ajuda:hover { cursor: help; e) Asimagenstenhamtodasamesmalargura,sejamencostadasàdireita,eotextose moldeaelassegundoumamargemde25pixels. img { width: 250px;
float: right; margin: 25px; f) Nosheadingsdotipo1,asletrasminúsculasdevempassarautomaticamentea maiúsculas. h1 { font-variant: small-caps; g) Naslistasnãonumeradas,ositensdeverãoserassinaladoscomumquadrado,ao invésdotradicionalcírculo. ul { list-style-type: square; 5. Analiseaseguintefolhadeestilo. estilo.css.tabelaflores{ font-family: 'Tahoma'; font-size: small; background-color: none; width:70%; border:green thick solid;.cabecalho { font-weight: bold; letter-spacing: 5px; text-align: center;.linhaimpar { background-color: gray; border: 1px solid black; color: white;.colunacor { text-align: center;.colunapreco { text-align: right; h) ProduzaocódigoHTMLnecessárioparaque,fazendousodestafolhadeestilo (convenientementecontidanoficheiroestilo.css),seobtenhaatabelapresentena figuraquesesegue. <html><head> <link rel="stylesheet" type="text/css" href="tabela.css"> </head><body> <table class="tabelaflores">
<caption>tabela flores</caption> <tr class="cabecalho"> <td>flor</td> <td>cor</td> <td>preço</td> <tr class="linhaimpar"> <tr> <td>orquidea</td> <td class="colunacor">cor-de-rosa</td> <td class="colunapreco">85</td> <td>rosas</td> <td class="colunacor">vermelho</td> <td class="colunapreco">95</td> <tr class="linhaimpar"> <td>rosas</td> <td class="colunacor">amarelo</td> <td class="colunapreco">45</td> </table></body></html> GRUPO III PHP 6. Escrevaumprogramaquedigaconsoanteahoradodia Bomdia, Boatarde ou Boanoite. (exercício8daficha7) 7. Imprimaumatabelaquepermitafazeraconversãodemilhasnáuticaparametros.Os valoresdestatabeladeverãovariarentre1e1000(1milhanáutica=1852metros). (exercício5daficha8) Classificação: Grupo I: 9 valores. Grupo II: 7 valores. Grupo III: 4 valores.