Precisa de um freelancer, códigos-fonte e exemplos completos? Bem-vindo(a) ao meu site. Além de realizar alguns serviços como freelancer eu tenho alguns códigos-fonte e exemplos completos de Java, Delphi, PHP, Python, C/C++, Hibernate, JPA, Spring, JSP, Servlets, Ruby, Ruby On Rails e muitas outras linguagens e frameworks. Veja como falar comigo clicando aqui.
Se você já leu algum
livro de JavaScript direcionado ao DHTML ou tem noções
de DHTML, então o conceito de IDs não será
novo para você. Caso isso seja novidade, não se
preocupe. Nas próximas partes do curso nós vamos
usar IDs constantemente.
IDs (pronuncia-se "aidís" e o singular é
a forma curta do inglês identity) são usados para
definir identidades aos vários elementos de uma página
web. Cada elemento deve ter um ID diferente. Uma vez definido
o ID, você pode manipular todas as referências desse
elemento por meio de script, como veremos mais adiante. Observe
o trecho de código seguinte:
<h2 id="titulo1">Como
aprender HTML</h2>
Aqui nós temos um título h2 com o ID de nome "titulo1".
Agora, em nenhum lugar da página você pode inserir
outro elemento com este mesmo ID ou os seus códigos não
funcionarão corretamente. Vamos a alguns testes:
Crie uma nova página e na parte <body></body>
insira três títulos, como mostra o seguinte código:
<h2>Saiba o que
está acontecendo hoje</h2>
<h2>Viaje pelo mundo gratuítamente</h2>
<h2 id="diferente">Notícias ao redor
do mundo</h2>
Veja que agora nós temos três titulos h2. O último
título possui um ID de nome "diferente". Vamos
ver como podemos torná-lo realmente diferente. Vá
na parte <head></head> da página e digite
o nosso código CSS:
<h2>Saiba o que está acontecendo hoje</h2>
<h2>Viaje pelo mundo gratuítamente</h2>
<h2 id="diferente">Notícias ao redor
do mundo</h2>
</body>
</html>
Execute a sua página agora e veja o resultado. Caso deseje,
você pode executar o arquivo lab1-10.htm
na pasta de exemplos. Vamos às considerações?
1) Analisando o código CSS na parte
<head></head>, podemos ver duas declarações.
A primeira afeta todos os elementos h2, como podemos ver em
seguida:
h2 {color: green; font-style:
italic}
Aqui os elementos estão com a cor do texto verde e o
estilo da fonte itálico.
2) A segunda parte da declaração
apresenta o estilo:
#diferente {color: red;
letter-spacing: 0.5em}
que define a cor do texto do elemento como sendo vermelha e
o espaçamento entre as letras de 0.5em (a notação
"em" representa o espaço entre os caracteres
mais o espaçamento padrão aplicado pelo browser).
Observe o símbolo "#" que antecede o nome dado
à declaração. Sempre que você desejar
aplicar estilos usando o seletor ID, deve usar este símbolo.
3) E finalmente podemos ver o elemento h2 com
o ID "diferente":
<h2 id="diferente">Notícias
ao redor do mundo</h2>
Veja que na declaração CSS você usou o símbolo
#, mas na hora de aplicar o estilo ao elemento, o símbolo
é retirado e a palavra ID é acrescentada. Na hora
de definir o ID do elemento, você pode fazê-lo usando
as aspas:
<h2 id="diferente">Notícias
ao redor do mundo</h2>
ou sem aspas:
<h2 id=diferente>Notícias
ao redor do mundo</h2>
É claro que o uso de aspas torna o código mais
dinâmico.
A título de exercício você está convidado
a escrever mais páginas fazendo uma combinação
do uso de classes, IDs e a declaração normal dos
estilos. Vá praticando com as propriedades vistas até
agora.
Todo o conteúdo deste site,
quando não devidamente observado, pertence a seus idealizadores
e não
poderá ser usado para outras finalidades senão estudo e
aprimoramento de técnicas de programação.
Certifique-se de ler asnotas legaisantes de proceder com
o acesso e leitura do
conteúdo disponibilizado nestas páginas.
Precisa de um freelancer, códigos-fonte e exemplos completos?
Códigos-fonte 
Bancos de Dados
Usuários On-Line
Como usar IDs como seletores
Veja dicas, truques e anotações de 
