← Desenvolvimento

Barra superior com links

Lida 1652 vezes

Offline

morzaban 
Membro
Mensagens 999 Gostos 0
Troféus totais: 31
Trófeus: (Ver todos)
Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3

Boas,

Será que alguém sabe como fazer uma barra idêntica à que aparece em todos os Blogs do Blogspot ou como a que aparece nos sites da Sapo?

Queria utilizar uma barra idêntica mas que utilizasse o ecrã inteiro (como a barra do Blogspot).

Thanks!
Offline

asturmas 
Administrador
Mensagens 19734 Gostos 50
Feedback +2

Troféus totais: 39
Trófeus: (Ver todos)
Mobile User Windows User Super Combination Combination Topic Starter 100 Poll Votes 50 Poll Votes 10 Poll Votes Poll Voter Poll Starter

Tipo barra de parcerias?
Offline

morzaban 
Membro
Mensagens 999 Gostos 0
Troféus totais: 31
Trófeus: (Ver todos)
Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3

Citação de: "asturmas"
Tipo barra de parcerias?

Podes ver um exemplo aqui: http://messenger.sapo.pt/

Não é preciso ser igual, mas teria a mesma utilidade.
Offline

asturmas 
Administrador
Mensagens 19734 Gostos 50
Feedback +2

Troféus totais: 39
Trófeus: (Ver todos)
Mobile User Windows User Super Combination Combination Topic Starter 100 Poll Votes 50 Poll Votes 10 Poll Votes Poll Voter Poll Starter

Isso e em simples html..
Offline

Ricardo75 
Membro
Mensagens 1660 Gostos 0
Troféus totais: 28
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

isso deve ser algo do tipo:

NO HTML:
Código: [Seleccione]
<div id="links-rede">CONTEUDO</div>

NO CSS:
Código: [Seleccione]
#links-rede {
position: absolute;
top: 0px;
text-align: center;
width: 100%;
/* Isto podes alterar, é só para ver alguma coisa nos testes */
background-color: blue;
color: white;
height: 20px;
/* FIM */
}


se a barra ficar por cima do cabeçalho vais ao css e
Código: [Seleccione]
body {
margin-top: 20px;
}