Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Thebadashark2005

Imagens no topo do Site com CSS! Tem jeito?

Por , em Desenvolvimento frontend

Recommended Posts

Thebadashark2005    0

Thebadashark2005
Postado

Galera mais uma vez eu aqui recorrendo a vocês.

Bom é o seguinte estou construindo um site e gostaria que três imagens sempre aparecessem no topo de todas as paginas que fossem carregadas, e também não ficassem por cima do texto que vem logo abaixo. Estou utilizando algumas funções basicas em CSS e gostaria de saber se existe alguma maneira de fazer isso tb com as imagens todas no topo (esquerda, meio e direita ) das páginas. Só pra terem uma base todas possuem uma altura de 45 pixels.

 

Grato mais uma vez

 

Badshark

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

bem a inclusão de imagens no topo se for com a TAG <img> pode ser feita por SERVER-SIDE para facilitar

ou pode criar tres elementos no topo de todas as páginas e aplicar o css

 

#imgA{
background-image:url('img/fotosa.jpg');
width:[pixels];
height:[pixels];
}
#imgB{
background-image:url('img/fotosb.jpg');
width:[pixels];
height:[pixels];
}
#imgC{
background-image:url('img/fotosc.jpg');
width:[pixels];
height:[pixels];
}

<div id="imgA"></div>
<div id="imgB"></div>
<div id="imgC"></div>

falow abraço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thebadashark2005    0

Thebadashark2005
Postado

bem a inclusão de imagens no topo se for com a TAG <img> pode ser feita por SERVER-SIDE para facilitar

ou pode criar tres elementos no topo de todas as páginas e aplicar o css

 

#imgA{
background-image:url('img/fotosa.jpg');
width:[pixels];
height:[pixels];
}
#imgB{
background-image:url('img/fotosb.jpg');
width:[pixels];
height:[pixels];
}
#imgC{
background-image:url('img/fotosc.jpg');
width:[pixels];
height:[pixels];
}

<div id="imgA"></div>
<div id="imgB"></div>
<div id="imgC"></div>

falow abraço

Olá Silverfox valeu ai, mas não rolou segue os códigos pra ver se eu não fiz m.......

Abraço

Badshark

no css:

#imgA{
background-image:url("sites\css\style\logo_prev6.gif");
width:[100];
height:[45];
}
#imgB{
background-image:url("sites\css\style\Barratop_logo.gif");
width:[400];
height:[45];
}
#imgC{
background-image:url("sites\css\style\top_pontosnew.gif");
width:[200];
height:[45];
}

no htm

<html>
<head>
<title>Cabeçalho e Texto</title>
<link rel="stylesheet" href="\sites\css\style\posicion_image.css" type="text/css" />
</head>
<body>

<div id="imgA"></div>
<div id="imgB"></div>
<div id="imgC"></div>

<br><h1>Imagens disposição</h1>
<p>Página demonstrando a disposição de imagens na página.</p>

</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

o problema é o seguinte:

as barras estão invertidas:

background-image:url("sites\css\style\logo_prev6.gif");
certo:

background-image:url("sites/css/style/logo_prev6.gif");

não é pra usar as chavers era só uma indicação:

width:[100];
height:[45];
certo:

width:100px;
height:45px;

falow abraço ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thebadashark2005    0

Thebadashark2005
Postado

o problema é o seguinte:

as barras estão invertidas:

background-image:url("sites\css\style\logo_prev6.gif");
certo:

background-image:url("sites/css/style/logo_prev6.gif");

não é pra usar as chavers era só uma indicação:

width:[100];
height:[45];
certo:

width:100px;
height:45px;

falow abraço ;)

Silver vlw, as imagens apareceram! Mas estão (uma embaixo da outra) :wacko: sem querer abusar já abusando, como faço pra deixa-las em um única linha. Ou seja todas no topo da página uma do lado da outra tipo uma na esquerda, meio e direita.

 

Mais uma vez brigadão cara!

Abraço

Badshark

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito