Articles of background image

Camada de colors semitransparente sobre a imagem de fundo?

Eu tenho um DIV e gostaria de colocar um padrão como pano de fundo. Esse padrão é cinza. Então, para torná-lo um pouco mais legal, eu gostaria de colocar uma “camada” de colors claras e transparentes. Abaixo está o que eu tentei, mas que não funcionou. Existe uma maneira de colocar a camada colorida sobre […]

Mudando a imagem de fundo com animações CSS3

Por que isso não está funcionando? O que estou fazendo de errado? CSS @-webkit-keyframes test { 0% { background-image: url(‘frame-01.png’); } 20% { background-image: url(‘frame-02.png’); } 40% { background-image: url(‘frame-03.png’); } 60% { background-image: url(‘frame-04.png’); } 80% { background-image: url(‘frame-05.png’); } 100% { background-image: url(‘frame-06.png’); } } div { float: left; width: 200px; height: 200px; […]

A incorporação de dados de imagem de fundo ao CSS é uma boa ou má prática para o Base64?

Eu estava olhando para a fonte de um userscript greasemonkey e notei o seguinte no seu CSS: .even { background: #fff url(data:image/gif;base64,R0lGODlhBgASALMAAOfn5+rq6uvr6+zs7O7u7vHx8fPz8/b29vj4+P39/f///wAAAAAAAAAAAAAAAAAAACwAAAAABgASAAAIMAAVCBxIsKDBgwgTDkzAsKGAhxARSJx4oKJFAxgzFtjIkYDHjwNCigxAsiSAkygDAgA7) repeat-x bottom} Eu posso entender que um script greasemonkey gostaria de agrupar qualquer coisa dentro da fonte, em vez de hospedá-lo em um servidor, isso é bastante óbvio. Mas como eu não tinha […]

IE 8: correção de tamanho de plano de fundo

Eu tentei adicionar o tamanho do plano de fundo para o IE, mas não está funcionando: HTML Notícias CSS: div#content h2#news { background: url(‘../images/news-background.jpg’) no-repeat; background-size: 100%; border-radius: 20px; color: #fff; margin: 20px 0 0 20px; padding: 8px 20px; width: 90%; -moz-background-size: 100%; -moz-border-radius: 20px; -webkit-background-size: 100%; -webkit-border-radius: 20px; } O que há de errado […]

Como fazer referência ao recurso de imagem do JSF como URL de imagem de plano de fundo do CSS

Muitas vezes, mudo as imagens dos meus botões usando o atributo image, mas alguém me disse que é uma boa prática fazê-lo usando .css eu tentei mas não consigo, o que estou fazendo errado? Foi o que eu fiz: 1-Os resources do meu projeto são armazenados assim: 2-É assim que eu criei o style.css para […]

Imagens de fundo css responsivas

Eu tenho um site (g-floors.eu) e eu quero fazer o fundo (em css eu defini uma imagem bg para o conteúdo) também responsivo. Infelizmente eu realmente não tenho nenhuma idéia de como fazer isso, exceto por uma coisa que eu posso pensar, mas é uma solução bastante. Criando várias imagens e, em seguida, usando o […]

Transição de imagem de fundo CSS3

Estou tentando fazer um efeito “fade-in fade-out” usando a transição CSS. Mas eu não consigo fazer isso funcionar com a imagem de fundo … O CSS: .title a { display: block; width: 340px; height: 338px; color: black; background: transparent; /* TRANSITION */ -webkit-transition: background 1s; -moz-transition: background 1s; -o-transition: background 1s; transition: background 1s; } […]

Posso ter várias imagens de plano de fundo usando CSS?

É possível ter duas imagens de fundo? Por exemplo, eu gostaria de ter uma imagem repetida na parte superior (repeat-x) e outra repetição em toda a página (repeat), onde a página inteira está atrás da que se repete na parte superior. Descobri que posso conseguir o efeito desejado para duas imagens de plano de fundo […]