Prepara AV1 Tecnologias para Internet I

TECNOLOGIAS PARA
INTERNET I
ANTONIO MARIA CARNEIRO NETO
Unidade I - O AMBIENTE INTERNET

Surgimento da Internet aps a Segunda Guerra Mundial
A Teia
O embrio do que hoje a maior rede de comunicao do planeta
nasceu em setembro de 1969.
O Departamento de Defesa dos Estados Unidos tiveram a ideia de
criar um sistema de comunicao que no pudesse ser destrudo
por bombardeios eu fosse capaz de ligar pontos estratgicos,
como centros de pesquisas de bases das Foras Armadas.
O projeto ARPA
O projeto foi financiado pela Advanced Research Projects Agency
(ARPA), rgo responsvel pelo desenvolvimento de pesquisas
cientficas e tecnolgicas para fins militares do governo norteamericano, o que fez com que a rede fosse batizada de Arpanet.
A rede funcionou pela primeira vez em janeiro de 1972
interligando 4 computadores em locais distintos, todos na costa
oeste dos EUA
CCT0412 - TECNOLOGIA PARA INTERNET I
O AMBIENTE INTERNET
Breve descrio do protocolo TCP/IP
Cerf, juntamente com engenheiro Robert Kahn foi responsvel pela
criao de um pequeno mecanismo que permite dois computadores
conversassem entre si, no mesmo idioma, quando ligados na rede.
Esse mecanismo foi batizado como protocolo TCP/IP em ingls
Transfer Control / Internet Protocol - fez com que as diversas redes se
integrassem, formando uma gigantesca rede internacional de redes
de computadores, chamada pela primeira vez de Internet.
Surgiram a Bitnet, que transportava mensagens de correio
eletrnico, e a NSFnet, que permitia o uso interativo de
computadores remotos e a troca de arquivos e de mensagens de email.
Mas a popularizao da Internet em todo o mundo foi a World Wide
Web (tambm chamada de WWW, ou teia de alcance mundial),
criada pelo fsico ingls Tim Berners-Lee em 1990, na Sua, no
laboratrio Europeu de Partculas Fsicas, o CERN (sigla de Conseil
Europen pour la Recherche Nuclaire).
O AMBIENTE INTERNET
O primeiro navegador Mosaic
Pouco depois da criao da WWW, o Centro Nacional para
Aplicaes em Supercomputadores dos Estados Unidos
(NCSA), deu incio criao de um programa que possibilitou
a visualizao do contedo da Web, o Mosaic .
O Mosaic foi o primeiro programa de navegao (ou browser)
da histria. O software fez com que a internet abandonasse o
miservel mundo das letrinhas verdes e ganhasse uma
interface grfica, ou seja, um rosto. Essa nova cara fez com
que as pessoas pudessem compartilhar textos e arquivos,
como ocorria at ento, mas tambm imagens, sons e
grficos em locais de atualizao dinmica, denominados
sites. Algo semelhante s pginas de uma revista, s que na
tela do computador.
O AMBIENTE INTERNET
A rede no Brasil
O primeiro contato do brasil com a Internet ocorreu em
1988 quando a Fundao de Amparo Pesquisa do estado de
So Paulo (Fapesp), ligada Secretaria Estadual de Cincia e
Tecnologia realizou a primeira conexo rede atravs de uma
parceria com o Fermilab, um dos mais importantes centros de
pesquisa cientfica dos Estados Unidos.
O Consrcio World Wide Web (W3C)
Conforme W3C (Consrcio World Wide Web (W3C) um
consrcio internacional criado em 1989, no qual organizaes
filiadas, uma equipe em tempo integral e o pblico trabalham
juntos para desenvolver padres para a Web. Liderado pelo
inventor da web Tim Berners-Lee e o CEO Jeffrey Jaffe, o W3C
tem como misso Conduzir a World Wide Web para que atinja
todo seu potencial, desenvolvendo protocolos e diretrizes que
garantam seu crescimento de longo prazo.
Unidade II - INTRODUO AO HTML5

histria do HTML5
Em 1998 a W3C decidiu que no continuaria a evoluir o HTML. O futuro
era o XML. Ento o HTML foi congelado na verso 4.01 e uma especificao foi
lanada com nome de XHTML, que era uma verso do XML do HTML exigindo
regras XML de sintaxe como atributos com aspas, algumas tags com fechamento
enquanto outras eram autocontidas.
Um pequeno grupo no pera, entretanto, no estava convencido que o
XML era o futuro para todos os autores web. Estes indivduos comearam
um trabalho extra curricular em uma especificao prova de conceito que
estender os formulrios HTML sem quebrar a retrocompatibilidade. Aquela
especificao eventualmente se tornou Web Forms 2.0, subsequentemente foi
incorporado na especificao HTML5.
Em 2006 a W3C decidiu que talvez tivesse sido otimista demais na esperana de
que o mundo se mudasse para o XML. Boas ideias geram implementadas e as
mais rejeitadas independentemente de quem fosse a fonte e quem ela
representasse, ou at mesmo onde elas foram inicialmente debatida. Boas ideias
sero adotadas no Twitter, blogs e IRC.
NTRODUO AO HTML5
histria do HTML5
Devido a especificao HTML 5 est sendo desenvolvida tanto pela W3c quanto a
WHATWG, h diferentes verses da especificao. Conforme abaixo:
www.w3.org/TR/html5 o snapshot oficial da W3C;
Em 2009 a W3C parou de trabalhar no XHTML 2.0 e desviou recursos para HTML5
ficando claro que o HTML5 havia vencido a batalha de filosofias. O fato de os
grupos de trabalho HTML5 consistir em representantes de todas as fabricantes
de navegadores, tambm era importante. Se os fabricantes estivesse dispostos a
implementar parte da especificao ( como a indisposio da Microsoft para
implementar <dialog>, ou a oposio da Mozilla ao <bb>) ela era removida;
Hickson (Ian ?Hixie? Hickson, lder da Mozilla que ajudou na especificao do
HTML 5) disse ?A realidade que os fabricantes de navegadores tm o veto
definitivo em tudo na especificao, j que se eles no a implementarem , a
especificao no nada alm do trabalho de fico? (
http://www.webstandarts.org/2009/05/13/interview-with-ian-hickson-editor-of-thehtml5-especification/
). Muitos participantes acharam isto altamente desagradvel: Os fabricantes de
navegadores tomaram de assalto ?nossa web? reclamaram com alguma
justificativa.
INTRODUO AO HTML5
A filosofia por trs do HTML5
Ainda mais importante a necessidade de um padro aberto livre (para
utilizar e livre para implementar) que possa competir com padres proprietrios
como Adobe Flash ou Microsoft Silverlight. Independente do que voc acha
destas tecnologias ou empresas acreditamos que a Web seja uma plataforma
muito vital sociedade, comrcio e comunicaes para estar nas mos de um
fabricante. O quo diferente teria progredido a Renascena se Caxton tivesse
mantido patente e monoplio da fabricao de prensas de impresso ?
No quebre a Web
H exatamente milhes de pginas Web j em uso por a, e interativo que elas
continuem a ser reproduzidas. Ento o HTML5 em sua maioria um derivativo
do HTML4 que continua definir como os navegadores devem lidar com
marcaes antigas como <font>, <center> e outras tags de apresentao, pois
milhes de pginas web as utilizam. Mas os autores no devem utiliz-las pois
esto obsoletas
INTRODUO AO HTML5
Estrutura Principal
Primeiro o DOCTYPE:
<!doctype html>
Note que se quer h um nmero de verso, isto tudo. No uma instruo
para encantamento: ela exigida pelos navegadores que precisam da
presena do de um doctype para ativar o modo de padres, e esta string
a string mais curta que o faz de maneira confivel.
Ento precisamos definir a codificao de caracteres do documento no faz lo
pode resultar em um risco de segurana obscuro porm real
INTRODUO AO HTML5
O que uma TAG HTML?
o elemento que compem a estrutura do documento HTML5, este elemento
iniciado com o smbolo menor ( < ) e terminado com o smbolo maior ( > ), como
por exemplo: <doctype>, <html>, <div>, etc. As so divididas conforme
categorias abaixo:
O elemento root
metadados
Scripts
sees
agrupamento de contedo
Semnticas de nvel de texto
Edies
Contedo incorporado
Tabelas
Formulrios Interativo
INTRODUO AO HTML5
Atributos de uma TAG
Uma TAG pode conter atributos, que so informaes que alteram o
comportamento da TAG. Os atributos podem ser divididos em atributos
especficos para cada TAG e atributos globais que so comuns a todas as tags.
Alm das TAGs, existem outros elementos que ajudam na construo de
documentos HTML5, que so: o CSS, o Javascript.
Uma breve definio de CSS
uma abreviao do termo Cascading Style Sheet (Folhas de Estilo em Cascata).
O CSS permite, de uma forma simples, a a utilizao de estilos (cor do texto,
tamanho e tipo da fonte) ao documento HTML. Tem como finalidade fornecer ao
navegador a forma como os elementos so apresentados.
INTRODUO AO HTML5
Uma breve definio da linguagem Javascript
uma linguagem de programao que est localizado do lado cliente, isto , no
navegador e tem como objetivo controlar o HTML e o CSS manipulando-os no
documento HTML. Esta linguagem muito parecida com as linguagens C++ e
Java, permitindo inclusive a orientao a objetos. mantida pela European
Computer Manufacturer's Association (http://www.ecmascript.org/) e atualmente
encontra-se na verso 5.
O que DOM (Document Object Model) ou Modelo de Objetos do
Documento ?
a interface entre a linguagem Javascript e os objetos do HTML. Basicamente
quando o documento HTML carregado pelo navegador, o mesmo fica
armazenado em uma estrutura hierrquica em forma de rvore que pode ser
facilmente manipulvel atravs de comandos Javascript.
Unidade III - INTRODUO CONSTRUO DE PGINAS

ESTTICAS - TAGS
Tag's estruturais do HTML5

Os elementos estruturais definem a
forma como o documento HTML5 pode
ser criado. Sua utilizao no
obrigatria, no entanto, recomenda-se
que sejam utilizados em determinadas
circunstncias dentro o documento.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>The HTML Document</title>
</head>
<body>
<p>The HTML content</p>
</body>
</html>
INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

<HTML>
O elemento <HTML> representa a TAG principal
para a construo do documento HTML.
apresentado abaixo a estrutura de um
documento HTML.
Onde:
<head> - Representa uma coleo de
metadados. Neste elemento so carregadas as
informaes referentes ao documento, como por
exemplo comandos CSS e Javascript.
<title> - Localizado dentro do <head>,
representa o ttulo do documento.
<body> - Localizado no mesmo nvel do
<head>, este elemento representa o contedo
principal da pgina. Aqui esto localizados todos
os comandos necessrios para a criao do
documento HTML.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>The HTML Document</title>
</head>
<body>
<p>The HTML content</p>
</body>
</html>
<SECTION>
O elemento <section> representa uma seo
genrica dentro de um documento. Este
elemento pode conter um agrupamento de
textos com vrios captulos, sees numeradas,
etc. No exemplo abaixo apresentado um
artigo contendo um assunto principal e dentro
deste assunto vrias sees com assuntos
distintos.
Exemplo de utilizao:
<article>
<hgroup>
<h1>Livro sobre HTML</h1>
<h2>Como criar uma pgina </h2>
</hgroup>
<p>O curso de HTML muito
importante </p>
<section>
<h1>O HTML 5</h1>
<p>Surgimento do HTML 5</p>
</section>
<section>
<h1>Tags</h1>
<p>Comandos de criao de
pginas.</p>
</section>
</article>
<NAV>
Este elemento a seo onde ficam as
informaes de navegao de pgina.
Geralmente nesta seo so colocados os
ligaes ( links internos) para a prpria pgina
ou ligaes externas para outras pginas de
sites externos.
<header>
<nav>
<h1>Menu Principal</h1>
<ul>
<li><a
href="articles.html">ndice de
artigos</a></li>
<li><a href="
http://www.estacio.br"> Site da
Estcio</a></li>
</ul>
</nav>
</header>
<ARTICLE>
um artigo independente dentro de um texto,
este elemento pode estar ou no dentro de um
elemento <section>. Imagine um jornal com as
sees de esportes, fofocas, etc. Dentro de cada
seo existem vrios artigos sobre textos
especficos, por exemplo, na seo de esportes
pode ter um artigo falando sobre o time A, outro
sobre time B e o outro sobre o time C. Um artigo
pode conter um elemento <header> que o
ttulo e um elemento <footer> que o rodap
do elemento.
<article>
<header>
<h1>Nova Vitria !</h1>
<p><time pubdate
datetime="2009-10-09T14:2808:00"></time></p>
</header>
<p>O time A ganhou novamente, se
continuar assim ser lder do
campeonato...</p>
<p>...</p>
<footer>
<a href="?
comments=1">Comentrios</a>
</footer>
</article>
<ASIDE>
Neste elemento esto contidas as informaes
que no esto relacionadas diretamente com o
texto. Como por exemplo: comerciais pagos,
links promocionais, etc.
<aside>
<h1>Tenha uma graduao !!! </h1>
<p><a href=?http://www.estacio.br?>
Estude na estcio</a></p>
</aside>
<H1>, <H2>, <H3>, <H4>, <H5>, e
<H6>
Elementos que representam o ttulo de
cada seo, sendo <h1> o maior ttulo
e <h6> o menor ttulo.
<body>
<h1>Maior </h1>
<h2>Menor 2 </h2>
<h3>Menor 3 </h3>
<h4>Menor 4 </h4>
<h5>Menor 5 </h5>
<h6>Menor 6 </h6>
</body>
<HGROUP>
Elemento usado em conjunto com as TAGs
anteriores para delimitar o ttulo da seo.
<hgroup>
</hgroup>
<HEADER>
Tambm utilizado para delimitar o ttulo da
seo, trabalha em conjunto com os elementos
anteriores, no entanto, no obrigatrio.
<article>
<header>
<hgroup>
</hgroup>
<p>O curso de HTML muito importante
</p>
</header>
<section>
<h1>O HTML 5</h1>
<p>Surgimento do HTML 5</p>
</section>
<section>
<h1>Tags</h1>
<p>Comandos de criao de pginas.</p>
</section>
</article>
<FOOTER>
Este elemento contm
basicamente as
informaes sobre o
contedo da seo, como
por exemplo o autor, links
relacionados, etc.
<footer>
<nav>
<p><a href="/credits.html">Crditos</a> ?
<a href="/tos.html">Termos Legais</a> ?
<a herf="/index.html">Mais Informaes</a>
</p>
</nav>
</footer>

Tag's Textuais
<P>
Elemento que representa um pargrafo.
<HR>
Elemento que representa uma quebra de
pargrafo ou tema exibindo uma linha
horizontal.
<p> Isto um pargrafo </p>

<hr />
<pre>
Line 1.
Line 2 is to the right of line 1.
Line 3 aligns with line 2.
</pre>
<PRE>
Este elemento apresenta um bloco de texto prformatado, preservando seu contedo.

Tag's Textuais
<BLOCKQUOTE>
Tem como funo exibir o texto indicando de
qual referncia foi retirado (citao).
<FIGURE>
Este elemento permite definir logicamente as
informaes de uma imagem. Trabalha com
<figcaption> e <img>.
Onde:
<figcaption> - Elemento que permite dar um
ttulo a uma imagem.
<img> - Elemento que exibe a imagem. Neste
exemplo o atributo src indica o endereo e o tipo
da imagem e o atributo alt mostrado caso a
imagem no possa ser exibida.
<blockquote
cite="http://www.quote.com/sample.ht
ml">
<p>Elemento textual. </p>
</blockquote>
<figure>
<figcaption>Foto de
Frias</figcaption>
<img src="stata.jpg" alt="Foto das
frias no Rio de Janeiro">
</figure>

Tag's Textuais
<DIV>
Elemento que representa um bloco de texto. As
TAGs <body>, <header>, <footer>, etc,
possuem regras de utilizao bem definidas.
Caso o desenvolvedor necessite da criao de
um bloco de texto que no se encaixe em
alguma regra defina de bloco, pode-se utilizar o
recurso da <div>. A <div> um bloco de texto
que pode ser usado em qualquer lugar do
documento. Geralmente a <div> usada para
diagramar o layout de um site.
<div> teste </div>

Tag's Semnticas
<A>
Elemento que representa um hiperlink
Atributos:
href = A URL que fornece o destino do
hiperlink.
target = nome de navegao ao contexto ou
palavra-chaves seguintes strings literais:
"_blank", "_self", "_parent", ou "_top".
<p>
<a
href="http://en.wikipedia.org/wiki/Cam
bera">Cambera</a>
is the capital city of Australia.
</p>

Tag's Semnticas
<EM>
Este elemento enfatiza um bloco de texto,
colocando-o em itlico.
<p><em>Cats</em> are cute animals.</p>
<STRONG>
Este elemento transforma um texto simples em
um texto de certa importncia, colocando-o em
negrito.
<p><em>Cats</em> are cute

animals.</p>
<p><strong><strong>Warning.</stro
ng> This dungeon is
dangerous.</strong></p>

Tag's Semnticas
<SMALL>
Este elemento diminui o tamanho do texto.
<S>
Este elemento transforma o texto em um
contedo no relevante.
<footer>
<p><small> copyright 2010
Example Corp.</small></p>
</footer>
<p>Buy our Iced Tea and Lemonade!
</p>
<p><s>Recommended retail price:
$3.99 per bottle</s></p>
<p><strong>Now selling for just
$2.99 a bottle!</strong></p>

Tag's Semnticas
<CITE>
Este elemento transforma o texto em uma
citao.
<Q>
Este elemento coloca aspas em um bloco de
texto.
<CODE>
Este elemento representa um fragmento de
cdigo de computador.
<p>My favorite movie is <cite>star

wars</cite>.</p>
<p>The man said <q>The quote is
input here</q>.</p>
<pre>
<code>
function Panel(element, canClose,
closeHandler) {
this.element = element;
this.canClose = canClose;
this.closeHandler = function () { if
(closeHandler) closeHandler() };
}
</code>
</pre>

Tag's Semnticas
<SPAN>
Elemento de utilizao genrica idntico ao
elemento <DIV>.
<BR>
Este elemento representa uma quebra de linha.
<span> Teste de exemplo </span>

<p>32 Vassar Street<br />
Cambridge, MA 02139
</p>

Listas
So elementos de ordenao de texto podendo
ser numeradas e no numeradas.
<OL>
Define uma lista numerada. Os itens da listas
so definidos pela tag <li>.
<ol>
<li>exemplo1</li>
<li>exemplo2</li>
<li>exemplo3</li>
</ol>
Atributos da lista:
reversed = altera a ordem da lista.
start = Valor inicial da lista
type = Altera o numerador da lista( ! A a I
i).

Listas
<UL>
Define uma lista no numerada. Utiliza os
mesmos atributos de <ol>.
<DL>
Elemento que textual que exibe uma lista de
definies, com termos especficos. Trabalha
com as tags <dt> termo a ser exibido e <dd>
elementos do termo.
<ul>
<li>exemplo1</li>
<li>exemplo2</li>
<li>exemplo3</li>
</ul>
<dl>
<dt>Carros</dt>
<dd>Uno</dd>
<dd>Gol</dd>
<dt>Motos</dt>
<dd>Honda</dd>
<dd>Yamaha</dd>
</dl>
INTRODUO CONSTRUO DE PGINAS ESTTICAS TABELAS

Tabelas
So elementos que representam dados de uma
ou mias dimenses. Podem ser utilizadas para
exibio de tabelas de preos de um site.
<TABLE>
Elemento bsico para criao da tabela.
<table>
<caption>Lista de preos</caption>
<thead>
<tr>
<th>Servio</th>
<th>Tempo</th>
<th>Valor</th>
</tr>
</thead>
<tbody>
<tr>
<th>Corte de Cabelo</th>
<td>10 Min</td>
<td>R$ 5,00</td>
</tr>
<tr>
<th>Manicure</th>
<td>30 Min</td>
<td>R$ 20,00</td>
</tr>
<tr>
<th>Pedicure</th>
<td>30 Min</td>
<td>R$ 10,00</td>
</tr>
</tbody>
</table>

Tabelas
Onde:
<CAPTION>
Elemento que indica o ttulo da tabela.
<THEAD>
Neste elemento encontram-se as linhas que formam o ttulo de cada coluna
da tabela.
<TBODY>
Neste elemento encontram-se os dados de cada coluna.
<TFOOT>
Neste elemento encontram-se as informaes finais de cada coluna.
<TR>
Elemento que cria uma linha na tabela.
<TD>
Elemento que cria uma coluna na tabela.
<TH>
Este elemento idntico ao <TD>, no entanto s utilizado dentro da TAG
de ttulo <TH>.

Vdeo
Anteriormente, para a exibio de vdeos em um documento
HTML, os desenvolvedores utilizavam a TAG <object> que
um container genrico para incorporar objetos estrangeiros
( plugins de terceiros ) a pgina. Devido a inconsistncia dos
navegadores, era necessrio replicar vrias linhas de cdigo
para que o vdeo pudesse ser exibido. O HTML 5 prov a TAG
<video> para eliminar os problemas de incompatibilidade
entre os navegadores.
<VIDEO>
Elemento que exibe vdeos ou filmes.
Atributos:
autoplay = "autoplay" ou "" (string vazia) ou sem atributo.
Todas vez que a pgina for recarregada, o vdeo se iniciar.
controls = "controls" ou "" (string vazia) ou sem atributo.
Ser exibido a interface de controle de vdeo.
loop = "loop" ou "" (string vazia) ou sem atributo. O vdeo
ser passado contnuamente.

Vdeo
poster = Endereo de uma imagem ser exibida
enquanto o vdeo no carrega.
height = Altura do vdeo em pixels
width = Largura do vdeo em pixels
muted = "muted" or ""ou "" (string vazia) ou sem
atributo. Estado do vdeo default com o udio
desligado.
src = URL do vdeo
<video controls
src="http://media.w3.org/2010/05/bun
ny/movie.ogv">
Seu navegador no suporta vdeos em
HTML 5
</video>

Audio
<AUDIO>
Elemento que permite tocar um arquivo de
udio. Com atributos semelhantes ao <video>.
<audio controls
src="http://media.w3.org/2010/07/bun
ny/04-Death_Becomes_Fur.oga">
Seu navegador no suporta udio em
HTML 5
</audio>
Unidade IV - LINGUAGEM DE MARCAO E ESTILOS - CSS

Definio
Conforme W3C, Cascading Style Sheets (CSS) um mecanismo simples para adicionar
estilo (por exemplo, fontes, cores, espaamento ) a documentos da Web.O CSS um
conjunto de comandos que alteram o comportamento dos elementos HTML 5.
4.2 Sintaxe
A regra CSS a unidade bsica de uma folha de estilo. Nessa definio o termo unidade
bsica significa a menor poro de cdigo capaz de produzir efeito de estilizao. Uma
regra CSS composta de duas partes: o seletor e a declarao. A declarao compreende
uma propriedade e um valor.
Onde:
seletor { propriedade: valor; }
Seletor: o alvo da regra CSS.
Declarao: Determina a regra.
h1, h2 {color: green }
h3, h4 & h5 {color: red }
h6 {color: black }
4.3 Seleo de elementos

No CSS, a seleo de elementos pode variar de uma forma simplificada at
padres contextuais ricos.
Tipos de seleo
Agrupamento - o CSS permite agrupar declaraes repetidas.
h1 { font-family: sans-serif }
equivalente a:
h1, h2, h3 { font-family: sans-serif }

4.3.1 Seletores descendentes
Um elemento pode estar contido dentro de outro elemento.
Exemplo:
<H1>Este texto <EM>muito</EM> importante</H1>
h1 { color: red } /* indica que todos os elementos h1 possuem a cor vermelha */
em { color: red } /* indica que todos os elementos em possuem a cor vermelha */
h1 em { color: blue } /* indica que os elementos em contidos em um elemento
h1 possuem a cor azul */
4.3.2 Seletores filhos
Um elemento filho caraterizado quando os elementos so separados por ">".
Exemplo:
div ol>li p {color: green }
Neste exemplo, todos os elementos p sero de cor verde quando estiverem
dentro de um elemento item <li>, filho de uma lista <ol> dentro de uma <div>.
4.3.3 Seletores por atributos

Especifica regras para os elementos que possuem determinado atributo.
Exemplo:
span[hello="Cleveland"][goodbye="Columbus"] { color: blue; }
A regra ser aplicada a todos os elementos span que possuem o atributo
hello="Cleveland" e o atributo goodbye="Columbus".
4.3.4 Seletores por classes
Uma classe permite atribuir um conjunto de regras a um determinado elemento.
determinado por asterstico ponto (*.) ou simplesmente ponto (. ).
Exemplo:
.pastoral { color: green } /* todos os elementos com a classe~=pastoral */
ou
*.pastoral { color: green } /* todos os elementos com a classe~=pastoral */
4.3.5 Seletores por ID
O atributo ID permite identificar um elemento nico no documento HTML. Para selecionar
este elemento basta utilizar o caracter ?#? seguindo pelo nome do elemento.
Exemplo:
h1#titulo1 { text-align: center } /* aplica a regra ao elemento h1 com o id=titulo */

Prepara AV1 Tecnologias para Internet I

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Prepara AV1 Tecnologias para Internet I

Hochgeladen von

Copyright:

Verfügbare Formate

TECNOLOGIAS PARA

Unidade I - O AMBIENTE INTERNET

CCT0412 - TECNOLOGIA PARA INTERNET I

CCT0412 - TECNOLOGIA PARA INTERNET I

CCT0412 - TECNOLOGIA PARA INTERNET I

CCT0412 - TECNOLOGIA PARA INTERNET I

Unidade II - INTRODUO AO HTML5

CCT0412 - TECNOLOGIA PARA INTERNET I

CCT0412 - TECNOLOGIA PARA INTERNET I

CCT0412 - TECNOLOGIA PARA INTERNET I

CCT0412 - TECNOLOGIA PARA INTERNET I

Unidade III - INTRODUO CONSTRUO DE PGINAS

Tag's estruturais do HTML5

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

<p> Isto um pargrafo </p>

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

<div> teste </div>

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

<p><em>Cats</em> are cute

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

<p>My favorite movie is <cite>star

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

<span> Teste de exemplo </span>

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS - TAGS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS TABELAS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS TABELAS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS TABELAS

CCT0412 - TECNOLOGIA PARA INTERNET I

INTRODUO CONSTRUO DE PGINAS ESTTICAS TABELAS

CCT0412 - TECNOLOGIA PARA INTERNET I