sábado, 21 de setembro de 2013

Aula 3 - Webdesign: HTML Básico - Aplicando Códigos


HTML Básico - Aplicando Códigos

Construindo uma página INDEX através do editor de texto notpad++
1.Iniciar o aplicativo notped++;
2.Salvar o arquivo em uma pasta (web_sobrenome);
3.nome do arquivo: index;
4.tipo de extensão: HyperText Markup Language  (html).

Após esses procedimentos construir os códigos abaixo.


<!DOCTYPE html>
<html>
  
 <head> Home
 <!-- TAG apenas para observações e comentários - conteúdo do head-->
    </head>
  
<title>  Primeira Página  </title>
   <body>

      <!--mudar cor do body-->

  <body bgcolor="#F5A545">
 
 
  <!--conteudo do body-->
  <!--xxxx-->
 
  <!--tags para título-->
 
  <h1> Título 1 </h1> <br>
  <h2> Titulo 2 </h2> <br>
  <h3> Título 3 </h3> <br>
  <h4> Titulo 4 </h4> <br>
  <h5> Título 5 </h5> <br>
  <h6> Titulo 6 </h6> <br>
 
 
  <!--tags paragrafo  gerador de texto : http://pt.lipsum.com/-->

  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis luctus
  vehicula pharetra. Proin egestas lacinia lectus, eu fermentum est
  adipiscing eu. Donec erat nibh, pulvinar ac justo ac, viverra dictum
  ipsum. Phasellus nec tempor ipsum. Vestibulum scelerisque accumsan
  velit ac aliquam. Praesent arcu leo, blandit at dictum id, dignissim
  et augue. Cras mi justo, mattis non sollicitudin vel, rutrum a risus.</p>
 
  <p>Duis in quam eget mauris porta rhoncus. In iaculis tincidunt fermentum.
  Phasellus pulvinar congue massa ac sagittis. Duis mauris diam, venenatis
  non blandit at, facilisis eget risus. Duis elit justo, fermentum id sem
  in, semper tempor neque. Nulla viverra tortor ut diam adipiscing bibendum.
  Fusce id augue ac odio tristique pharetra. Sed sollicitudin condimentum
  urna, quis venenatis mauris. Maecenas nec sapien quis ante imperdiet
  laoreet eu ac nibh.</p>
 
  <br>  <br>

  <!--tags itálico-->

  <em>Fusce id augue ac odio tristique pharetra. Sed sollicitudin condimentum
  urna, quis venenatis mauris. Maecenas nec sapien quis ante imperdiet
  laoreet eu ac nibh.</em>
 
 <br>  <br>
 
 <!--tags sublnhar-->
 
  <u>Fusce id augue ac odio tristique pharetra. Sed sollicitudin condimentum
  urna, quis venenatis mauris. Maecenas nec sapien quis ante imperdiet
  laoreet eu ac nibh.</u>
   <br>  <br>
  
<!--tags negrito-->
 
  <Strong> Fusce id augue ac odio tristique pharetra. Sed sollicitudin condimentum
  urna, quis venenatis mauris. Maecenas nec sapien quis ante imperdiet
  laoreet eu ac nibh.</Strong>
 
  <br><br>
 
  <!--tags tipo da fonte-->
 
 
 <font face="arial" color="#0000EE"  size="16">  Fusce id augue ac odio tristique pharetra. Sed         sollicitudin condimentum  urna, quis venenatis mauris. Maecenas nec sapien quis ante imperdiet
  laoreet eu ac nibh.    </font>
  <br> <br>
 
 <font face="courier">  Fusce id augue ac odio tristique pharetra. Sed sollicitudin condimentum
 urna, quis venenatis mauris. Maecenas nec sapien quis ante imperdiet
  laoreet eu ac nibh.    </font>
 
  
 
 
</body>
</html>

Nenhum comentário:

Postar um comentário