Como mudar o tamanho da imagem que eu coloquei no firefox ?

[gustsec 0]

Oi! Eu criei um retangulo para colocar no meu site de 913 por 413. No css, eu fiz:

 

   #imageConteudo {

  	background-image: url('conteudo.jpg');
  	background-repeat:no-repeat;
   height:800px;
   width:100%;

  }

 

Mas eu não consigo aumentar mais do que eu declarei no Fireworks. Eu quero controlar isso no css. Afinal, alguem tem boa vontade de me passar tutoriais de como exportar site feito em fireworks para o css ? Eu nao consigo entender. Eu fi z um site em Fireworks, como colocar ele todo em CSS ?

[Thiago Moraes 32]

Faça o recorte do layout manualmente.

[Diéssica 140]

Não se faz site em Fireworks.

Desenha o layout no Fireworks e apenas recorta as partes dele, sem exportar para HTML. A exportação para HTML que o Fireworks faz é totalmente fora dos padrões, e o resultado final é inútil de tão estático.

 

Usa o Fireworks para recortar as imagens (não precisa fazer isso manualmente) e a diagrama o layout com HTML e CSS.

 

:seta: http://validator.w3.org/

[gustsec 0]

Olá!

Obrigado pelas respostas!

Quando eu disse fazer site, é exatamente fazer o layout no fireworks.

Eu fiz recortei o retangulo que eu fiz no fireworks para colocar no HTML/CSS, mas eu não consigo mudar o tamanho do retangulo a mais que eu coloquei no fireworks.

[Diéssica 140]

Eu fiz recortei o retangulo que eu fiz no fireworks para colocar no HTML/CSS, mas eu não consigo mudar o tamanho do retangulo a mais que eu coloquei no fireworks.

Ah ok.

 

Então tu não pegou aquele HTML que o Fireworks cria? Tu tá fazendo todo o HTML/ CSS manualmente?

 

Se usou o Fireworks só pra fazer o layout e recortar as partes dele e deixou a diagramação pra fazer manualmente, tá certo :)

[gustsec 0]

É exatamente isso Diéssica.

Eu estou fazendo todo o HTML/CSS manualmente, apenas estou utilizando o fireworks para fazer o layout, imagens e etc.

No caso, eu fiz um retangulo com alguns efeitos. E ali no fireworks eu defini o tamanho que quero e recortei e coloquei como jpg. Mas, quando eu vou alterar o tamanho... Por exemplo: No fireworks eu coloquei o retangulo com 900 de largura, no css, eu não consigo colocar com 950 de largura.

[Thiago Moraes 32]

Usa o Fireworks para recortar as imagens (não precisa fazer isso manualmente) e a diagrama o layout com HTML e CSS.

 

 

 

Se usou o Fireworks só pra fazer o layout e recortar as partes dele e deixou a diagramação pra fazer manualmente, tá certo :)

 

:upset: ???

[Diéssica 140]

:upset: ???

Não vi confusão. O que tu não entendeu?

 

Layout e recortes :seta: Fireworks

HTML/CSS :seta: Fazer manualmente, sem o uso do "Export" do Fireworks

 

O resultado final é o site.

 

É exatamente isso Diéssica.

Eu estou fazendo todo o HTML/CSS manualmente, apenas estou utilizando o fireworks para fazer o layout, imagens e etc.

No caso, eu fiz um retangulo com alguns efeitos. E ali no fireworks eu defini o tamanho que quero e recortei e coloquei como jpg. Mas, quando eu vou alterar o tamanho... Por exemplo: No fireworks eu coloquei o retangulo com 900 de largura, no css, eu não consigo colocar com 950 de largura.

Tu quer que esse retângulo "redimensione"?

 

Posta o teu código HTML e CSS.

[gustsec 0]

É exatamente isso Diéssica.

Veja o triangulo que eu criei no Fireworks: http://oi40.tinypic.com/qqbplv.jpg

Então, coloquei ele no meu código HTML/CSS:

 

<div id="imageConteudo"></div>

 

#imageConteudo {

    background-image: url('conteudo.jpg');
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;

}

 

Eu quero poder aumentar ou diminuir o triangulo, sem ter que fazer no fireworks, fazer direto pelo css.

 

Até mais!

[Diéssica 140]

Sabia que dá pra fazer só com CSS?

 

Se arrisca a tentar com CSS3?

[gustsec 0]

Eu gostaria. Mas, como ?

[Diéssica 140]

Eu gostaria. Mas, como ?

Primeiro, criamos um elemento div que vai funcionar como esse "retângulo":

<div id="retangulo">Conteúdo</div>

 

No CSS, determinamos o mesmo cinza da imagem (http://oi40.tinypic.com/qqbplv.jpg) como background, em hexadecimal:

#retangulo {
background:#9C9C9C;
}

 

Os cantos arredondados determinamos também no CSS, utilizando a propriedade border-radius do CSS3:

#retangulo {
background:#9C9C9C;
border-radius:10px;
}

 

E por fim, determinamos 8 pixels de padding, para que o elemento receba uma margem interna antes do conteúdo (é opcional, mas eu sempre determino):

#retangulo {
background:#9C9C9C;
border-radius:10px;
padding:8px;
}

 

O resultado final é o mesmo da imagem. :bye: