KADUNEW.COM/BLOG Tutoriais, Dicas e Artigos sobre Web Design, Web Standards, CSS, HTML, SEO e Programação web.

Arquivos na categoria: ‘CSS’

Logos CSS3 – 10 exemplos de logos desenhados com CSS3

CSS3

Veja 10 inspiradores exemplos de logos com CSS3. Os recursos de sombras, transparência, bordas arredondadas, fundos múltiplos são explorados ao máximo. Olhando os gráficos abaixo você poderia afirmar que foram feitos com algum programa gráfico tipo o Photoshop, mas não, os gráficos foram completamente desenhados usando os propriedades CSS3.
Continuar lendo…

Comentários (1)

Diferença entre as propriedades margin e padding do css

As propriedades margin e padding podem ser confusas para desenvolvedores iniciantes. Esse artigo é para aqueles que estão começando a aprender CSS. Aqui explico de forma bem detalhada as propriedades fundamentais do CSS, margin e padding. Saiba quando usar um ou o outro.
Continuar lendo…

Deixe um Comentário

Página de erro 404 animada com CSS

Página 404 animada com CSS
Este tutorial mostra como desenvolver uma página de erro 404 animada. Para tal efeito usamos algumas imagens e pequenas regras de CSS para animação. O código é simples e quem já possui um conhecimento em CSS entenderá rapidamente o significado das regras para esse efeito. Veja o resultado final da página de erro 404 animada.
Continuar lendo…

Deixe um Comentário

Ferramentas CSS3 online para Web Designers

CSS3

CSS3 continua a ganhar a cada dia mais e mais popularidade, está presente na maioria dos sites de quem trabalha com web, apesar de ainda dizerem ser cedo para aprender e aplicar as CSS3, já que as propriedades e seletores não são totalmente suportadas por todos os navegadores.
Continuar lendo…

Deixe um Comentário

Suporte dos navegadores para propriedades CSS3

CSS3 permite a você o poder de criar bordas arredondadas, adicionar sombra em textos sem o uso de imagens, inserir fontes e muitos outros efeitos com propriedades CSS3.Veja a lista de algumas propriedades CSS introduzida na CSS3 e seu suporte aos principais navegadores.
Continuar lendo

Comentário (2)

Como criar um layout de 3 colunas com CSS

Layout CSS com 3 colunas

Tutorial demonstrando como criar um Layout CSS com 3 colunas.

Existem dois tipos principais de layouts com CSS: largura fixa e de largura variável (conhecido também como, layout líquido ou layout fluido), esse último o site se ajusta ao tamanho da janela do navegador do usuário. Outra coisa que se pode fazer é deixar a coluna do conteúdo como uma largura variável e as colunas ao lado fixa. Nesse artigo vou mostrar como criar um layout fixo de 3 colunas.
Continuar lendo…

Comentário (2)

Mostrar legenda ao passar o mouse sobre imagens

Legenda com CSS
Vou mostrar um exemplo rápido para fazer o efeito de revelar a legenda de uma imagem apenas quando o usuário passar o mouse sobre a imagem. Normalmente se coloca a legenda logo abaixo da imagem, nesse caso a legenda aparecerá sobre a imagem e na parte inferior. O efeito é inteiramente feito com CSS, sem qualquer necessidade de JavaScript. É um ótimo efeito para ser usado em galerias de imagens para colocar a descrição da imagem quando o mouse estiver sobre a imagem.
Continuar lendo…

Comentário (2)

Gerador online de gradiente CSS3

Gerador de gradiente CSS3 online
Ultimate CSS Gradient Generator é uma ferramenta online gratuita para desenvolvedores web. Com ela você pode criar gradientes em uma interface semelhante a de criação de gradientes do Photoshop. Após criar seu gradiente personalizado ou escolher um dos padrões já existentes o aplicativo nos dá o código CSS3 gerado.
Continuar lendo…

Deixe um Comentário

Alterando cor da seleção padrão do texto com CSS3

exemplo css selection
Uma declaração CSS3 que poucos conhecem é capaz de alterar a cor padrão de uma seleção de texto na web, para uma cor de sua escolha. Sabemos que independente da cor da fonte e plano de fundo sempre que selecionamos um texto em uma página da web, a fonte por padrão é alterada para branco e a fundo para azul.
Continuar lendo…

Comentário (3)

10 efeitos com propriedades CSS3

CSS3

Firefox, Safari e Chrome já implementaram propriedades do CSS3. Para que funcionem, é necessário adicionarmos os prefixos -moz (para renderização no Firefox) e -webkit (para renderização nos navegadores Chrome e Safari). Ambos são soluções proprietárias dos fabricantes. Veja abaixo 10 efeitos das folhas de estilos CSS3.
Continuar lendo…

Comentário (8)