Aula 05
Aula 05
AW - 05 - 2301.htm
—
HTML,
7 kB (8121 bytes)
Conteúdo do arquivo
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Conceitos de Imagens Digitais</title>
<link type="text/css" href="../../incs/bloco.css" rel="stylesheet" />
</head>
<body>
<h1>Programação para Internet</h1>
<h2>Tags avulsas</h2>
<h3>TAG <abbr></h3>
<ol>
<li>Usa-se para descrever uma expressão abreviada. A sua utilização pode ajudar bastante na leitura da página</li>
<li>Se a página for visualizada pelo Mozilla ao passar o mouse será mostrado o título da abreviação</li>
<li>Exemplo: <abbr title="File Trasfer Protocol">FTP</abbr></li>
<li>Código:
<pre><abbr title="File Trasfer Protocol">FTP</abbr></pre>
</li>
</ol>
<h3>TAG <acronym></h3>
<ol>
<li>Define um termo formado pela justaposição de letras ou de sílabas de outras palavras</li>
<li>Exemplos: <acronym title="Gerência de informática">GEINF</acronym>, <acronym title="World Wide Web">WWW</acronym></li>
<li>Código:
<pre><acronym title="Gerencia de informática">GEINF</acronym> </pre>
</li>
</ol>
<h3>TAG <address></h3>
<ol>
<li>Usa-se para escrever um endereço. Normalmente ele é usado para escrever um endereço postal, mas também pode servir para escrever uma assinatura</li>
<li>Tem uma formatação default, que pode ser modificada como folha de estilo, itálico</li>
<li>Exemplo:
<address>
Rua Santa Fé, Nova Descoberta, 888 - Natal, RN
</address>
</li>
<li>Código:
<pre><address>Rua Santa Fé, Nova Descoberta, 888 - Natal, RN</address></pre>
</li>
</ol>
<h3>TAG <blockquote>, <cite> e <q></h3>
<ol>
<li><blockquote> - Usa-se para fazer uma citação extensa, a citação deve conter parágrafos</li>
<li><cite> - Define o nome do autor e/ou fonte</li>
<li><q>- Uma breve citação</li>
<li>Exemplo: <br />
<blockquote>
<p>Esse é o primeiro parágrafo do blockquote</p>
<p>Esse é o segundo parágrafo do blockquote</p>
</blockquote>
Danielle Freitas <br />
Aqui é só uma citação de uma linha Danielle Freitas </li>
<li>Código:
<pre><blockquote>
<p>Esse é o primeiro parágrafo do blockquote</p>
<p>Esse é o segundo parágrafo do blockquote</p>
</blockquote><cite>Danielle Freitas</cite> <br />
<q>Aqui é só uma citação de uma linha</q>
<cite>Danielle Freitas</cite> </pre>
</li>
</ol>
<h3>TAG <dl>, <dt> e <dd></h3>
<ol>
<li><dl> - Abre o bloco da lista de definições</li>
<li><dt> - Contém o termo numa lista de definições</li>
<li><dd> - Apresenta a descrição do termo de lista de definições</li>
<li>Exemplo:
<dl>
<dt>Rum</dt>
<dd>Bebida espirituosa muito apreciada pelos piratas Caraíbas</dd>
<dt>Bagaceira</dt>
<dd>Bebida portuguesa com alto teor alcoólico e extraordinários poderes medicinais</dd>
</dl>
</li>
<li>Código:
<pre><dl>
<dt>Rum</dt>
<dd>Bebida espirituosa muito apreciada pelos piratas Caraíbas</dd>
<dt>Bagaceira</dt>
<dd>Bebida portuguesa com alto teor alcoólico e extraordinários poderes
medicinais</dd>
</dl> </pre>
</li>
</ol>
<h3>TAG <del> e <ins></h3>
<ol>
<li><del> - Define um termo antigo, formatação tachada</li>
<li><ins> - Descreve a atualização do termo</li>
<li>Exemplo: Preço: R$ 30,00 por apenas R$ 25,99</li>
<li>Código:
<pre>Preço: <del>R$ 30,00</del> por apenas <ins>R$ 25,99</ins></pre>
</li>
</ol>
<h3>TAG <dfn></h3>
<ol>
<li>Marca os termos especiais</li>
<li>Exemplo:
<p>O XHTML é uma linguagem de marcação Extensível porque ela permite a inclusão de novos elementos</p>
</li>
<li>Código:
<pre><p>O XHTML é uma linguagem de marcação
<dfn title="Que se extende">Extensível</dfn>
porque ela permite a inclusão de novos elementos</p> </pre>
</li>
</ol>
<h3>TAG <tt>, <i>, <b>, <big> e <small></h3>
<ol>
<li>Esses elementos definem uma formatação do tipo breve, que não seria viável ser feita por folha de estilo, por ser algo apenas para uma palavra específica</li>
<li><tt> - Tipo máquina de escrever</li>
<li><i> e <em> - <em>Texto</em> <em>itálico</em></li>
<li><b> e <strong> - <strong>Texto</strong> <strong>Negrito</strong></li>
<li><big> - Texto com fonte grande</li>
<li><small> - Texto com fonte pequena</li>
<li>Código:
<pre><tt>Tipo máquina de escrever</tt><br />
<i>Texto</i> <em>itálico</em><br />
<b>Texto</b> <strong>Negrito</strong><br />
<big>Texto com fonte grande</big><br />
<small>Texto com fonte pequena</small> </pre>
</li>
</ol>
<h3>TAG <pre></h3>
<ol>
<li>Define texto pré-formado. O texto contido neste elemento é tratado de forma especial pelo browser, pois é apresentado todos os espaços, quebras de linha e mantém uma fonte monoespaçosa</li>
<li>Exemplo:<br />
<pre>Essa é a primeira linha agora é a segunda
essa tag é ótima para colocar códigos! é como eu uso!! </pre>
</li>
<li>Código:
<pre><pre>Essa é a primeira linha agora é a segunda
essa tag é ótima para colocar códigos! é como eu uso!!
</pre></pre>
</li>
</ol>
<h3>TAG <sub> e <sup></h3>
<ol>
<li><sub> - Alinha o texto abaixo do texto normal</li>
<li><sup> - Alinha o texto acima do texto normal</li>
<li>Exemplo:<br />
normalacimaabaixo </li>
<li>Código:
<pre><span>normal</span><sup>acima</sup><sub>abaixo</sub> </pre>
</li>
</ol>
<h3>TAG <span></h3>
<ol>
<li>Usa-se para agrupar elementos mantendo a continuidade das linhas</li>
<li>Com a disseminação do uso de camadas a tag <span> e <div> são muito utilizadas, mas cada uma age diferente o span é um elemento "inline" e o div é para destaque em bloco</li>
<li>Exemplo:<br />
<p>Quero que várias palavras desse parágrafo sejam destacadas, então essas palavras devem ser cobertas pela tag span! Assim aplicarei um estilo negrito e vermelho que será comum a todas. </p>
</li>
<li>Código:
<pre><style type="text/css">
<!--
span.dest{
font-weight : bolder;
color: Red; }
-->
</style>
<p>Quero que várias <span class="dest">palavras</span> desse
<span class="destacadas">parágrafo</span>
sejam <span class="destacadas">destacadas</span>,
então essas palavras devem ser cobertas pela tag
<span class="destacadas">span!</span> Assim aplicarei um
<span class="dest">estilo</span> negrito e vermelho que será comum a
<span class="destacadas">todos</span>. </p></pre>
</li>
</ol>
<h3>TAG <div></h3>
<ol>
<li>Define uma seção do documento, também chamado de camada</li>
<li>Usada para delimitar uma área da página, exemplo a área dos links, do cabeçalho, do rodapé, assim poderão ser melhor controlados na folha de estilo</li>
<li>Exemplo:
<div>Essa é uma camada que define uma seção</div>
</li>
<li>Código:
<pre><div>Essa é uma camada que define uma seção</div> </pre>
</li>
</ol>
</body>
</html>
