Como selecionar segmentos específicos para html5 e css3 programação

Às vezes, você pode querer selecionar apenas segmentos específicos em sua página web HTML5 e CSS3. Dê uma olhada em como você deve se referir a alguém que não aprecia o seu talento de desenvolvimento web.

Definindo mais de um tipo de parágrafo

Além de seu mérito cultural, esta página é interessante porque tem três estilos de parágrafo diferentes. O parágrafo introdutório é normal. A citação é definido em itálico, e a atribuição é monospaced e direita; alinhados.

A citação no seguinte código foi gerado por um grande local: o Gerador de insulto de Shakespeare. Nada é mais gratificante do que dizer alguém fora em pentâmetro iâmbico.

quote.html

Citar literatura do Dia

Como dizer a alguém fora da maneira elegante:

Video: HTML5 Tutorials Playlist

[Tu] couro-gibão, cristal-botão, nó-pated, ágata-ring, vomitar-meia, caddis-liga, smooth-língua, bolsa espanhola!

-William Shakespeare (Henry IV Parte I)

Styling identificados nos números

Até agora, você já usou CSS para aplicar um estilo particular de um elemento em toda a página. Por exemplo, você pode adicionar um estilo para a marca, e esse estilo aplica-se a todos os parágrafos na página.



Às vezes (como na página insulto Shakespeare), você quer dar mais um elemento de um estilo. Você pode fazer isso, nomeando cada elemento e usando o nome na folha de estilo CSS. Veja como funciona:

  1. Adicionar um identidade atribuir a cada elemento HTML que pretende modificar.

  2. Fazer um estilo de CSS.

    Use um sinal de libra seguido de ID do elemento em CSS para especificar que você não está falando de um tipo de tag mais, mas um elemento específico: Por exemplo, o código CSS contém o seletor #atribuição, ou seja, “Aplicar este estilo para um elemento com o ID de atribuição.”

     #attribution {
  3. Adicione o estilo.

    Criar um estilo para a exibição de seu elemento chamado. Neste caso, você quer o parágrafo com o atribuição ID direita; alinhados, monospace, e um pouco menor do que o normal. Este estilo vai ser anexado somente ao elemento específico.

     #attribution {font: 80% monospace-text-align: right;}

O truque ID funciona muito bem em qualquer elemento nomeado. IDs têm de ser único, assim que esta técnica é melhor quando você tem um estilo que você deseja aplicar a apenas um elemento na página. Não importa qual elemento HTML que é. Se ele tem o ID citar, a #citar estilo é aplicado a ele. Você pode ter ambos os seletores ID e seletores comuns na mesma folha de estilo.


Publicações relacionadas