Perguntas com a marcação «background-image»

Como uso gradientes CSS3 para o meu background-colore aplico a background-imagepara aplicar algum tipo de textura transparente clara?

1251 css  background-image  gradient 

As respostas desta pergunta são um esforço da comunidade . Edite as respostas existentes para melhorar esta postagem. No momento, não está aceitando novas respostas ou interações. Em que situações é mais apropriado usar uma IMGtag HTML para exibir uma imagem, em oposição a um CSS background-image, e vice-versa? Os …

777 html  css  image  background-image 

Eu estava olhando para a fonte de um script de usuário greasemonkey e notei o seguinte em seu css: .even { background: #fff url(data:image/gif;base64,R0lGODlhBgASALMAAOfn5+rq6uvr6+zs7O7u7vHx8fPz8/b29vj4+P39/f///wAAAAAAAAAAAAAAAAAAACwAAAAABgASAAAIMAAVCBxIsKDBgwgTDkzAsKGAhxARSJx4oKJFAxgzFtjIkYDHjwNCigxAsiSAkygDAgA7) repeat-x bottom} Compreendo que um script greasemonkey deseje agrupar tudo o que puder na fonte, em vez de hospedá-lo em um servidor, isso é óbvio o …

475 css  base64  background-image  data-uri 

Eu tenho um arquivo JPEG que estou usando como imagem de fundo para uma página de pesquisa e estou usando CSS para defini-lo porque estou trabalhando nos contextos Backbone.js : background-image: url("whatever.jpg"); Quero aplicar um filtro de desfoque CSS 3 apenas ao plano de fundo, mas não sei como estilizar …

467 css  background-image  css-filters 

Quero mostrar uma imagem de um URL com uma certa largura e altura, mesmo que tenha uma proporção de tamanho diferente. Então, eu quero redimensionar (mantendo a proporção) e depois cortar a imagem para o tamanho desejado. Eu posso redimensionar com a imgpropriedade html e posso cortar com background-image. Como …

334 html  css  background-image  image 

Eu tenho uma imagem de plano de fundo na seguinte div, mas a imagem é cortada: <div style='text-align:center;background-image: url(/media/img_1_bg.jpg);background-repeat:no-repeat;width:450px;height:900px;' id="mainpage" align="center"> Existe uma maneira de mostrar a imagem de fundo sem cortá-la?

334 html  css  background-image 

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

316 css  background-image 

Eu tenho uma DIV e gostaria de colocar um padrão como pano de fundo. Esse padrão é cinza. Então, para torná-lo um pouco mais agradável, eu gostaria de colocar uma "camada" de cor transparente e clara. Abaixo está o que eu tentei, mas que não funcionou. Existe uma maneira de …

213 css  background-image  background-color 

Eu tenho um site (g-floors.eu) e quero tornar o plano de fundo (em css, 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 em que consigo pensar, mas é uma solução alternativa. Criando várias imagens …

195 css  responsive-design  background-image  image-resizing 

Eu tenho um painel colorido em azul se este painel estiver sendo selecionado (clique nele). Além disso, adiciono um pequeno sinal ( .pngimagem) a esse painel, que indica que o painel selecionado já foi selecionado antes. Portanto, se o usuário vê, por exemplo, 10 painéis e 4 deles têm esse …

169 css  background  background-image  background-color 

É possível definir um background-imagepara um <path>elemento SVG ? Por exemplo, se eu definir o elemento class="wall", o estilo CSS .wall {fill: red;}funcionará, mas .wall{background-image: url(wall.jpg)}também não .wall {background-color: red;}.

166 html  css  image  svg  background-image 

Eu quero girar a imagem que é colocada no botão da barra de rolagem no Chrome. Agora eu tenho um CSS com este conteúdo: ::-webkit-scrollbar-button:vertical:decrement { background-image:url(images/arrowup.png) ; -webkit-transform:rotate(120deg); -moz-transform:rotate(120deg); background-repeat:no-repeat; background-position:center; background-color:#ECEEEF; border-color:#999; } Desejo rodar a imagem sem rodar o seu conteúdo.

160 css  background-image  image-rotation 

Meu objetivo é criar uma página HTML semelhante a uma "moldura". Em outras palavras, quero criar uma página em branco cercada por 4 fotos. Este é o meu código: <table> <tr> <td class="bTop" colspan="3"> </td> </tr> <tr> <td class="bLeft"> </td> <td class="middle"> </td> <td class="bRight"> </td> </tr> <tr> <td class="bBottom" …

141 html  css  html-table  background-image 

Estou tentando fazer um efeito "fade-in fade-out" usando a transição CSS. Mas 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; …

121 css  background  background-image  css-transitions 

Quero definir uma imagem de plano de fundo para divs diferentes, mas meus problemas são: O tamanho da imagem é fixo (60px). Variando o tamanho do div Como posso esticar a imagem de fundo para preencher todo o fundo do div? #div2{ background-image:url(http://s7.static.hootsuite.com/3-0-48/images/themes/classic/streams/message-gradient.png); height:180px; width:200px; border: 1px solid red; } …

102 css  html  background  background-image