Como trabalhar com seletores css3
Video: Curso de CSS3 para iniciantes - Aula 03 - Seletores - universal, tag, id, atributo
Conteúdo
Em meados de 2010, web designers e desenvolvedores se alegrou como CSS3 começou a fazer o seu caminho para o mainstream. Desde aquela época, o suporte ao navegador para CSS3 tem aumentado e melhorado, embora CSS3 não é oficialmente um padrão W3C ainda.
Video: Curso de CSS3 para iniciantes - Aula 04 - Avançando os estudos de seletores
Na verdade, o único inconveniente (se você ainda quiser chamar assim) para a utilização desses seletores de hoje é que você pode ocasionalmente ainda precisa adicionar alguns prefixos específicas do navegador para o seu CSS para garantir que todos os estilos CSS3 aparecer correctamente no mais velho versões dos navegadores mais populares.
Para ilustrar, se todos os navegadores suportados do CSS3 colunas seletor, você só precisa especificar um único colunas declaração em seu estilo como este:
Video: Curso jQuery Básico - Seletores Hierárquicos #04
div {colunas: 100px 3}
No entanto, porque este selector não é suportado da mesma forma por todos os browsers populares, a solução é escrever sua declaração CSS3 único primeiro, e depois diretamente abaixo dela você vai incluir declarações duplicadas com prefixos específicas do navegador. Observe como os comentários CSS são adicionados ao CSS para identificar os navegadores associados a cada prefixo:
div {colunas: 100px 3--webkit-colunas: 100 p 3- / * Safari e Chrome * /-moz-colunas: 100 p 3- /* Raposa de fogo */}
Aqui está uma lista de prefixos CSS3 por navegador:
Video: Curso de CSS - Seletores avançados
navegador | Prefixo |
---|---|
Internet Explorer | -Senhora- |
Raposa de fogo | -moz- |
Google Chrome | -webkit- |
Safári | -webkit- |
Ópera | -o- ou -XV- |
Para obter uma lista up-to-date de suporte ao navegador para todas as propriedades CSS3, veja a tabela no w3schools.com.
Também certifique-se de baixar uma cópia gratuita da Revista Smashing Folha CSS3 fraude PDF, que pode ajudá-lo a descobrir como usar CSS3 em seus projetos web: Revista Smashing.