INF1030-Aula01versaoClaudiaVersaoReduzida.pptx

<!DOCTYPE html>
<html>
<head>
<title>Oi</title>
</head>
<body>
<h1 style="color:blue"> Aqui é um cabeçalho</h1>
<p contenteditable="true"> E agora um parágrafo editável</p>
</body>
</html>

<!DOCTYPE html>
<html lang="pt-br">
<head>
<title>teste</title>
<meta charset="utf-8">
<style>
#id1 {color:blue; font-family:Calibri; font-size:20px}
#id2 {color:black; text-align:center; background-color:yellow}
.classe1 {color:red; text-align:center}
</style>
</head>
<body>
<p class="classe1" ><b>Oi</b></p>
<p id="id1" class="classe1"><b>INF1030</b></p>
<h3 id="id2">Os elementos foram identificados
com id e/ou class!!!!</h3>
<p class="classe1"><b><i>Mudamos a cor e o alinhamento</b></i></p>
<h3 class="classe1">com facilidade!!!!</h3>
</body>
</html>

<p> Primeiro parágrafo</p>
<b> Texto em negrito </b>
<p><b> Primeiro parágrafo em negrito</b></p>
<meta charset="utf-8"/> (utiliza um charset com acentuação)
<br/> (muda de linha)
<img src="img/mlo.jpg" alt="logo da empresa"/> (inclui uma imagem)
<tag> Conteúdo da tag </tag>.
Forma geral: </tag>

Exemplos:
<p style="text-align:left;font-size:25px"> Aqui está alinhado à esquerda</p>
<a href="http://www.puc-rio.br" target="_blank"> PUC-Rio </a>
<img src="img/logo.jpg" alt="descrição do logotipo"/>
<meta charset="utf-8"/>
Forma geral: nome do atributo="valor".

<p align="right"> <i>HTML</i> é uma <b>linguagem de marcação</b></p>
<h6>Elementos HTML <i><b>podem</b></i> ser aninhados e identificados</h6>
<br/>




<p>Palavra1   Palavra2.</p> --> Palavra1 Palavra2

Forma geral: propriedade: valor.

Forma geral: <style type="text/css">
seletor1 {prop1: val1 ; prop2: val2 ; ... ;}
....
seletorn {prop1: val1 ; prop3: val3 ; ... ;}
</style>

<!DOCTYPE html>
<html>
<head>
…
</head>
<body>
<h1> Atividades da 1ª Aula </h1>
<hr/> <p>
<i>Disciplina:</i><b> INF1030 </b><br/>
<i>Professor: </i><b>Claudia Ferlin </b><br/>
<i>Horário: </i><b>Quarta-feira - 11hs às 14hs</b><br/>
<i>Local:</i><b> RDC</b>
<hr/> </p> <br/>
<h2>Pauta </h2>
<h5 style = "margin-left:24px">
Apresentação da disciplina<br/>
Introdução ao <i>HTML</i><br/>
Tarefas Extraclasse<br/>
</h5>
<hr/><hr/>
<h5 style = "font-size:14px">Atividade 1 </h5>
<hr/><hr/>
<hr/><hr/>
<hr/><hr/>
</body>
</html>

#ident { width: 80%; height: 200px; margin: 0 auto;
background: Linen; text-align: center; }
#prog { width: 80%; height: 200px; margin: 0 auto;
background: Ivory; border: 3px solid red
}
#ativ { width: 80%; height: 400px; margin: 0 auto;
background: Bisque; text-align: center;
}

Forma geral: <a href="local" target="tipo">Texto a exibir/Imagem</a>

<a href="sobre.html" target="_blank"> Sobre o Site </a>

Forma geral: <a name="lugar">qualquer conteúdo (geralmente vazio)</a>

INF1030-Aula01versaoClaudiaVersaoReduzida.pptx

INF1030-Aula01versaoClaudiaVersaoReduzida.pptx

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a INF1030-Aula01versaoClaudiaVersaoReduzida.pptx

Semelhante a INF1030-Aula01versaoClaudiaVersaoReduzida.pptx (10)

Último

Último (20)

INF1030-Aula01versaoClaudiaVersaoReduzida.pptx