5 seletores CSS

seletores CSS

5 seletores CSS

Michelly Oliveira   14:30:00

Seletores estão entre as primeiras coisas que você deve aprender quando está começando a estudar CSS.  Aqui veremos 5 seletores CSS que você precisa saber!

Asterisco *

o asterisco tem como alvo todos os elementos em uma página. Muitos desenvolvedores o usam para zerar as margens e o preenchimento (margin e padding).

Ponto .

Esse é um seletor de classe. A diferença entre um identificador e uma classe é que, com  a classe você pode selecionar vários elementos. Use uma classe sempre que você precisar estilizar um grupo de elementos.

Hashtag #

O "jogo da velha" (ou hashtag), permite encontrar algum elemento com um identificador(id). Ele é um dos seletores mais usados. É importante lembrar que esse tipo de seletor tem uma especificidade maior que seletores de classe, e que um valor de id deve ser único em um mesmo documento.

Sinal de Positivo +

Esse é chamado de seletor adjacente.

Ele selecionará somente o elemento imediatamente após o elemento especificado anteriormente.

No exemplo da imagem, selecionará só o primeiro parágrafo após cada url na página, e fará que ele tenha a cor purple.

Sinal de Maior >

O combinador > seleciona os nós que são filhos diretos do elemento especificado anteriormente.

Um seletor #container > ul somente selecionará aquelas url que são filhas diretas de uma div com identificador nomeado como container.

Expressão regular para validar campo que aceita CPF ou CNPJ

regex

Expressão regular para validar campo que aceita CPF ou CNPJ

Michelly Oliveira   17:34:00

 

Esta solução valida estes formatos: 00000000000, 00000000000000, 000.000.000-00, 00.000.000/0000-00 e até 000000000-00 ou 00000000/0000-00, por exemplo. Os pontos e traços são opcionais em cada uma das posições.

O que não é aceito, por exemplo: 000-000-000-00 (mas pode ser alterado conforme nota abaixo)

Regex:

([0-9]{2}[\.]?[0-9]{3}[\.]?[0-9]{3}[\/]?[0-9]{4}[-]?[0-9]{2})|([0-9]{3}[\.]?[0-9]{3}[\.]?[0-9]{3}[-]?[0-9]{2})

Clique aqui e faça seus testes em realtime no regexpal.

Explicação:

[0-9]{2} Faixa de caracteres: 0 a 9, quantidade: 2 caracteres;
[0-9]{3} Faixa de caracteres: 0 a 9, quantidade: 3 caracteres;
[0-9]{4} Faixa de caracteres: 0 a 9, quantidade: 4 caracteres;
[\.]?Um ponto, opcional. Foi usado \ no ponto, pois ele sozinho é caractere especial;
[-]? Um traço, opcional (se acrescentar outros caracteres, comece pelo - sempre);
[\/]? Uma barra, opcional. Também "escapada" com \ pra agradar o PCRE;
(grupo1)|(grupo2) Se um dos grupos validar, a expressão é válida.
 
Caso queira aceitar outros separadores, basta acrescentar entre os [ ].
Exemplo: [-\.\/]? vai aceitar tanto - quanto . e / naquela posição (? = ou nada).
 
Para adaptar para outros "dialetos" de regexp, algumas variações possíveis seriam tirar o escape da barra (\/ => /) e opcionalmente colocar um ^ no começo e um $ no fim da linha.

Fonte: https://pt.stackoverflow.com/questions/11045/expressão-regular-para-validar-um-campo-que-aceita-cpf-ou-cnpj